Wiktor Kęska
Wiktor Kęska

Reputation: 561

Flutter: How to use Wrap instead of ListView.builder?

In FutureBuilder, I need to create Wrap with elements but I don't know how.

FutureBuilder(
  future: _getCategories(),
  builder: (BuildContext context, AsyncSnapshot snapshot){
    if(snapshot.data == null){
      return Text("Wait...");
    }else{
      return ListView.builder(
        itemCount: snapshot.data.length,
        itemBuilder: (BuildContext context, int index){
          return  Text(snapshot.data[index].category);
        },
      );
    }
  },
)

I need to replace ListView.builder with something like Wrap.builder or something else.

Upvotes: 11

Views: 25373

Answers (3)

Muhammad Muzamal
Muhammad Muzamal

Reputation: 1

 Wrap(
       children: snapshot. data.map((e) => CustomCard(data: e,)).toList().cast<Widget>(),
);

Upvotes: 0

CopsOnRoad
CopsOnRoad

Reputation: 268264

Let's say this is your List:

List<int> _items = List.generate(10, (i) => i);

You can use it in Wrap:

  1. Using List.map

    Wrap(
      direction: Axis.vertical,
      children: _items.map((i) => Text('Item $i')).toList(),
    )
    
  2. Using for-each

    Wrap(
      direction: Axis.vertical,
      children: [
        for (var i in _items)
          Text('Item $i'),
      ],
    )
    

To answer your question:

Wrap(
  children: snapshot.data.map((item) => Text(item.category)).toList().cast<Widget>(),
)

Upvotes: 50

koushik datta
koushik datta

Reputation: 339

Here's a solution,

List tags = ['one','two'];    
Wrap(
          children: [
            for (var item in tags)
              Padding(
                padding: const EdgeInsets.all(8.0),
                child: Chip(
                  
                  label: Text(item),
                ),
              )
          ],
        ),

Upvotes: 6

Related Questions