listview.separator showing blank screen in flutter

Viewed 49

listview.separator not showing any items only blank screen, the list is linked with firestore storage... is my code even right?? please help

class _SpecialOffersState extends State<SpecialOffers> {
final Stream<QuerySnapshot> _userStream =
  FirebaseFirestore.instance.collection('med_cntr').snapshots();

@override
Widget build(BuildContext context) {
return Column(
  children: [
   
    SizedBox(height: getProportionateScreenWidth(5)),
    
    StreamBuilder<QuerySnapshot>(
      stream: _userStream,
      builder:
          (BuildContext context, AsyncSnapshot<QuerySnapshot> snapshot) {
        if (snapshot.hasError) {
          return Text('Something went wrong');
        }

        if (snapshot.connectionState == ConnectionState.waiting) {
          return Center(
            child: CircularProgressIndicator(),
          );
        }

        return Expanded(
          child: SizedBox(
            height: 150.0,
            child: ListView.separated(
              scrollDirection: Axis.horizontal,
              padding: EdgeInsets.all(12.0),
              itemCount: 10,
              separatorBuilder: (context, idx) {
                return SizedBox(width: 12);
              },
              itemBuilder: (BuildContext context, int index) {
                return Card(
                  clipBehavior: Clip.antiAliasWithSaveLayer,
                  shape: RoundedRectangleBorder(
                    borderRadius: BorderRadius.circular(12.0),
                  ),
                  child: Stack(
                    children: [
                      Positioned.fill(
                        child: Image.network(
                          snapshot.data?.docs[index]['coverArt'],
                          fit: BoxFit.cover,
                        ),
                      ),
                      Positioned(
                        bottom: 0,
                        left: 0,
                        right: 0,
                        child: Container(
                            height: 80.0,
                            decoration: BoxDecoration(
                              gradient: LinearGradient(
                                begin: Alignment.bottomCenter,
                                end: Alignment.topCenter,
                                colors: [
                                  Colors.black.withOpacity(0.6),
                                  Colors.transparent
                                ],
                              ),
                            )),
                      ),
                      Positioned(
                        bottom: 8,
                        left: 8,
                        child: Text(
                          snapshot.data?.docs[index]['name'],
                          style: TextStyle(
                              color: Colors.white,
                              fontWeight: FontWeight.bold),
                        ),
                      ),
                    ],
                  ),
                );
              },
            ),
          ),
        );
      },
    ),
  ],
);

errors shown in the console:

  1. RenderFlex children have non-zero flex but incoming height constraints are unbounded.

  2. Invalid argument(s): No host specified in URI file:///

1 Answers

remove Expanded outside ListView and set height - width for card

try:

class _SpecialOffersState extends State<SpecialOffers> {
  final Stream<QuerySnapshot> _userStream =
  FirebaseFirestore.instance.collection('med_cntr').snapshots();

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [

        SizedBox(height: getProportionateScreenWidth(5)),

        StreamBuilder<QuerySnapshot>(
          stream: _userStream,
          builder:
              (BuildContext context, AsyncSnapshot<QuerySnapshot> snapshot) {
            if (snapshot.hasError) {
              return Text('Something went wrong');
            }

            if (snapshot.connectionState == ConnectionState.waiting) {
              return Center(
                child: CircularProgressIndicator(),
              );
            }

            return SizedBox(
              height: 150.0,
              child: ListView.separated(
                scrollDirection: Axis.horizontal,
                padding: EdgeInsets.all(12.0),
                itemCount: 10,
                separatorBuilder: (context, idx) {
                  return SizedBox(width: 12);
                },
                itemBuilder: (BuildContext context, int index) {
                  return SizedBox(
                    height: 150.0,
                    width: 150,
                    child: Card(
                      clipBehavior: Clip.antiAliasWithSaveLayer,
                      shape: RoundedRectangleBorder(
                        borderRadius: BorderRadius.circular(12.0),
                      ),
                      child: Stack(
                        children: [
                          Positioned.fill(
                            child: Image.network(
                              snapshot.data?.docs[index]['coverArt'],
                              fit: BoxFit.cover,
                            ),
                          ),
                          Positioned(
                            bottom: 0,
                            left: 0,
                            right: 0,
                            child: Container(
                                height: 80.0,
                                decoration: BoxDecoration(
                                  gradient: LinearGradient(
                                    begin: Alignment.bottomCenter,
                                    end: Alignment.topCenter,
                                    colors: [
                                      Colors.black.withOpacity(0.6),
                                      Colors.transparent
                                    ],
                                  ),
                                )),
                          ),
                          Positioned(
                            bottom: 8,
                            left: 8,
                            child: Text(
                              snapshot.data?.docs[index]['name'],
                              style: TextStyle(
                                  color: Colors.white,
                                  fontWeight: FontWeight.bold),
                            ),
                          ),
                        ],
                      ),
                    ),
                  );
                },
              ),
            );
          },
        ),
      ],
    ); 
  }
}
Related