This website or its third-party tools use cookies which are necessary to its functioning and required to improve your experience. By clicking the consent button, you agree to allow the site to use, collect and/or store cookies.
Please click the consent button to view this website.
I accept
Deny cookies Go Back

Mobile app tutorials

  • Home
  • About
  • Contact
  • Login
You are here: Home / flutter images / Flutter TabBar

December 13, 2017 by nigel

Flutter TabBar




The Flutter TabBar flutter development tutorial describes how to switch between flutter images widgets using the TabBar.

Flutter TabBar

This flutter development tutorial follows on from the BottomNavigationBar flutter tutorial.

Pre-requisites

Knowledge of the dart programming language is not required, but the experience of an object orientated programming language is recommended. Such as Java, C++, Kotlin, Swift to name a few.

Introduction

In this flutter development tutorial we will cover:

  • Creating a TabController
  • Adding TabBar to Scaffold widget
  • Replacing Scaffold body with TabBarView
  • Updating TabBar from drawer and popup menu
  • Updating BottomNavigationBar from TabController listener

Episodes

  1. Image Download
  2. Popup Menu
  3. Drawer
  4. BottomNavigationBar
  5. TabBar

To get access to the source code and code descriptions please fill out the form below to complete your free membership:
An account with your username and/or email address has been created. Log in here to access your products or complete a purchase. [Note: an account will be created even if your initial transaction failed at checkout. If this happened to you, simply log in and attempt your transaction again.]






Conclusion

This flutter development tutorial described how to add a TabBar to a flutter application.

To synchronize changes between the TabBar and TabBarView a TabController instance must be created.

Conveniently the Scaffold provides a bottom property which can be used for the TabBar. The Scaffold body will be replaced with the TabBarView.

To support selections from the drawer and popup menu, the TabController index can be modified.

To update the BottomNavigationBar tabs with TabBar changes, the TabController listener is used to modify the BottomNavigationBar’s index.

Print Friendly

Filed Under: flutter images Tagged With: Dart, Dart Programming, Flutter, Widget

  • Facebook
  • Google+
  • Twitter
  • YouTube




Recent Forum Topics

  • Kotlin Fragments
  • Kotlin Camera2 API
  • HTTP Image Libraries

Recent Posts

  • Installing and running flutter
  • Kotlin Camera2 API MediaRecorder
  • Flutter IntelliJ Tips for Beginners
  • Migrating Fragments to Jetpack Navigation
  • Flutter TabBar

Recent Posts

  • Installing and running flutter
  • Kotlin Camera2 API MediaRecorder
  • Flutter IntelliJ Tips for Beginners
  • Migrating Fragments to Jetpack Navigation
  • Flutter TabBar

Search Form

  • Facebook
  • GitHub
  • Google+
  • Twitter
  • YouTube

© 2021 - WWW.MOBAPPTUTS.COM