Flutter : Collapsing Toolbar — Sliver App Bar

This Article is posted by assardeveloper7 at 9/25/2022 9:11:40 PM



@override
Widget build(BuildContext context) {
return Scaffold(
body: DefaultTabController(
length: 2,
child: NestedScrollView(
headerSliverBuilder: (BuildContext context, bool innerBoxIsScrolled) {
return < Widget >[
SliverAppBar(
expandedHeight: 200.0,
floating: false,
pinned: true,
flexibleSpace: FlexibleSpaceBar(
centerTitle: true,
title: Text("Collapsing Toolbar",
style: TextStyle(
color: Colors.white,
fontSize: 16.0,
)),
background: Image.network(
"https://images.pexels.com/photos/396547/pexels-photo-396547.jpeg?auto=compress&cs=tinysrgb&h=350",
fit: BoxFit.cover,
)),
bottom: TabBar(
labelColor: Colors.black87,
unselectedLabelColor: Colors.grey,
tabs: [
new Tab(icon: new Icon(Icons.info), text: "Tab 1"),
new Tab(
icon: new Icon(Icons.lightbulb_outline), text: "Tab 2"),
],
),
),
];
},
body: Center(
child: Text("Sample text"),
),
),
),
);

Tags: Flutter Silver app bar








0 Comments
Login to comment.
Recent Comments

Be the first to Comment. You can ask a Query or Share your toughts or Just say thanks.


© 2018 - Fluttercentral | Email to me - seven.srikanth@gmail.com