section_view

Creator: coderz1093

Last updated:

Add to Cart

Description:

section view

Notice: 2.0.0 has break changing

The header sticky will use flutter_list_view to implement
Refresh control will construct by user, like pull_to_refresh

SectionView<AlphabetHeader<CountryModel>, CountryModel>(
source: _filterCountries,
onFetchListData: (header) => header.items,
enableSticky: true,
alphabetAlign: Alignment.center,
alphabetInset: const EdgeInsets.all(4.0),
headerBuilder: getDefaultHeaderBuilder((d) => d.alphabet),
alphabetBuilder: getDefaultAlphabetBuilder((d) => d.alphabet),
tipBuilder: getDefaultTipBuilder((d) => d.alphabet),
refreshBuilder: (child) {
return SmartRefresher(
enablePullDown: true,
enablePullUp: false,
header: const WaterDropHeader(),
controller: _refreshController,
onRefresh: _onRefresh,
child: child);
},
itemBuilder:
(context, itemData, itemIndex, headerData, headerIndex) {
return Padding(
padding: const EdgeInsets.only(right: 12.0),
child: ListTile(
title: Text(itemData.name),
trailing: Text(itemData.phoneCode)),
);
},
),
copied to clipboard
Features #

Show with section view
Alphabet support
Refresh support

Screen #
















Usage #
Firstly, you can construct data like
List<GroupModel> data = [
GroupModel(name: "Group 1", items: [
ItemModel(name: "Item 1-1"),
ItemModel(name: "Item 1-2"),
ItemModel(name: "Item 1-3"),
ItemModel(name: "Item 1-4"),
ItemModel(name: "Item 1-5"),
]),
GroupModel(name: "Group 2", items: [
ItemModel(name: "Item 2-1"),
ItemModel(name: "Item 2-2"),
ItemModel(name: "Item 2-3"),
ItemModel(name: "Item 2-4"),
ItemModel(name: "Item 2-5"),
]),
GroupModel(name: "Group 3", items: [
ItemModel(name: "Item 3-1"),
ItemModel(name: "Item 3-2"),
ItemModel(name: "Item 3-3"),
ItemModel(name: "Item 3-4"),
ItemModel(name: "Item 3-5"),
]),
];
copied to clipboard
After that, you can put code into you project like as below
SectionView<GroupModel, ItemModel>(
source: data,
onFetchListData: (header) => header.items,
headerBuilder: getDefaultHeaderBuilder((d) => d.name,
bkColor: Colors.green,
style:
const TextStyle(fontSize: 18, color: Colors.white)),
itemBuilder:
(context, itemData, itemIndex, headerData, headerIndex) =>
ListTile(
title: Text(itemData.name),
)),
copied to clipboard
Additional information #
If you want to custom your UI, please follow /example/lib/fullSectionList.dart
Todo #

Provide tailer load more functionality
Provide programaticly invoke onRefresh.

License

For personal and professional use. You cannot resell or redistribute these repositories in their original state.

Customer Reviews

There are no reviews.