Skip to main content
HashnodeCode Rinse

Command Palette

Search for a command to run...

Flutter Widgets: A Definitive Guide.

Published
•5 min read
R
Rahul Kumar

I am professional app developer with 7+ years of experience in developing apps used by millions of users everyday.

There are 410 widget subclasses in flutter framework. We will go through them one after another in this series.

Basic Widgets

  1. Text
  2. Image
  3. Icon
  4. ElevatedButton
  5. Row
  6. Column
  7. Wrap
  8. Container
  9. Scaffold
  10. AppBar
  11. Placeholder
  12. Card
  13. Checkbox
  14. Radio
  15. FloatingActionButton
  16. Switch
  17. SafeArea
  18. WillPopScope

Text Widgets

  1. Text
  2. RichText
  3. DefaultTextStyle
  4. SelectableText
  5. TextField
  6. EditableText

Image Widgets

  1. Image
  2. CircleAvatar
  3. RawImage
  4. FadeInImage
  5. ImageIcon

Layout Widgets

  1. Card
  2. ExpansionPanelRadio
  3. ExpansionPanelList
  4. ReorderableListView
  5. AnimatedList
  6. ListBody
  7. Stack
  8. IndexedStack
  9. Flex
  10. Row
  11. Column
  12. Flexible
  13. Expanded
  14. Wrap
  15. Flow
  16. LayoutBuilder
  17. Container
  18. DecoratedBox
  19. GridPaper
  20. ViewPort
  21. ShrinkWrappingViewport
  22. NestedScrollViewViewport
  23. PageView
  24. ReorderableList
  25. AnimatedBuilder

Icon Widgets

  1. Icon
  2. AnimatedIcon
  3. BackButtonIcon
  4. ExpandIcon
  5. ImageIcon

Buttons

  1. BackButtonIcon
  2. BackButton
  3. CloseButton
  4. ButtonBar
  5. TextButton
  6. ElevatedButton
  7. OutlinedButton
  8. RawMaterialButton
  9. DropdownButton
  10. FloatingActionButton
  11. IconButton
  12. ToggleButtons

Async

  1. StreamBuilder
  2. FutureBuilder

Sliders

  1. RangeSlider
  2. Slider

Animations

  1. Hero
  2. SliverAnimatedList
  3. AnimatedIcon
  4. AnimatedCrossFade
  5. AnimatedList
  6. AnimatedSize
  7. AnimatedSwitcher
  8. AnimatedContainer
  9. AnimatedPadding
  10. AnimatedAlign
  11. AnimatedPositioned
  12. AnimatedPositionedDirectional
  13. AnimatedOpacity
  14. SliverAnimatedOpacity
  15. AnimatedDefaultTextStyle
  16. AnimatedPhysicalModel
  17. AnimatedModalBarrier
  18. AnimatedBuilder
  19. TweenAnimationBuilder

Transition

  1. SlideTransition
  2. ScaleTransition
  3. RotationTransition
  4. SizeTransition
  5. FadeTransition
  6. SliverFadeTransition
  7. PositionedTransition
  8. RelativePositinedTransition
  9. DecoratedBoxTransition
  10. AlignTransition
  11. DefaultTextStyleTransition

About Widgets

  1. AboutListTile
  2. AboutDialog
  3. LicensePage

Dialogs

  1. AboutDialog
  2. BottomSheet
  3. CalendarDatePicker
  4. YearPicker
  5. DatePickerDialog
  6. DateRangePickerDialog
  7. Dialog
  8. AlertDialog
  9. SimpleDialogOption
  10. SimpleDialog
  11. DropdownButton

Form Widgets

  1. Form
  2. FormField
  3. Autocomplete
  4. RawAutocomplete
  5. DropdownButtonFormField
  6. InputDatePickerFormField
  7. TextFormField
  8. AutofillGroup

Scroll

  1. Scrollbar
  2. RawScrollbar
  3. CupertinoScrollbar
  4. ListWheelScrollView
  5. NestedScrollView
  6. CustomScrollView
  7. ListView
  8. GridView
  9. ScrollView
  10. BoxScrollView
  11. Scrollable
  12. SingleChildScrollView

Sliver Widgets

  1. SliverAppBar
  2. SliverAnimatedList
  3. SliverToBoxAdapter
  4. SliverPadding
  5. SliverOverlapAbsorber
  6. SliverOverlapInjector
  7. SliverReorderableList
  8. SliverSafeArea
  9. SliverFillViewport
  10. SliverFillRemaining
  11. SliverLayoutBuilder
  12. SliverPersistentHeader
  13. SliverPrototypeExtentList
  14. SliverWithKeepAliveWidget
  15. SliverMultiBoxAdaptorWidget
  16. SliverList
  17. SliverFixedExtentList
  18. SliverGrid
  19. SliverOpacity
  20. SliverIgnorePointer
  21. SliverOffstage
  22. SliverVisibility

AppBar Widgets

  1. AppBar
  2. SliverAppBar
  3. BottomAppBar
  4. PreferredSize

Table Widgets

  1. DataTable
  2. TableRowInkWell
  3. PaginatedDataTable
  4. Table
  5. TableCell

List Item Widgets

  1. CheckboxListTile
  2. DropdownMenuItem
  3. ExpansionTile
  4. GridTile
  5. GridTitleBar
  6. ListTile
  7. RadioListTile
  8. SwitchListTile

Chip Widgets

  1. Chip
  2. InputChip
  3. ChoiceChip
  4. FilterChip
  5. ActionChip
  6. RawChip
  1. BottomNavigationBar
  2. CupertinoNavigationBar
  3. CupertinoSliverNavigationBar
  4. NavigationRail
  5. NavigationToolbar

Drawer

  1. DrawerHeader
  2. Drawer
  3. DrawerController
  1. PopupMenuDivider
  2. PopupMenuItem
  3. CheckedPopupMenuItem
  4. PopupMenuButton

Progress Indicators

  1. LinearProgressIndicator
  2. CircularProgressIndicator
  3. RefreshProgressIndicator

Tab

  1. DefaultTabController
  2. Tab
  3. TabBar
  4. TabBarView
  5. TabPageSelectorIndicator
  6. TabPageSelector

Material Widgets

  1. AppBar
  2. SliverAppBar
  3. MaterialApp
  4. MaterialBannerTheme
  5. MaterialBanner
  6. BottomAppBar
  7. BottomNavigationBarTheme
  8. BottomNavigationBar
  9. FlexibleSpaceBar
  10. FlexibleSpaceBarSettings
  11. Ink
  12. InkResponse
  13. InkWell
  14. Material
  15. MergeableMaterial
  16. ScaffoldMessenger
  17. Scaffold
  18. SnackBarAction
  19. SnackBar
  20. Stepper
  21. UserAccountsDrawerHeader

Cupertino Widgets

  1. CupertinoActionSheet
  2. CupertinoActionSheetAction
  3. CupertinoActivityIndicator
  4. CupertinoApp
  5. CupertinoTabBar
  6. CupertinoButton
  7. CupertinoContextMenuAction
  8. CupertinoContextMenu
  9. CupertinoDatePicker
  10. CupertinoTimerPicker
  11. CupertinoAlertDialog
  12. CupertinoPopupSurface
  13. CupertinoDialogAction
  14. CupertinoFormRow
  15. CupertinoFormSection
  16. CupertinoNavigationBar
  17. CupertinoSliverNavigationBar
  18. CupertinoNavigationBarBackButton
  19. CupertinoPageScaffold
  20. CupertinoPicker
  21. CupertinoPickerDefaultSelectionOverlay
  22. CupertinoSliverRefreshControl
  23. CupertinoPageTransition
  24. CupertinoFullscreenDialogTransition
  25. CupertinoSearchTextField
  26. CupertinoSegmentedControl
  27. CupertinoSlider
  28. CupertinoSlidingSegmentedControl
  29. CupertinoSwitch
  30. CupertinoTabScaffold
  31. CupertinoTabView
  32. CupertinoTextField
  33. CupertinoTextFormFieldRow
  34. CupertinoTextSelectionToolbarButton
  35. CupertinoTextSelectionToolbar
  36. CupertinoTextSelectionControls
  37. CupertinoTheme

Theme Widgets

  1. BottomNavigationBarTheme
  2. MaterialBannerTheme
  3. CupertinoTheme
  4. AnimatedTheme
  5. ButtonBarTheme
  6. TextButtonTheme
  7. ElevatedButtonTheme
  8. OutlinedButtonTheme
  9. CheckboxTheme
  10. ChipTheme
  11. DataTableTheme
  12. DividerTheme
  13. ListTileTheme
  14. NavigationRailTheme
  15. PopupMenuTheme
  16. RadioTheme
  17. ScrollbarTheme
  18. SliderTheme
  19. SwitchTheme
  20. TextSelectionTheme
  21. TimePickerTheme
  22. ToggleButtonsTheme
  23. TooltipTheme
  24. IconTheme
  25. DefaultTextHeightBehavior

Actions

  1. ActionListener
  2. Actions
  3. FocusableActionDetector

Assets

  1. DefaultAssetBundle

Basic

  1. Directionality
  2. Opacity
  3. ShaderMask
  4. BackdropFilter
  5. CustomPaint
  6. ClipRect
  7. ClipRRect
  8. ClipOval
  9. ClipPath
  10. PhysicalModel
  11. PhysicalShape
  12. Transform
  13. CompositedTransformTarget
  14. CompositedTransformFollower
  15. FittedBox
  16. FractionalTransition
  17. RotatedBox
  18. Padding
  19. Align
  20. Center
  21. CustomSingleChildLayout
  22. LayoutId
  23. CustomMultiChildLayout
  24. SizedBox
  25. ConstrainedBox
  26. ConstraintsTransformBox
  27. UnconstrainedBox
  28. FractionallySizedBox
  29. LimitedBox
  30. OverflowBox
  31. SizedOverflowBox
  32. Offstage
  33. AspectRatio
  34. IntrinsicWidth
  35. IntrinsicHeight
  36. Baseline
  37. Positioned
  38. PositionedDirectional
  39. WidgetToRenderBoxAdapter
  40. Listener
  41. MouseRegion
  42. RepaintBoundary
  43. IgnorePointer
  44. AbsorbPointer
  45. MetaData
  46. KeyedSubtree
  47. Builder
  48. StatefulBuilder
  49. ColoredBox
  50. ColorFiltered
  51. Dismissible
  52. Draggable
  53. LongPressDraggable
  54. DragTarget
  55. DraggableScrollableSheet
  56. DraggableScrollableActuator
  57. DualTransitionBuilder
  58. Focus
  59. FocusScope
  60. ExcludeFocus
  61. GestureDetector
  62. RawGestureDetector
  63. ImageFiltered
  64. InteractiveViewer
  65. Localizations
  66. MediaQuery
  67. ModalBarrier
  68. Navigator
  69. NotificationListener
  70. OrientationBuilder
  71. OverflowBar
  72. Overlay
  73. GlowingOverscrollIndicator
  74. Router
  75. KeepAlive
  76. Spacer
  77. TextSelectionGestureDetector
  78. Texture
  79. Title
  80. Visibility

Semantics

  1. Semantics
  2. MergeSemantics
  3. BlockSemantics
  4. ExcludeSemantics
  5. IndexedSemantics
  6. SemanticsDebugger

Native

  1. AndroidView
  2. UiKitView
  3. HtmlElementView
  4. PlatformViewLink
  5. PlatformViewSurface
  6. AndroidViewSurface

Miscellaneous Widgets

  1. Divider
  2. VerticalDivider
  3. DropdownButtonHideUnderline
  4. FlutterLogo
  5. RefreshIndicator
  6. TextSelectionToolbarTextButton
  7. TextSelectionToolbar
  8. Theme
  9. Tooltip
  10. AnnotatedRegion
  11. WidgetsApp
  12. AutomaticKeepAlive
  13. Banner
  14. CheckedModeBanner
  15. DefaultTextEditingShortcuts
  16. DesktopTextSelectionToolbarLayoutDelegate
  17. ErrorWidget
  18. RenderObjectToWidgetAdapter
  19. FocusTraversalOrder
  20. FocusTraversalGroup
  21. HeroMode
  22. HeroControllerScope
  23. PageStorage
  24. PerformanceOverlay
  25. PrimaryScrollController
  26. RawKeyboardListener
  27. ReorderableDragStartListener
  28. ReorderableDelayedDragStartListener
  29. RestorationScope
  30. UnmanagedRestorationScope
  31. RootRestorationScope
  32. BackButtonListener
  33. ScrollConfiguration
  34. Shortcuts
  35. SizeChangedLayoutNotifier
  36. TextSelectionToolbarLayoutDelegate
  37. TickerMode
  38. ValueListenableBuilder
  39. WidgetInspector

Abstract Widgets

  1. ProxyWidget
  2. StatelessWidget
  3. StatefulWidget
  4. ParentDataWidget
  5. InheritedWidget
  6. RenderObjectWidget
  7. LeafRenderObjectWidget
  8. SingleChildRenderObjectWidget
  9. MultiChildRenderObjectWidget
  10. ImplicitlyAnimatedWidget
  11. InheritedModel
  12. InheritedNotifier
  13. InheritedTheme
  14. ConstrainedLayoutBuilder
  15. StatusTransitionWidget
  16. AnimatedWidget
  17. UniqueWidget
#flutter-widgets#flutter

Comments

Join the discussion

No comments yet. Be the first to comment.

More from this blog

Code Rinse

4 posts