Skip to content

Instantly share code, notes, and snippets.

@austinevick
Created August 3, 2024 18:08
Show Gist options
  • Save austinevick/09c432dd5d507b7ffc21ed3a7e202321 to your computer and use it in GitHub Desktop.
Save austinevick/09c432dd5d507b7ffc21ed3a7e202321 to your computer and use it in GitHub Desktop.
Flutter Animated AppBar
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