Create a switch list tile with separators in flutter

user_9438598 0
Viewed 2247

I am trying to create a list of switch tiles in flutter which have separators between the tiles.

I've tried doing this by using ListTile.divideTiles:

ListView(
                  children: ListTile.divideTiles(
                    context: context,
                    tiles: [
                      SwitchListTile(
                        secondary: Icon(Icons.signal_cellular_4_bar),
                        title: Text(
                          "First Tile",
                        ),
                        value: var1,
                        onChanged: (bool value) {
                          setState(
                            () {
                              var1= value;
                            },
                          );
                        },
                      ),
                      SwitchListTile(
                        secondary: Icon(Icons.swap_vert),
                        title: Text(
                          "Second Tile",
                            ),
                        value: var2,
                        onChanged: (bool value) {
                          setState(
                            () {
                              var2= value;
                            },
                          );
                        },
                      ),
                    ],
                  ),
                ),

But when I tried running the code I got the following error:

"type '_SyncIterable<Widget>' is not a subtype of type 'List<Widget>'"

Who do I create a list of switch tiles with separator?

flutter-layout dart flutter list listview
2 Answers

Please try this.

Add .toList() to the end of your ListTile.divideTiles

ListTile.divideTiles(
  // all your code
  // all your code
  // all your code
).toList()
user_132222740

Why don't you try ListView.separated ?

int _selectedIndex = 0;
return ListView.separated(
  //Here's your separator
  separatorBuilder: (BuildContext context, int index) {
    return SizedBox(
      height: 10, //Whatever spacing you want.
    );
  },
  physics: BouncingScrollPhysics(),
  scrollDirection: Axis.vertical,
  shrinkWrap: true,
  itemCount: 2, //How many tiles you want
  padding: EdgeInsets.all(10),
  itemBuilder: (BuildContext context, int index) {
    return ClipRRect( //round up the edges for nicer look
      borderRadius: BorderRadius.all(Radius.circular(5)),
      //And here's your tile
      child: SwitchListTile(
        tileColor: Colors.grey[900],
        selectedTileColor: Colors.black,
        selected: index == _selectedIndex,
        value: ... ,
        onChanged: (v) {
          
             ... 


        },
        title: Text('Tile #' + index.toString()),
        subtitle: Text('-'),
      ), 
    );
  },
);
user_43441520
Related