Digia Academy
Digia StudioDiscordLinkedIn
  • Introduction
    • FAQs
  • What's New
    • 2024
      • March
  • DIGIA STUDIO INTRODUCTION
    • Dashboard
    • Builder Tool
      • Navigation Menu
      • Tool Bar
      • Pages and Widgets Panel
      • Canvas Area
      • Properties Panel
    • Creating a New Project
    • Creating new Pages
    • Working with Widget Tree
    • Build Your First App
      • Hello World
      • Bytes App
        • Onboarding
        • Defining API Calls
        • Courses
        • Articles
        • Viewing your App
    • SDK Integration
      • Insert Single Pages from Digia Studio
  • Actions
    • Call API Rest Action
    • Call Rest API
    • Pop Current
    • Pop to Route
    • openUrl
    • Go To Page
    • Post Message
    • Set Page State
    • Wait (delay)
    • Drawer
    • Toast
    • Open Dialog
    • Share
    • Copy to Clipboard
  • Operations
    • API Call
    • Operators
      • Json Operators
      • Logical Operators
      • Date Time Operators
      • Math Operators
      • String Operations
  • BUILDING UI
    • Widgets
      • Form Widgets
        • PinField
        • Calendar
        • Text Form Field
      • Base Widgets
        • Animated Button
        • Check Box
        • Video Player
        • Spacer
        • Stack
        • Wrap
        • Text
        • Avatar
        • Rich Text
        • Image
        • Button
        • Icon
        • Switch
        • Sized Box
        • HtmlView
        • Lottie Animation
        • Linear Progress Bar
        • YouTube Player
        • Circular Progress Bar
      • Layout Widgets
        • ListView
        • Web View
        • Future Builder
        • Conditional Builder
        • Stream Builder
        • GridView
        • Column
        • Row
        • Container
        • Expandable
        • Divider (Horizontal)
        • Divider (Vertical)
        • Carousel
      • Persistent Footers Widgets
        • NavigationBar Widget
      • Page Widgets
        • Stepper Widget
        • Scaffold Widget
        • Paginated Listview Widget
        • TabView
        • AppBar
      • Widget Commonalities
    • Event Handlers
  • Theme
    • Colors
    • Typography
  • DATA AND BACKEND
    • API Calls
      • Setting up API Calls
      • Create API Calls
      • Import API From Curl
  • DEPLOYING YOUR APP
    • Deployment
    • Release History
  • Settings
    • App Settings
    • App Assets
    • Media Assets
  • JARGON
    • Data integration
Powered by GitBook
On this page
  1. BUILDING UI
  2. Widgets
  3. Page Widgets

TabView

PreviousPaginated Listview WidgetNextAppBar

Last updated 1 month ago

The TabView widget is a powerful widget for creating a tabbed interface in your application. It allows users to navigate between different views by tapping on tabs, each representing a different section of the app.

The TabView widget consists of Four sections, Position, Selected label Style and Colors, Unselected label Style and Color and Divider Height.

  • The Position, it aligns you tabBar at your desired Position (whether Top or Bottom).

  • The Selected label Style and Color section responsible for the Font Styling and Color of the title, When got Selected.

  • The Unselected label Style and Color section responsible for the Font Styling and Color of the title, When tab got Unselected.

  • The Divider Height is provide required height according to users need to the divided, which is located below the tabBar. If user do not want to use divider in their application bar, set divider height Zero.

TabViewitem

Each tab's content is encapsulated in separate widgets (HomeTab, profileTab )Inside each TabViewitem widget, a single child widget is used (a Column in this example), which can contain multiple children like icons and text. It is used as subwidget inside TabView to defining TabView's properties (in general).

The TabView widget consists of Two sections, Title and Icon.

The Title section usually includes the title of the TabBar.

The Icon contains various icons for the title including Material Icons, Cupertino Icons, FontAwesome Icons and LineIcons. Icon can be customized futher like the height and color.