diff --git a/example/lib/main.dart b/example/lib/main.dart index 84b8e635..daf6be8c 100644 --- a/example/lib/main.dart +++ b/example/lib/main.dart @@ -22,17 +22,12 @@ import 'package:ui_kit/components/image/gf_image_overlay.dart'; import 'package:ui_kit/components/button_bar/gf_button_bar.dart'; import 'package:ui_kit/types/gf_type.dart'; -import 'package:ui_kit/components/image/gf_image_overlay.dart'; import 'package:ui_kit/shape/gf_shape.dart'; import 'package:ui_kit/components/slider/gf_slider.dart'; -import 'package:ui_kit/shape/gf_shape.dart'; -import 'package:ui_kit/components/toggle/gf_toggle.dart'; -import 'package:ui_kit/types/gf_toggle_type.dart'; import 'package:flutter/cupertino.dart'; -import 'package:ui_kit/components/header/gf_header.dart'; +import 'package:ui_kit/size/gf_size.dart'; import 'package:ui_kit/position/gf_position.dart'; - -import 'package:ui_kit/components/toast/gf_toast.dart'; +import 'package:ui_kit/components/tabs/gf_tabs.dart'; final List imageList = [ "https://cdn.pixabay.com/photo/2017/12/03/18/04/christmas-balls-2995437_960_720.jpg", @@ -52,12 +47,8 @@ class MyApp extends StatelessWidget { primarySwatch: Colors.blue, ), -debugShowCheckedModeBanner: false, - -// home: MyHomePage(title: 'UI_KIT_EXAMPLE'), - home: MyHomePage( - title: 'UI KIT', - ), + debugShowCheckedModeBanner: false, + home: MyHomePage(title: 'UI_KIT_EXAMPLE'), ); } } @@ -75,203 +66,144 @@ class _MyHomePageState extends State { bool switchValue = true; @override Widget build(BuildContext context) { - var screenWidth = MediaQuery.of(context).size.width; - var screenHeight = MediaQuery.of(context).size.height; - return Scaffold( appBar: AppBar( title: Text(widget.title), ), - - body: - - SingleChildScrollView( - child: Column( - children: [ - -// GFCard( -//// boxFit: BoxFit.cover, -//// colorFilter: new ColorFilter.mode( -//// Colors.black.withOpacity(0.67), BlendMode.darken), -// image: Image.asset("lib/assets/food.jpeg"), -//// imageOverlay: AssetImage("lib/assets/food.jpeg"), -// titlePosition: GFPosition.end, -// title: GFListItem( -// avatar: GFAvatar( -// child: Text("tb"), -// ), -// title: Text( -// 'title', -// style: TextStyle(color: Colors.grey), -// ), -// subTitle: Text( -// 'subtitle', -// style: TextStyle(color: Colors.grey), -// ), -// icon: GFIconButton( -// onPressed: null, -// icon: Icon(Icons.favorite_border), -// type: GFType.transparent, -// ), -// ), -// ), - -// -// GFCard( -// title: GFListItem( -// title: Text('dcrfvjn'), -// subTitle: Text('fghjk'), -// -// ), -// -// ), - - GFListTile( - avatar: GFAvatar(), - - icon: Icon(Icons.description), - title: Text('Header'), - subTitle: Text('Sub Header'), - description: Text('Lorem ipsum gf header used to show the header of the list tile'), - ), - Container( - margin: EdgeInsets.only(top:10), - child: GFToast( -// -// -// -// button: GFButton( -// onPressed: null, -// type: GFType.outline, -// text: 'Accept', + body: SingleChildScrollView( + child: Column( + mainAxisAlignment: MainAxisAlignment.center, + crossAxisAlignment: CrossAxisAlignment.center, + children: [ +// Container( +// height: 300.0, +// child: DefaultTabController( +// length: 2, +// child: Scaffold( +// appBar: AppBar( +// bottom: TabBar( +// indicator: UnderlineTabIndicator( +// borderSide: BorderSide(color: Color(0xDD613896), width: 2.0), +// insets: EdgeInsets.fromLTRB(5.0, 0.0, 5.0, 4.0), +// ), +// tabs: [ +// Tab(icon: Icon(Icons.directions_car), text: "Non persistent",), +// Tab(icon: Icon(Icons.directions_transit), text: "Persistent"), +// ], +// ), +// title: Text('Persistent Tab Demo'), +// ), +// body: TabBarView( +// children: [ +// Text("cdx"), +// Text("cdv") +// ], +// ), +// ), +// ), // ), - text: 'Marked as Favorite.', + + GFSlider( +// pagerSize: 12.0, +// activeIndicator: Colors.pink, +// passiveIndicator: Colors.pink.withOpacity(0.4), + viewportFraction: 0.9, + aspectRatio: 2.0, +// autoPlay: true, + enlargeMainPage: true, + pagination: true, + items: imageList.map( + (url) { + return Container( + margin: EdgeInsets.all(5.0), + child: ClipRRect( + borderRadius: BorderRadius.all(Radius.circular(5.0)), + child: Image.network( + url, + fit: BoxFit.cover, + width: 1000.0, + ), + ), + ); + }, + ).toList(), + onPageChanged: (index) { + setState(() { + index; + }); + }, ), - ), - Container( - margin: EdgeInsets.only(left: 10, right: 10, top: 10, bottom: 10), - child: Row( - mainAxisAlignment: MainAxisAlignment.spaceBetween, - children: [ - GFToggle( - onChanged: null, - value: null, - type: GFToggleType.android, - duration: Duration(milliseconds: 400), - ), - GFToggle( - onChanged: null, - value: null, - type: GFToggleType.ios, - duration: Duration(milliseconds: 400), + + GFTabs( + initialIndex: 0, + length: 3, + tabs: [ + GFButton( + onPressed: null, + child: Text("share"), + icon: Icon(Icons.share), ), - GFToggle( - onChanged: null, - value: null, - type: GFToggleType.custom, - duration: Duration(milliseconds: 400), + Tab( + icon: Icon(Icons.error), + child: Text( + "Orders", + ), ), - GFToggle( - onChanged: (val) { - print(val); - }, - value: null, - type: GFToggleType.square, - duration: Duration(milliseconds: 400), + Tab( + child: Text( + "Pastry", + ), ), ], + tabBarView: TabBarView( + children: [ + Container( + color: Colors.red, + child: Column( + mainAxisAlignment: MainAxisAlignment.center, + crossAxisAlignment: CrossAxisAlignment.center, + children: [ + RawMaterialButton(onPressed: null, child: Text("fv"),), + FlatButton(onPressed: null, child: Text("cds")), + Icon(Icons.directions_railway), + GFButton( + onPressed: null, + child: Text("share"), + icon: Icon(Icons.share), + type: GFType.transparent, + shape: GFShape.pills, + ), + ], + ), + ), + Icon(Icons.directions_car), + Icon(Icons.directions_transit), + ], + ), +// indicatorColor: Colors.teal, +// indicatorSize: TabBarIndicatorSize.label, +// labelColor: Colors.lightGreen, +// unselectedLabelColor: Colors.black, +// labelStyle: TextStyle( +// fontWeight: FontWeight.w500, +// fontSize: 13.0, +// color: Colors.deepOrange, +// fontFamily: 'OpenSansBold', +// ), +// unselectedLabelStyle: TextStyle( +// fontWeight: FontWeight.w500, +// fontSize: 13.0, +// color: Colors.black, +// fontFamily: 'OpenSansBold', +// ), ), - ), - - Container( -// padding: EdgeInsets.only(left: 20, right: 20), - child: GFHeader( -// icon: Icon(Icons.image, color: Colors.white,), - text: 'GET FLUTTER HEADER', -//textColor: Colors.red, - dividerWidth: 20, -//backgroundImage: NetworkImage('https://cdn.pixabay.com/photo/2017/12/03/18/04/christmas-balls-2995437_960_720.jpg'), -//showDivider: false, - -// textColor: Colors.black, -// dividerColor: Colors.red, -//dividerAlignment: Alignment.center, - - - -// child: Text('GF HEADER ', ), -// dividercolor: GFColor.warning, -// dividerBorderRadius: BorderRadius.all(Radius.circular(0)), - ), - ) - - ], - ), - ) - // body: DefaultTabController( - // length: 3, - // child: Scaffold( - // appBar: AppBar( - // bottom: TabBar( - // tabs: [ - // Tab(icon: Icon(Icons.directions_car)), - // Tab(icon: Icon(Icons.directions_transit)), - // Tab(icon: Icon(Icons.directions_bike)), - // ], - // ), - // title: Text('Tabs Demo'), - // ), - // body: TabBarView( - // children: [ - // Icon(Icons.directions_car), - // Icon(Icons.directions_transit), - // Icon(Icons.directions_bike), - // ], - // ), - // ), - // ), -// SingleChildScrollView( -// child: Column( -// mainAxisAlignment: MainAxisAlignment.center, -// crossAxisAlignment: CrossAxisAlignment.center, -// children: [ - -// GFSlider( -//// pagerSize: 12.0, -//// activeIndicator: Colors.pink, -//// passiveIndicator: Colors.pink.withOpacity(0.4), -// viewportFraction: 0.9, -// aspectRatio: 2.0, -//// autoPlay: true, -// enlargeMainPage: true, -// pagination: true, -// items: imageList.map( -// (url) { -// return Container( -// margin: EdgeInsets.all(5.0), -// child: ClipRRect( -// borderRadius: BorderRadius.all(Radius.circular(5.0)), -// child: Image.network( -// url, -// fit: BoxFit.cover, -// width: 1000.0, -// ), -// ), -// ); -// }, -// ).toList(), -// onPageChanged: (index) { -// setState(() { -// index; -// }); -// }, -// ), // GFSlider( // autoPlay: true, // viewportFraction: 1.0, // aspectRatio: MediaQuery.of(context).size.aspectRatio, -// items: imageList.map((url) { +// items: imageList.map( +// (url) { // return Container( // margin: EdgeInsets.all(5.0), // child: ClipRRect( @@ -291,470 +223,268 @@ class _MyHomePageState extends State { // }); // }, // ), - -// GFCard( -// boxFit: BoxFit.cover, -// colorFilter: new ColorFilter.mode( -// Colors.black.withOpacity(0.67), BlendMode.darken), -// image: Image.asset("lib/assets/food.jpeg"), -//// imageOverlay: AssetImage("lib/assets/food.jpeg"), -// titlePosition: GFPosition.end, -// title: GFTitleBar( -// avatar: GFAvatar( -// child: Text("tb"), -// ), -// title: Text( -// 'title', -// style: TextStyle(color: Colors.grey), -// ), -// subTitle: Text( -// 'subtitle', -// style: TextStyle(color: Colors.grey), -// ), -// icon: GFIconButton( -// onPressed: null, -// icon: Icon(Icons.favorite_border), -// type: GFType.transparent, -// ), -// ), -// content: Text( -// "Flutter " -// "Flutter is Google's mobile UI framework for crafting" -// " high-quality native interfaces on iOS and Android in " -// "Flutter ", -// style: TextStyle(color: Colors.grey), -// ), -// buttonBar: GFButtonBar( -// mainAxisSize: MainAxisSize.min, -// children: [ -// GFButton( -// onPressed: null, -// child: Text("favorite"), -// icon: Icon(Icons.favorite_border), -// type: GFType.transparent, -// ), -// GFButton( -// onPressed: null, -// child: Text("share"), -// icon: Icon(Icons.share), -// type: GFType.outline, -// ), -// ], -// ), -// ), - -// GFButtonBar( -// mainAxisSize: MainAxisSize.min, -// children: [ -// GFButton(onPressed: null, child: Text("like"), icon: Icon(Icons.favorite_border), type: GFType.transparent,), -// GFButton(onPressed: null, child: Text("comment"),), -// GFButton(onPressed: null, child: Text("share"), icon: Icon(Icons.share), type: GFType.outline,), -// ], -// ), -// -// GFTitleBar( -// avatar: GFAvatar( -// child: Text("tb"), -// ), -// title: Text('title'), -// subTitle: Text('subtitle'), -// icon: GFIconButton( -// onPressed: null, -// type: GFType.transparent, -// icon: Icon(Icons.favorite_border), -// ), -// ), - -// GFImageOverlay( -// width: MediaQuery.of(context).size.width, -// margin: EdgeInsets.all(16.0), -// padding: EdgeInsets.all(16.0), -// child: Column( -// children: [ -// new Text( -// 'Hello world', -// style: TextStyle(color: Colors.white), -// ), -// new Text( -// 'Hello world', -// style: TextStyle(color: Colors.white), -// ), -// new Text( -// 'Hello world', -// style: TextStyle(color: Colors.white), -// ), -// new Text( -// 'Hello world', -// style: TextStyle(color: Colors.white), -// ), -// new Text( -// 'Hello world', -// style: TextStyle(color: Colors.white), -// ), -// new Text( -// 'Hello world', -// style: TextStyle(color: Colors.white), -// ), -// new Text( -// 'Hello world', -// style: TextStyle(color: Colors.white), -// ), -// new Text( -// 'Hello world', -// style: TextStyle(color: Colors.white), -// ), -// new Text( -// 'Hello world', -// style: TextStyle(color: Colors.white), -// ), -// new Text( -// 'Hello world', -// style: TextStyle(color: Colors.white), -// ), -// new Text( -// 'Hello world', -// style: TextStyle(color: Colors.white), -// ), -// new Text( -// 'Hello world', -// style: TextStyle(color: Colors.white), -// ), -// ], -// ), -//// color: Colors.orange, -// image: AssetImage("lib/assets/food.jpeg"), -// boxFit: BoxFit.cover, -// colorFilter: new ColorFilter.mode( -// Colors.black.withOpacity(0.6), BlendMode.darken), -// borderRadius: new BorderRadius.circular(5.0), -//// border: Border.all(color: Colors.pink, width: 2.0), -// ), - - // Card( - // child: Column( - // children: [ - // Text("czsd"), - // Row( - // children: [ - // OutlineButton( - // onPressed: null, - // child: Text("dscds"), - // color: Colors.orange, - // ), - // FlatButton(onPressed: null, child: Text("dchbvj")) - // ], - // ) - // ], - // ), - // ), - - // GFButtonBar( - // mainAxisSize: MainAxisSize.min, - // children: [ - // GFButton( - // onPressed: null, - // child: Text("like"), - // icon: Icon(Icons.favorite_border), - // type: GFType.transparent, - // ), - // GFButton( - // onPressed: null, - // child: Text("comment"), - // ), - // GFButton( - // onPressed: null, - // child: Text("share"), - // icon: Icon(Icons.share), - // type: GFType.outline, - // ), - // ], - // ), - - // GFTitleBar( - // avatar: GFAvatar( - // child: Text("tb"), - // ), - // title: Text('title'), - // subTitle: Text('subtitle'), - // icon: GFIconButton( - // type: GFType.transparent, - // icon: Icon(Icons.favorite_border), - // ), - // ), - -// GFCard( - -// headertype: GFAtb(), - -// po - -// image - -// overlaytext - -// content: Text("content"), - -// buttonbar: gfbb() - -// ), - -// - -// gfbb( - -// children[ - -// - -// ] - -// ) - -// GFimageoverlay() - -// GFAvatar( -// // radius: 20.0, + GFCard( + boxFit: BoxFit.cover, + colorFilter: new ColorFilter.mode( + Colors.black.withOpacity(0.67), BlendMode.darken), + image: Image.asset("lib/assets/food.jpeg"), +// imageOverlay: AssetImage("lib/assets/food.jpeg"), + titlePosition: GFPosition.end, + title: GFListItem( + avatar: GFAvatar( + child: Text("tb"), + ), + title: Text( + 'title', + style: TextStyle(color: Colors.grey), + ), + subTitle: Text( + 'subtitle', + style: TextStyle(color: Colors.grey), + ), + icon: GFIconButton( + onPressed: null, + icon: Icon(Icons.favorite_border), + type: GFType.transparent, + ), + ), + content: Text( + "Flutter " + "Flutter is Google's mobile UI framework for crafting" + " high-quality native interfaces on iOS and Android in " + "Flutter ", + style: TextStyle(color: Colors.grey), + ), + buttonBar: GFButtonBar( + mainAxisSize: MainAxisSize.min, + children: [ + GFButton( + onPressed: null, + child: Text("favorite"), + icon: Icon(Icons.favorite_border), + type: GFType.transparent, + ), + GFButton( + onPressed: null, + child: Text("share"), + icon: Icon(Icons.share), + type: GFType.outline, + ), + ], + ), + ), + GFButtonBar( + mainAxisSize: MainAxisSize.min, + children: [ + GFButton( + onPressed: null, + child: Text("like"), + icon: Icon(Icons.favorite_border), + type: GFType.transparent, + ), + GFButton( + onPressed: null, + child: Text("comment"), + ), + GFButton( + onPressed: null, + child: Text("share"), + icon: Icon(Icons.share), + type: GFType.outline, + ), + ], + ), + GFListItem( + avatar: GFAvatar( + child: Text("tb"), + ), + title: Text('title'), + subTitle: Text('subtitle'), + icon: GFIconButton( + onPressed: null, + type: GFType.transparent, + icon: Icon(Icons.favorite_border), + ), + ), + GFImageOverlay( + width: MediaQuery.of(context).size.width, + margin: EdgeInsets.all(16.0), + padding: EdgeInsets.all(16.0), + child: Column( + children: [ + new Text( + 'Hello world', + style: TextStyle(color: Colors.white), + ), + new Text( + 'Hello world', + style: TextStyle(color: Colors.white), + ), + new Text( + 'Hello world', + style: TextStyle(color: Colors.white), + ), + new Text( + 'Hello world', + style: TextStyle(color: Colors.white), + ), + new Text( + 'Hello world', + style: TextStyle(color: Colors.white), + ), + new Text( + 'Hello world', + style: TextStyle(color: Colors.white), + ), + new Text( + 'Hello world', + style: TextStyle(color: Colors.white), + ), + new Text( + 'Hello world', + style: TextStyle(color: Colors.white), + ), + new Text( + 'Hello world', + style: TextStyle(color: Colors.white), + ), + new Text( + 'Hello world', + style: TextStyle(color: Colors.white), + ), + new Text( + 'Hello world', + style: TextStyle(color: Colors.white), + ), + new Text( + 'Hello world', + style: TextStyle(color: Colors.white), + ), + ], + ), +// color: Colors.orange, + image: AssetImage("lib/assets/food.jpeg"), + boxFit: BoxFit.cover, + colorFilter: new ColorFilter.mode( + Colors.black.withOpacity(0.6), BlendMode.darken), + borderRadius: new BorderRadius.circular(5.0), +// border: Border.all(color: Colors.pink, width: 2.0), + ), + GFAvatar( + // radius: 20.0, // maxRadius: 50, -// child: Text("de"), + child: Text("de"), // backgroundColor: Colors.pink, - -// backgroundImage: , - +// +//// backgroundImage: , +// // foregroundColor: Colors.deepOrangeAccent, - - // shape: GFShape.square, - +// +// shape: GFShape.square, +// // size: GFSize.medium, - +// // borderRadius: BorderRadius.circular(20.0), - // ), - - // GFIconBadges( - // onPressed: null, - // child: GFIconButton( - // onPressed: null, - // icon: Icon(Icons.ac_unit), - // ), - // counterChild: GFBadge( - // text: '12', + ), + GFIconBadges( + onPressed: null, + child: GFIconButton( + onPressed: null, + icon: Icon(Icons.ac_unit), + ), + counterChild: GFBadge( + text: '12', // color: GFColor.dark, - +// // shape: GFShape.circle, - +// // size: GFSize.small, - +// // border: BorderSide(color: Colors.pink, width: 1.0, style: BorderStyle.solid), - +// // textColor: GFColor.white, - +// // textStyle: TextStyle(fontWeight: FontWeight.w500, fontSize: 8.0), - +// // borderShape: RoundedRectangleBorder(side: BorderSide(color: Colors.orange, width: 2.0, style: BorderStyle.solid), borderRadius: BorderRadius.zero), - // ), - // ), - - // GFIconButton( - // onPressed: null, - - // icon: Icon(Icons.ac_unit), - + ), + ), + GFIconButton( + onPressed: null, + icon: Icon(Icons.ac_unit), // iconSize: 12.0, - // type: GFType.solid, - // shape: GFShape.pills, - // size: GFSize.large, - // buttonBoxShadow: true, - // color: GFColor.primary, - // boxShadow: BoxShadow( - // color: Colors.pink, - // blurRadius: 2.0, - // spreadRadius: 1.0, - // offset: Offset.zero, - // ), - // borderSide: BorderSide(color: Colors.pink, width: 1.0, style: BorderStyle.solid), - // borderShape: RoundedRectangleBorder(side: BorderSide(color: Colors.pink, width: 2.0, style: BorderStyle.solid), borderRadius: BorderRadius.zero), - // ), - -// GFButtonBadge( -// onPressed: null, - -// // position: GFIconPosition.start, - -// // borderSide: BorderSide(color: Colors.pink, width: 1.0, style: BorderStyle.solid), - -// // borderShape: RoundedRectangleBorder(side: BorderSide(color: Colors.pink, width: 2.0, style: BorderStyle.solid), borderRadius: BorderRadius.zero), - -// text: 'goodies', - -// // color: GFColor.danger, - -// // shape: GFShape.pills, - -// // type: GFType.outline, - -// // size: GFSize.small, - -// counterChild: GFBadge( -// child: Text("12"), - -// // color: GFColor.dark, - -// // shape: GFShape.circle, - -// // size: GFSize.small, - -// // border: BorderSide(color: Colors.pink, width: 1.0, style: BorderStyle.solid), - -// // textColor: GFColor.white, - -// // textStyle: TextStyle(fontWeight: FontWeight.w500, fontSize: 8.0), -// ), -// ), - -// GFBadge( -// text: '12', - -// // color: GFColor.dark, - -// // shape: GFShape.circle, - -// // size: GFSize.small, - -// // border: BorderSide(color: Colors.pink, width: 1.0, style: BorderStyle.solid), - -// // textColor: GFColor.white, - -// // textStyle: TextStyle(fontWeight: FontWeight.w500, fontSize: 8.0), -// ), - -// GFButton( -// // type: GFType.solid, - -// // shape: GFShape.pills, - -// text: 'goodies', - -// onPressed: () {}, - + ), + GFButtonBadge( + onPressed: null, +// position: GFIconPosition.start, +// borderSide: BorderSide(color: Colors.pink, width: 1.0, style: BorderStyle.solid), +// borderShape: RoundedRectangleBorder(side: BorderSide(color: Colors.pink, width: 2.0, style: BorderStyle.solid), borderRadius: BorderRadius.zero), + text: 'goodies', +// color: GFColor.danger, +// shape: GFShape.pills, +// type: GFType.outline, +// size: GFSize.small, + counterChild: GFBadge( + child: Text("12"), +// color: GFColor.dark, +// shape: GFShape.circle, +// size: GFSize.small, +// border: BorderSide(color: Colors.pink, width: 1.0, style: BorderStyle.solid), +// textColor: GFColor.white, +// textStyle: TextStyle(fontWeight: FontWeight.w500, fontSize: 8.0), + ), + ), + GFBadge( + text: '12', +// color: GFColor.dark, +// shape: GFShape.circle, +// size: GFSize.small, +// border: BorderSide(color: Colors.pink, width: 1.0, style: BorderStyle.solid), +// textColor: GFColor.white, +// textStyle: TextStyle(fontWeight: FontWeight.w500, fontSize: 8.0), + ), + GFButton( +// type: GFType.solid, +// shape: GFShape.pills, + text: 'goodies', + onPressed: () {}, // textStyle: TextStyle(fontWeight: FontWeight.w500, fontSize: 8.0), - // size: GFSize.large, - // buttonBoxShadow: true, - // blockButton: true, - // fullWidthButton: true, - // color: GFColor.primary, - // textColor: GFColor.secondary, - // icon: Icon(Icons.error, color: Colors.white,), - // position: GFIconPosition.start, - // boxShadow: BoxShadow( - // color: Colors.pink, - // blurRadius: 2.0, - // spreadRadius: 1.0, - // offset: Offset.zero, - // ), -// ), -// GFIconButton( -// onPressed: null, -// icon: Icon(Icons.ac_unit), -//// iconSize: 12.0, -//// type: GFType.solid, -//// shape: GFShape.pills, -//// size: GFSize.large, -//// buttonBoxShadow: true, -//// color: GFColor.primary, -//// boxShadow: BoxShadow( -//// color: Colors.pink, -//// blurRadius: 2.0, -//// spreadRadius: 1.0, -//// offset: Offset.zero, -//// ), -//// borderSide: BorderSide(color: Colors.pink, width: 1.0, style: BorderStyle.solid), -//// borderShape: RoundedRectangleBorder(side: BorderSide(color: Colors.pink, width: 2.0, style: BorderStyle.solid), borderRadius: BorderRadius.zero), -// ), -// GFButtonBadge( -// onPressed: null, -//// position: GFIconPosition.start, -//// borderSide: BorderSide(color: Colors.pink, width: 1.0, style: BorderStyle.solid), -//// borderShape: RoundedRectangleBorder(side: BorderSide(color: Colors.pink, width: 2.0, style: BorderStyle.solid), borderRadius: BorderRadius.zero), -// text: 'goodies', -//// color: GFColor.danger, -//// shape: GFShape.pills, -//// type: GFType.outline, -//// size: GFSize.small, -// counterChild: GFBadge( -// child: Text("12"), -//// color: GFColor.dark, -//// shape: GFShape.circle, -//// size: GFSize.small, -//// border: BorderSide(color: Colors.pink, width: 1.0, style: BorderStyle.solid), -//// textColor: GFColor.white, -//// textStyle: TextStyle(fontWeight: FontWeight.w500, fontSize: 8.0), -// ), -// ), -// GFBadge( -// text: '12', -//// color: GFColor.dark, -//// shape: GFShape.circle, -//// size: GFSize.small, -//// border: BorderSide(color: Colors.pink, width: 1.0, style: BorderStyle.solid), -//// textColor: GFColor.white, -//// textStyle: TextStyle(fontWeight: FontWeight.w500, fontSize: 8.0), -// ), -// GFButton( -//// type: GFType.solid, -//// shape: GFShape.pills, -// text: 'goodies', -// onPressed: () {}, -//// textStyle: TextStyle(fontWeight: FontWeight.w500, fontSize: 8.0), -//// size: GFSize.large, -//// buttonBoxShadow: true, -//// blockButton: true, -//// fullWidthButton: true, -//// color: GFColor.primary, -//// textColor: GFColor.secondary, -//// icon: Icon(Icons.error, color: Colors.white,), -//// position: GFIconPosition.start, -//// boxShadow: BoxShadow( -//// color: Colors.pink, -//// blurRadius: 2.0, -//// spreadRadius: 1.0, -//// offset: Offset.zero, -//// ), -//// borderSide: BorderSide(color: Colors.pink, width: 1.0, style: BorderStyle.solid), -//// borderShape: RoundedRectangleBorder(side: BorderSide(color: Colors.pink, width: 2.0, style: BorderStyle.solid), borderRadius: BorderRadius.zero), -// ), -// ], -// ), -// ) - // ) +// borderSide: BorderSide(color: Colors.pink, width: 1.0, style: BorderStyle.solid), +// borderShape: RoundedRectangleBorder(side: BorderSide(color: Colors.pink, width: 2.0, style: BorderStyle.solid), borderRadius: BorderRadius.zero), + ), + ], + ), + ), ); } } diff --git a/lib/components/card/gf_card.dart b/lib/components/card/gf_card.dart index b46b59b3..1d1e479f 100644 --- a/lib/components/card/gf_card.dart +++ b/lib/components/card/gf_card.dart @@ -1,7 +1,7 @@ import 'package:flutter/cupertino.dart'; import 'package:flutter/material.dart'; import 'package:ui_kit/components/button_bar/gf_button_bar.dart'; -import 'package:ui_kit/components/list_item/gf_list_item.dart'; +import 'package:ui_kit/components/list_tile/gf_list_tile.dart'; import 'package:ui_kit/components/image/gf_image_overlay.dart'; import 'package:ui_kit/position/gf_position.dart'; @@ -106,9 +106,9 @@ class GFCard extends StatelessWidget { titlePosition == GFPosition.start ? image != null ? image : Container(): title != null ? title : Container(), Padding( padding: padding, - child: content, + child: content != null ? content : Container(), ), - buttonBar, + buttonBar == null ? Container() : buttonBar, ], ); diff --git a/lib/components/slider/gf_slider.dart b/lib/components/slider/gf_slider.dart index ce04c443..852403e4 100644 --- a/lib/components/slider/gf_slider.dart +++ b/lib/components/slider/gf_slider.dart @@ -1,5 +1,4 @@ import 'dart:async'; -import 'dart:ffi'; import 'package:flutter/material.dart'; List map(List list, Function handler) { diff --git a/lib/components/tabs/gf_tabs.dart b/lib/components/tabs/gf_tabs.dart index e69de29b..6226d7cf 100644 --- a/lib/components/tabs/gf_tabs.dart +++ b/lib/components/tabs/gf_tabs.dart @@ -0,0 +1,206 @@ +import 'package:flutter/material.dart'; +import 'package:flutter/foundation.dart'; +import 'package:flutter/rendering.dart'; +import 'package:flutter/widgets.dart'; +import 'package:ui_kit/components/button/gf_button.dart'; + + +class GFTabs extends StatefulWidget { + GFTabs({ + Key key, + this.initialIndex = 0, + @required this.length, + this.height, + this.tabBarColor, + this.indicatorColor, + this.indicatorWeight = 2.0, + this.indicatorPadding = EdgeInsets.zero, + this.indicator, + this.indicatorSize, + this.labelColor, + this.labelStyle, + this.labelPadding, + this.unselectedLabelColor, + this.unselectedLabelStyle, + this.tabBarView, + this.tabs, + }): + assert(length != null && length >= 0), + assert(initialIndex != null && initialIndex >= 0 && (length == 0 || initialIndex < length)); + + /// The initial index of the selected tab. Defaults to zero. + final int initialIndex; + + /// The total number of tabs. Typically greater than one. Must match [TabBar.tabs]'s and + /// [TabBarView.children]'s length. + final int length; + + /// Sets [GFTabs] height + final double height; + + /// Sets [TabBar] color using material color [Color] + final Color tabBarColor; + + /// The color of the line that appears below the selected tab. + /// + /// If this parameter is null, then the value of the Theme's indicatorColor + /// property is used. + /// + /// If [indicator] is specified, this property is ignored. + final Color indicatorColor; + + /// The thickness of the line that appears below the selected tab. + /// + /// The value of this parameter must be greater than zero and its default + /// value is 2.0. + /// + /// If [indicator] is specified, this property is ignored. + final double indicatorWeight; + + /// The horizontal padding for the line that appears below the selected tab. + /// + /// For [isScrollable] tab bars, specifying [kTabLabelPadding] will align + /// the indicator with the tab's text for [Tab] widgets and all but the + /// shortest [Tab.text] values. + /// + /// The [EdgeInsets.top] and [EdgeInsets.bottom] values of the + /// [indicatorPadding] are ignored. + /// + /// The default value of [indicatorPadding] is [EdgeInsets.zero]. + /// + /// If [indicator] is specified, this property is ignored. + final EdgeInsetsGeometry indicatorPadding; + + /// Defines the appearance of the selected tab indicator. + /// + /// If [indicator] is specified, the [indicatorColor], [indicatorWeight], + /// and [indicatorPadding] properties are ignored. + /// + /// The default, underline-style, selected tab indicator can be defined with + /// [UnderlineTabIndicator]. + /// + /// The indicator's size is based on the tab's bounds. If [indicatorSize] + /// is [TabBarIndicatorSize.tab] the tab's bounds are as wide as the space + /// occupied by the tab in the tab bar. If [indicatorSize] is + /// [TabBarIndicatorSize.label], then the tab's bounds are only as wide as + /// the tab widget itself. + final Decoration indicator; + + /// Defines how the selected tab indicator's size is computed. + /// + /// The size of the selected tab indicator is defined relative to the + /// tab's overall bounds if [indicatorSize] is [TabBarIndicatorSize.tab] + /// (the default) or relative to the bounds of the tab's widget if + /// [indicatorSize] is [TabBarIndicatorSize.label]. + /// + /// The selected tab's location appearance can be refined further with + /// the [indicatorColor], [indicatorWeight], [indicatorPadding], and + /// [indicator] properties. + final TabBarIndicatorSize indicatorSize; + + /// The color of selected tab labels. + /// + /// Unselected tab labels are rendered with the same color rendered at 70% + /// opacity unless [unselectedLabelColor] is non-null. + /// + /// If this parameter is null, then the color of the [ThemeData.primaryTextTheme]'s + /// body2 text color is used. + final Color labelColor; + + /// The color of unselected tab labels. + /// + /// If this property is null, unselected tab labels are rendered with the + /// [labelColor] with 70% opacity. + final Color unselectedLabelColor; + + /// The text style of the selected tab labels. + /// + /// If [unselectedLabelStyle] is null, then this text style will be used for + /// both selected and unselected label styles. + /// + /// If this property is null, then the text style of the + /// [ThemeData.primaryTextTheme]'s body2 definition is used. + final TextStyle labelStyle; + + /// The padding added to each of the tab labels. + /// + /// If this property is null, then kTabLabelPadding is used. + final EdgeInsetsGeometry labelPadding; + + /// The text style of the unselected tab labels + /// + /// If this property is null, then the [labelStyle] value is used. If [labelStyle] + /// is null, then the text style of the [ThemeData.primaryTextTheme]'s + /// body2 definition is used. + final TextStyle unselectedLabelStyle; + + /// One widget per tab. + /// Its length must match the length of the [GFTabs.tabs] + /// list, as well as the [controller]'s [GFTabs.length]. + final TabBarView tabBarView; + + /// Typically a list of two or more [Tab] widgets. + /// + /// The length of this list must match the [controller]'s [TabController.length] + /// and the length of the [TabBarView.children] list. + final List tabs; + + + @override + _GFTabsState createState() => _GFTabsState(); +} + +class _GFTabsState extends State { + @override + Widget build(BuildContext context) { + return Container( + child: DefaultTabController( + initialIndex: widget.initialIndex, + length: widget.length, + child: Container( + height: widget.height == null ? MediaQuery.of(context).size.height * 0.5 : widget.height, + child: Column( + children: [ + Material( + type: MaterialType.button, + color: widget.tabBarColor ?? Theme.of(context).primaryColor, + child: TabBar( + labelColor: widget.labelColor, + unselectedLabelColor: widget.unselectedLabelColor, + labelStyle: widget.labelStyle, + unselectedLabelStyle: widget.unselectedLabelStyle, + indicatorColor: widget.indicatorColor, + indicatorSize: widget.indicatorSize, + indicator: widget.indicator, + indicatorPadding: widget.indicatorPadding, + indicatorWeight: widget.indicatorWeight, + tabs: widget.tabs, + ), + ), + Expanded( + child: widget.tabBarView + ), + ], + ), + ), + ), + ); + } +} + + + + + + + + + + + + + + + + +