Posts

Using TabBar,TabBarView with any Widget(Dialog with round corners) and blur the background - Flutter

Image
This is a different example of using TabBar with widgets as I have only seen blogs for it to be used in Scaffold Appbar and Body.Here we will use TabBar with Dialog Widget . TabBar and TabBarView widget examples where you don't use DefaultTabController() which    provide us with a listenable,   has to be explicitly provided with a tab controller. You can provide barrierDismissible argument to prevent dialog from closing on outside touch in showDialog() class CustomDialogTabBar extends StatelessWidget { @override Widget build (BuildContext context) { return Scaffold ( appBar: AppBar ( title: Text ( "AppBar" ) , ) , body: Center (child: Text ( "Abhina Kumar Sintoo Blogs - Flutter Expert" ) , ) , floatingActionButton: FloatingActionButton ( child: Icon (Icons. forward ) , onPressed: () => showDialog( context: context , builder: (context) => BackdropDialog2 ( height: MediaQ...

Implement Complex UI with Flutter

Image
People who are using Flutter, are not using it to its full potential.The Widgets that are used mostly are Container, Scaffold, BottomSheet, Alert Dialog, Row, Column, etc.I agree that these widgets are  important for a flutter developer in developing a good presentable UI.Using these basic widgets you get something like below -  But, What About Complex UI where you want your screen to look Awesome! Like Below -  You have come to the best place to know how to implement these complex UI using mainly 3 widgets only -  STACK TRANSFORM ANIMATION CONTROLLER Let's Start with introducing these widgets first: Stack : As the name suggests, Stack() widget is used to position widgets on top of each other.You have to specify a list of widgets as children. The first widget in the list of widgets, will be at bottom and the last will be at the top. Like below where I have stacked 3 container on top of each other...