animated_appbar 1.0.2 copy "animated_appbar: ^1.0.2" to clipboard
animated_appbar: ^1.0.2 copied to clipboard

AppBar which can dynamically change height with page navigation.

animated_appbar #

pub package License: MIT

AppBar which can dynamically change height with page navigation. preview

Usage #

This package is expected to be used with BaseLayout and AnimatedAppbar

    void main() {
        runApp(MyApp());
    }

    class MyApp extends StatefulWidget {
        @override
            _MyAppState createState() => _MyAppState();
        }

        class _MyAppState extends State<MyApp> with TickerProviderStateMixin{
        
            
            TappedNotifier tappedNotifier = TappedNotifier();
            PageNotifier pageNotifier = PageNotifier();

        void voidCallback(){
            // If you wanna use setState function,
            // You must use instance value, not primitive value.
            // Because this function run in another area(function),
            // primitive valus are call-by-value,
            // instance values are call-by-reference
            setState(() => tappedNotifier.setSwitch());
        }
        
        @override
        Widget build(BuildContext context) {
            return MaterialApp(
            debugShowCheckedModeBanner: false,
            home: BaseLayout(
                appbar: AnimatedAppbar(
                tappedNotifier: tappedNotifier,
                initHeight: 135.0,
                backgroundColor: Colors.pink,
                pageTransitionCallback: () { 
                    setState(() => pageNotifier.setSwitch());
                },
                child: Center(
                    child: Column(
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: [
                        Text("App bar"),
                        Text("you can customize here!"),
                    ],
                    ),
                ),
                ),
                scaffold: pageNotifier.changed? Page2(callback: voidCallback):Page1(callback: voidCallback),
            ),
            );
        }
    }

    class PageNotifier{
        bool _changed = false;
        bool get changed => _changed;
        set changed(bool changed) => _changed=changed;
        void setSwitch(){
            _changed = !_changed;
        }
    }

    typedef VoidCallback = void Function();

    class Page1 extends StatelessWidget {

        final VoidCallback callback;
        
        const Page1({ Key? key,required this.callback }) : super(key: key);

        @override
        Widget build(BuildContext context) {
            return Scaffold(
                    body: Center(
                    child:Container(
                        color: Colors.tealAccent,
                        child: TextButton(onPressed: callback, child: Text("page 1 Click here!",style: TextStyle(fontSize: 20,color: Colors.black)))),
                ),
            );
        }
    }
    class Page2 extends StatelessWidget {

        final VoidCallback callback;
        
        const Page2({ Key? key,required this.callback }) : super(key: key);

        @override
        Widget build(BuildContext context) {
            return Scaffold(
                body: Center(
                    child:Container(
                        color: Colors.pinkAccent,
                        child: TextButton(onPressed: callback, child: Text("page 2 Click here!",style: TextStyle(fontSize: 20,color: Colors.black)))),
                ),
            );
        }
    }

If you have any requests / contributes or questions, please feel free to visit github.

28
likes
140
points
48
downloads

Publisher

unverified uploader

Weekly Downloads

AppBar which can dynamically change height with page navigation.

Homepage

Documentation

API reference

License

MIT (license)

Dependencies

flutter, flutter_web_plugins

More

Packages that depend on animated_appbar