Можно ли сделать анимацию героя, используя BottomSheet - PullRequest
Новая
       4

Можно ли сделать анимацию героя, используя BottomSheet

0 голосов
/ 15 января 2020

Я пытался анимировать образ героя при запуске BottomSheet. Возможно ли это сделать или вам нужно написать собственную анимацию, поскольку вы не используете Навигатор?

Мне просто было интересно, было ли быстрое исправление перед исследованием пользовательских анимаций или созданием собственного виджета для BottomSheet.

Вот код, который я использую для проверки: 

import 'package:flutter/material.dart';

void main() => runApp(
    MyApp()
);


class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'Test Hero'),
    );
  }
}

class MyHomePage extends StatelessWidget {
  MyHomePage({this.title});
  final String title;
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(title),
      ),
      body: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        crossAxisAlignment: CrossAxisAlignment.stretch,
        children: <Widget>[
          Hero(
            tag: 'logo',
            child: FlutterLogo(size: 300,),
          ),
          GestureDetector(
            onTap: (){
              Navigator.push(
                context,
                MaterialPageRoute(builder: (context) => Screen2()),
              );
            },
            child: Container(
              height: 50,
              width: 150,
              color: Colors.grey,
              child: Center(child: Text('Go to Screen 2')),
            ),
          )
        ],
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: (){
          showModalBottomSheet(context: context, builder: (context){
            return GestureDetector(
              onTap: (){
                Navigator.pop(context);
              },
              child: Column(
                mainAxisAlignment: MainAxisAlignment.center,
                children: <Widget>[
                  Container(
                    color: Colors.white,
                    child: Center(
                      child: Hero(
                        tag:'logo',
                        child: FlutterLogo(
                          size: 50,
                        ),
                      ),
                    ),
                  ),
                  Text('Click me to go back',style: TextStyle(color: Colors.black),)
                ],
              ),
            );
          },
          );
        },
        tooltip: '',
        child: Text('Bottom Sheet',style: TextStyle(fontSize: 10),),
      ), 
    );
  }
}

class Screen2 extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Padding(
        padding: const EdgeInsets.all(50.0),
        child: Column(
          children: <Widget>[
            Container(
              height: 50,
              width: 50,
              child: Hero(
                tag:'logo',
                child: GestureDetector(
                  onTap:(){
                    Navigator.pop(context);
                  },
                  child: FlutterLogo(),
                ),
              ),
            ),
            Text('Click me to go back',style: TextStyle(color: Colors.black),)
          ],
        ),
      ),
    );
  }
}
...