Created
August 3, 2024 18:08
-
-
Save austinevick/09c432dd5d507b7ffc21ed3a7e202321 to your computer and use it in GitHub Desktop.
Flutter Animated AppBar
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import 'package:flutter/material.dart'; | |
class AnimatedAppBar extends StatefulWidget { | |
final Widget? leading; | |
final String title; | |
final String bodyText; | |
final Widget body; | |
final Widget? floatingActionButton; | |
final RefreshCallback? onRefresh; | |
const AnimatedAppBar( | |
{super.key, | |
this.leading, | |
required this.title, | |
required this.body, | |
required this.bodyText, | |
this.onRefresh, | |
this.floatingActionButton}); | |
@override | |
State<AnimatedAppBar> createState() => _AnimatedAppBarState(); | |
} | |
class _AnimatedAppBarState extends State<AnimatedAppBar> { | |
final scrollController = ScrollController(); | |
double opacity = 0.0; | |
@override | |
Widget build(BuildContext context) { | |
return Scaffold( | |
floatingActionButton: widget.floatingActionButton, | |
appBar: AppBar( | |
leading: widget.leading, | |
title: AnimatedOpacity( | |
duration: const Duration(milliseconds: 1000), | |
opacity: opacity, | |
child: Text(widget.title)), | |
), | |
body: NotificationListener<ScrollNotification>( | |
onNotification: (notification) { | |
if (notification.metrics.pixels > 40.0) { | |
setState(() => opacity = 1.0); | |
} else { | |
setState(() => opacity = 0.0); | |
} | |
return true; | |
}, | |
child: RefreshIndicator.adaptive( // You can remove the refresh indicator it is optional | |
onRefresh: widget.onRefresh == null ? () async {} : widget.onRefresh!, | |
child: SingleChildScrollView( | |
child: Padding( | |
padding: const EdgeInsets.symmetric(horizontal: 16), | |
child: Column( | |
crossAxisAlignment: CrossAxisAlignment.start, | |
children: [ | |
Text( | |
widget.bodyText, | |
style:TextStyle(fontSize: 28, color: Colors.black, | |
fontWeight: FontWeight.bold)), | |
widget.body //This should be a list of widgets | |
], | |
), | |
), | |
), | |
), | |
), | |
); | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment