Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Not working on Overlay #5

Closed
pishguy opened this issue Oct 14, 2020 · 3 comments
Closed

Not working on Overlay #5

pishguy opened this issue Oct 14, 2020 · 3 comments

Comments

@pishguy
Copy link

pishguy commented Oct 14, 2020

import 'package:circular_reveal_animation/circular_reveal_animation.dart';
import 'package:flutter/material.dart';

class HiveTubeSliverAppBar extends StatefulWidget {
  final Function _onTap;

  const HiveTubeSliverAppBar({@required Function onTap}) : _onTap = onTap;

  @override
  _HiveTubeSliverAppBarState createState() => _HiveTubeSliverAppBarState();
}

class _HiveTubeSliverAppBarState extends State<HiveTubeSliverAppBar> with TickerProviderStateMixin {
  AnimationController _animationController;
  Animation<double> _animation;

  AnimationController _circularAnimationController;
  Animation<double> _circularAnimation;

  @override
  void initState() {
    super.initState();

    _animationController = AnimationController(vsync: this, duration: const Duration(milliseconds: 250));
    _animation = Tween<double>(begin: 0.0, end: 1.0).animate(_animationController);

    _circularAnimationController = AnimationController(
      vsync: this,
      duration: const Duration(milliseconds: 1000),
    );
    _circularAnimation = CurvedAnimation(
      parent: _circularAnimationController,
      curve: Curves.easeIn,
    );
  }

  @override
  Widget build(BuildContext context) {
    return SliverPersistentHeader(
      pinned: false,
      floating: true,
      delegate: CustomAutoHideAppBarDelegate(
        child: Padding(
          padding: const EdgeInsets.symmetric(horizontal: 12.0),
          child: Row(
            children: <Widget>[

              IconButton(icon: const Icon(Icons.more_vert_rounded), onPressed: () => _showOverlayHomeMenu(context, _animationController,_circularAnimation))

            ],
          ),
        ),
      ),
    );
  }

  Future<void> _showOverlayHomeMenu(BuildContext context, AnimationController animationController, Animation<double> circularAnimation) async {
    final OverlayState _overlayState = Overlay.of(context);
    final OverlayEntry _overlayEntry = OverlayEntry(builder: (context) {
      return CircularRevealAnimation(
        animation: circularAnimation,
        centerOffset: const Offset(10, 10),
        child: Positioned(
          top: kToolbarHeight - 20,
          right: 20.0,
          child: Opacity(
              opacity: _animationController.value,
              child: Card(
                elevation: 8.0,
                shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(8.0)),
                color: const Color(0xFF32313C),
                child: Container(
                  width: 200.0,
                  height: 250.0,
                  child: const ListTile(
                    title: Text(
                      'aaaaaaa',
                      style: TextStyle(color: Colors.white),
                    ),
                    leading: Icon(
                      Icons.assessment,
                      color: Colors.white,
                    ),
                  ),
                ),
              ),
            ),
        ),
      );
    });

    _animationController.addListener(() {
      _overlayState.setState(() {});
    });

    _overlayState.insert(_overlayEntry);
    _animationController.forward();
    await Future.delayed(const Duration(milliseconds: 3500));
    _animationController.reverse();

    _overlayEntry.remove();
  }
}
@qwert2603
Copy link
Owner

Hello! Any description and expected/actual behavior would be useful.

@pishguy
Copy link
Author

pishguy commented Oct 15, 2020

@qwert2603 simply when i try to use then library Animation, Overlay doesn't work

@qwert2603
Copy link
Owner

@MahdiPishguy sorry for late response. I looked throug your code and found some subtle bug in circularAnimation usage.

circularAnimation is backed by _circularAnimationController, but in method _showOverlayHomeMenu another controller (_animationController) is used.

It will work fine, if _circularAnimationController.forward() will be called together with _animationController.forward();.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants