Responsive layouts in Flutter: Split View and Drawer Navigation
17 min read
How to implement a responsive layout in Flutter by using a split view on large screens and drawer navigation on mobile.
How to implement a responsive layout in Flutter by using a split view on large screens and drawer navigation on mobile.
GridView is only suitable for items with a fixed aspect ratio. Here's how to use the flutter_layout_grid package to render responsive layouts with variable item sizes.
A simple and elegant approach to build a Chat Messaging UI with DecoratedBox, Align, and Padding widgets in Flutter.
How to make your ListViews feel native on iOS by adding top and bottom separators.
In-depth overview of Slivers and how to use them (part 2). Includes a demo app showing how to use SliverList, SliverGrid, SliverToBoxAdapter, SliverFillRemaining.
In-depth overview of Slivers and how to use them (part 1). Includes a demo app showing how to use SliverAppBar and SliverPersistentHeader.
Let's learn about color gradients, composition, writing reusable UI code, and CupertinoSegmentedControl.
Let's see how to use some custom code to add animated overlays and reveal action options from a FAB.
How to dock a floating action button in the middle of a BottomAppBar.
How to build layouts with scrollable pages, lists, grids, and other convenience widgets. Includes slivers and their usage to create a hero image effect.
How to build basic layouts in Flutter. Also included: MainAxisAlignment, MainAxisSize, CrossAxisAlignment, Baseline, AlignmentDirectional, LayoutBuilder, SizedBox.