ListView Separated Widget in Flutter

Types of ListViews:

 

  • ListView
  • ListView.builder
  • ListView.separated
  • ListView.custom

 

IndexedWidgetBuilders

 

  • itemBuilder
  • separatorBuilder

 

Example:

 

import 'dart:html';


import 'package:flutter/material.dart';


void main() => DemoApp();


class DemoApp extends StatefulWidget {

  @override

  State<StatefulWidget> createState() {

    return DemoAppState();

  }

}


class DemoAppState extends State<DemoApp> {

  final person = List<String>.generate(50, (i) => 'Person ${i + 1}');

  @override

  Widget build(BuildContext context) {

    return MaterialApp(

      home: Scaffold(

        appBar: AppBar(

          title: const Text("Demo App"),

        ),

        body: ListView.separated(

          itemCount: person.length,

          itemBuilder: (BuildContext context, int index) {

            return Card(

              child: Padding(

                child: Text(person[index]),

                padding: EdgeInsets.all(50),

              ),

            );

          },

          separatorBuilder: (BuildContext context, int index) {

            return Divider();

          },

        ),

      ),

    );

  }

}


Video Link:

 
Post a Comment (0)
Previous Post Next Post