yflutter_widgets 0.2.9 yflutter_widgets: ^0.2.9 copied to clipboard
A Flutter Widget Lib, including ListView, Divider, Tags Grid and son.
YFlutterWidgets #
A Flutter Widget Lib, including ListView, Divider, Tags Grid and so on.
Note:
- This plugin is still under development,
- Feel free to create a pull request,
- and contact me anytime if you have questions.
TOC #
Custom_Card: #
A custom card view.
- Based on Container().
- Could customized color: Background and Shadow,
- Margins: LTFB,
- @required: Inside View(Widget).
Tags_Grid_View: #
A tags grid view, including tag item.
- The tag can be selected(single),
- Could customized color: selected and unselected color,
- 3 Items in each row.
Divider: #
A horizontal divider.
- Provide 3 styles and can be customized with color and edgeInsets,
- Will support vertical soon.
DashLine: #
A customized Dash line separator.
ListView: #
A ListView with native features:
- Provide 3 types of List Header:
- AppBar level header,
- Zoom/Pin header,
- Normal Scroll Header;
- Section feature for ListView,
- List / Section border with Style of SYCustomCard.
How to USE: #
Custom_Card #
- insideWidget: Put the inside display widgets here,
- sEdgeInsets: Add the LTRB margin of the card,
- backgroundColor: Default White,
- shadowColor: Default 0x14000000
YCustomCard(
sEdgeInsets: EdgeInsets.only(left: 16, top: 20, right: 16),
insideWidget: YTagsGridView(
tagList: ["1", "2", "3", "4", "5"],
selectedIndex: 0,
selectable: true,
),
),
Tags_Grid_View: #
Setup Tags List, and selected index if selectable.
YTagsGridView(
tagList: ["1", "2", "3", "4", "5"],
selectedIndex: 0,
selectable: true,
),
Use selectCallback to get click callback.
selectCallback(index){
print("$index button clicked");
}
Divider: #
Divide(type: DivideType.iOSTableDefault),
Dash_Line: #
- axis: Direction of the line, Default Horizontal,
- dotSize: The width and height of each dot, Default is 3 by 3, round,
- count: The count of dots in the line.
- color: The color of dots, Default 0xff2c2c2c.
YDashedLine(count: 20, dotSize: Size(8,8),),
ListView: #
Body:
YListView(
type: HeaderType.Normal,
borderType: BorderTypeBorderType.ListWhole,
headerHeight: 150,
numOfSection: _sectionCount,
numberOfRowsInSection: _numberOfRowsInSection,
sectionHeight: _sectionHeight,
cellHeight: _cellHeight,
sectionHeader: _headerOfSectionAtIndex,
cell: _cellOfRowAtIndex,
),
Configure and Setup:
int _sectionCount = 3;
// Get row count.
int _numberOfRowsInSection(int sectionIndex) {
if (sectionIndex == 0) {
return 5;
} else if (sectionIndex == 1) {
return 10;
} else {
return 20;
}
}
// Section header widget builder.
Widget _headerOfSectionAtIndex(BuildContext context, int sectionIndex) {
return InkWell(
onTap: () {
print('click section header. -> section:$sectionIndex');
},
child: Container(
alignment: Alignment.centerLeft,
padding: EdgeInsets.only(left: 16.0),
height: 100,
child: Text('I am section header -> section:$sectionIndex'),
),
);
}
// cell item widget builder.
Widget _cellOfRowAtIndex(BuildContext context, int sectionIndex, int rowIndex) {
return InkWell(
onTap: () {
print('click cell item. -> section:$sectionIndex row:$rowIndex');
},
child: Container(
padding: EdgeInsets.only(left: 16.0),
alignment: Alignment.centerLeft,
decoration: BoxDecoration(
border: Border(
bottom: BorderSide(
color: Color.fromRGBO(240, 240, 240, 1),
))),
height: 50.0,
child: Text('I am cell -> section:$sectionIndex row$rowIndex'),
),
);
}
// Each section header height;
double _sectionHeight(BuildContext context, int sectionIndex) {
return 50.0;
}
// Each cell item widget height.
double _cellHeight(BuildContext context, int section, int rowIndex) {
return 50.0;
}
THANKS #
Many thanks for: fluro provider flutter_easyrefresh extended_nested_scroll_view ScreenUtil