Yu Tant

Home
flutter

Flutter: Tabbar

Selayaknya aplikasi yang menggunakan tab bar ya seperti itulah..




Berikut hasil shot codenya :

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  List<Tab> myTab = [
    Tab(
      icon: Icon(Icons.work),
      text: "Koper",
    ),
    Tab(
      icon: Icon(Icons.local_post_office),
      text: "Surat",
    ),
    Tab(
      icon: Icon(Icons.settings),
      text: "Setting",
    )
  ];

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: DefaultTabController(
        length: myTab.length,
        child: Scaffold(
          appBar: AppBar(
            title: Text("yTn: Perkenalan App Bar"),
            bottom: TabBar(
              tabs: myTab,
              labelColor: Colors.black,
              unselectedLabelColor: Colors.white,
              indicator: BoxDecoration(
                color: Colors.amber[400],
                borderRadius: BorderRadius.circular(20),
              ),
            ),
          ),
          body: TabBarView(
            children: [
              Center(
                child: Container(
                  child: Text("Tab view Tabbar Koper"),
                ),
              ),
              Center(
                child: Text("Page Surat"),
              ),
              Center(
                child: Text("Page Setting"),
              )
            ],
          ),
        ),
      ),
    );
  }
}