rounded_floating_app_bar 0.1.0 rounded_floating_app_bar: ^0.1.0 copied to clipboard
A package provides an easy way to add rounded corner floating app bar in Flutter project.
import 'package:flutter/material.dart';
import 'package:rounded_floating_app_bar/rounded_floating_app_bar.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Example',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: MyHomePage(),
);
}
}
class MyHomePage extends StatefulWidget {
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
@override
Widget build(BuildContext context) {
return Scaffold(
body: NestedScrollView(
headerSliverBuilder: (context, isInnerBoxScroll) {
return [
RoundedFloatingAppBar(
actions: <Widget>[
IconButton(
icon: Icon(Icons.video_call),
onPressed: () {},
),
IconButton(
icon: Icon(Icons.search),
onPressed: () {},
),
IconButton(
icon: CircleAvatar(
child: FlutterLogo(
size: 18,
),
backgroundColor: Colors.red,
),
onPressed: () {},
),
],
iconTheme: IconThemeData(
color: Colors.black,
),
textTheme: TextTheme(
title: TextStyle(
color: Colors.black,
),
),
floating: true,
snap: true,
title: Row(
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
FlutterLogo(),
Padding(
padding: const EdgeInsets.symmetric(vertical: 16),
child: Text(
"Youtube",
style:
TextStyle(fontWeight: FontWeight.bold, fontSize: 18),
),
),
],
),
backgroundColor: Colors.white,
),
];
},
body: ListView.builder(
itemBuilder: (_, i) => ListTile(
title: Text("Title $i"),
),
),
),
);
}
}