in flutter, How can I read data reactively with getx + supabase(1.0.0-dev.4)?

Question

I am currently using Supabase version 1.0.0-dev.4. However, I am not sure how to read the data in realtime (via get). The emulator only shows a white screen. I'd be really happy if this could be resolved. Please Help me!! Please Help me!! Please Help me!! Please Help me!! Please Help me!!

Here is the code.

[getx controller code]

class PostController extends GetxController {
  RxList<PostModel> _postList = <PostModel>[].obs;
  RxList<PostModel> get postList => _postList;
  @override
  void onInit() {
    super.onInit();
    readPostData();
  }
 //Stream read Data
  Stream<List<PostModel>> readPostData() {
    final res = supabase
        .from('post')
        .stream(['postid'])
        .order('postid', ascending: false)
        .execute();
    List resList = res as List;
    _postList.value = resList.map((e) => PostModel.frommap(e)).toList();
    return _postList.stream;
  }
}

[view]

import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:mannergamer/controller/create_post_controller/post_controller.dart';

class HomePostList extends StatefulWidget {
  @override
  State<HomePostList> createState() => _HomePostListState();
}

class _HomePostListState extends State<HomePostList> {
  //Post CRUD GetxController 선언
  final PostController _postController = Get.put(PostController());

  @override
  Widget build(BuildContext context) {
    return GetX<PostController>(
      builder: (_) => ListView.separated(
        padding: EdgeInsets.only(top: 10),
        separatorBuilder: (BuildContext context, int index) {
          return Divider(
            thickness: 1,
          );
        },
        itemCount: _postController.postList.length,
        itemBuilder: (BuildContext context, int index) {
          return ListTile(
            onTap: () => {Get.toNamed('/postDetail')},
            leading: CircleAvatar(
              child: Icon(Icons.person_outline_rounded),
            ),
            //제목
            title: Text(_postController.postList[index].title, maxLines: 1),
            subtitle: Column(
              children: [
                //유저이름
                Row(
                  children: [
                    Text(_postController.postList[index].username!),
                    SizedBox(
                      width: double.minPositive,
                    ),
                  ],
                ),
                Row(
                  children: [
                    //게임모드
                    Text(_postController.postList[index].gamemode!),
                    SizedBox(width: 10),
                    Expanded(
                        // 게시 날짜 ex)1일 전
                        child: Text(_postController.postList[index].maintext)),
                    Row(
                      children: [
                        Icon(Icons.chat_bubble_outline, size: 15),
                        Text('1'), //체팅 한 유저 수
                        Icon(Icons.favorite_border_outlined, size: 15),
                        Text('1'), //좋아요 누른 유저 수
                      ],
                    ),
                  ],
                ),
              ],
            ),
          );
        },
      ),
    );
  }
}

[model]

export 'post_model.dart';

class PostModel {
  final int? postid;
  final String? username;
  final String title;
  final String maintext;
  final String? gamemode;
  final String? postion;
  final String? tear;

  PostModel({
    this.postid,
    this.username,
    required this.title,
    required this.maintext,
    this.gamemode,
    this.postion,
    this.tear,
  });

  PostModel copyWith({
    int? postid,
    String? username,
    String? title,
    String? maintext,
    String? gamemode,
    String? postion,
    String? tear,
  }) {
    return PostModel(
      postid: postid ?? this.postid,
      username: username ?? this.username,
      title: title ?? this.title,
      maintext: maintext ?? this.maintext,
      gamemode: gamemode ?? this.gamemode,
      postion: postion ?? this.postion,
      tear: tear ?? this.tear,
    );
  }

  Map<String, dynamic> toMap() {
    return <String, dynamic>{
      'postid': postid,
      'username': username,
      'title': title,
      'maintext': maintext,
      'gamemode': gamemode,
      'postion': postion,
      'tear': tear,
    };
  }

  factory PostModel.frommap(Map<String, dynamic> map) {
    return PostModel(
      postid: map['postid'] != null ? map['postid'] as int : null,
      username: map['username'] != null ? map['username'] as String : null,
      title: map['title'] as String,
      maintext: map['maintext'] as String,
      gamemode: map['gamemode'] != null ? map['gamemode'] as String : null,
      postion: map['postion'] != null ? map['postion'] as String : null,
      tear: map['tear'] != null ? map['tear'] as String : null,
    );
  }
}

score 0 · Answer 1 · answered Aug 17 '22 at 06:37

.stream() method returns a type stream, so you cannot type cast it as List. You can loop through each stream, and each list item of those stream like this to convert the Stream<List<Map<String, dynamic>>> to Stream<List<PostModel>> like this:

Stream<List<PostModel>> readPostData() {
    return supabase
        .from('post')
        .stream(['postid'])
        .order('postid', ascending: false)
        .execute()
        .map((list) => list.map(PostModel.frommap).toList());
  }

in flutter, How can I read data reactively with getx + supabase(1.0.0-dev.4)?

1 Answers1