1st | Home Screen | Navigation Bar

[haythamhamed]

• Screen: Home Screen

• User Flow: Enrol in a course

• Description: Upper navigation bar with the essential app tabs

• Goal: Navigate the most essential screens of the app

• Reference: Facebook Mobile App Tabs

[khlebobul]

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home : DefaultTabController(
        length : 4,
        child : Scaffold(
          appBar : AppBar(title : Text("Home Screen | Navigation Bar #5"),
            bottom : TabBar(
              tabs : [
                Tab(child : Text("Home")),
                Tab(child : Text("My courses")),
                Tab(child : Text("Search")),
                Tab(child : Text("Notification"))
] )
          ),
          body : TabBarView(
            children : [
              Center(child : Text("Home")),
              Center(child : Text("My courses")),
              Center(child : Text("Search")),
              Center(child : Text("Notification"))
] )
)
        ) );
} }

[khlebobul]

https://user-images.githubusercontent.com/77191581/203407361-6edfb851-cf6f-43c2-ac13-6411b829ae1d.mov