Hello Reader,
This is it. This post is the last one of the weekly Flutter\Dart tips series. By the end of this post, The number of tips I shared with you will be more than 100 tips. Thanks for following me to this point.
1- LongPressDraggable Widget is used to create a widget that can be dragged starting from LongPress.
... LongPressDraggable( feedback: FlutterLogo( textColor: Colors.orange, size: 100, style: FlutterLogoStyle.stacked, ), child: FlutterLogo( textColor: Colors.green, size: 100, style: FlutterLogoStyle.stacked, ), onDragEnd: (details) { setState(() { final adjustment = MediaQuery.of(context).size.height - constraints.maxHeight; _offset = Offset( details.offset.dx, details.offset.dy - adjustment); }); }, ), ... Try it on DartPad here
2- Baseline is a widget that positions its child according to the child's baseline.
... Center( child: Container( color: Colors.blue, height: 120.0, width: 120.0, child: Baseline( child: Container( color: Colors.red, height: 60.0, width: 60.0, ), baseline: 20.0, baselineType: TextBaseline.alphabetic, ), ), ) ... Try it on DartPad here
3- Banner widget displays a diagonal message above the corner of another widget.
... Center( child: Container( margin: const EdgeInsets.all(10.0), color: Colors.yellow, height: 100, child: ClipRect( child: Banner( message: "hello", location: BannerLocation.topEnd, color: Colors.red, child: Container( color: Colors.yellow, height: 100, child: Center( child: Text("Hello, banner!"), ), ), ), ), ), ) ... Try it on DartPad here
4- BottomNavigationBar is a widget that's displayed at the bottom of an app for selecting among a small number of views, typically between three and five.
... bottomNavigationBar: BottomNavigationBar( items: const <BottomNavigationBarItem>[ BottomNavigationBarItem( icon: Icon(Icons.home), label: 'Home', ), BottomNavigationBarItem( icon: Icon(Icons.business), label: 'Business', ), BottomNavigationBarItem( icon: Icon(Icons.school), label: 'School', ), ], currentIndex: _selectedIndex, selectedItemColor: Colors.amber[800], onTap: _onItemTapped, ), ... Try it on DartPad here
5- IntrinsicWidth is a widget that sizes its child to the child's maximum intrinsic width.
... IntrinsicWidth( child: Column( crossAxisAlignment: CrossAxisAlignment.stretch, children: [ Container( width: 200, height: 100, color: Colors.teal, ), Expanded( child: Container( width: 100, height: 100, color: Colors.red, ), ), ], ), ) ... Try it on DartPad here
6- IntrinsicHeight Widget is a widget that sizes its child to the child’s intrinsic height.
... IntrinsicHeight( child: Row( crossAxisAlignment: CrossAxisAlignment.stretch, children: [ Container( width: 150, height: 100, color: Colors.teal, ), Container( width: 150, height: 200, color: Colors.red, ) ], ), ) ... Try it on DartPad here
Thank you. 👋🏻
Follow me on Twitter for more tips about #coding, #learning, #technology...etc.
Check my Apps on Google Play & Apple Store
Cover image Ray Hennessy on Unsplash
Top comments (0)