[我正在尝试制作一个小型游戏,其中我必须旋转FittedBox
内部的Grid
(图像的父级,如下面的代码所示。
child: new AnimatedBuilder(
animation: animationController,
child: new InkWell(
onTap: () {
// setState(
// () {
widget._angleCode = getNextDegree(widget._angleCode);
animationController.forward();
//checkAnswer();
// },
// );
},
child: new FittedBox(
fit: BoxFit.fill,
child: new Image.asset(getImageByCode(widget._image),
fit: BoxFit.cover)),
),
builder: (BuildContext context, Widget _widget) {
animationController.value = getAngleByCode(widget._angleCode); //returns 0,.5,.75 consequtively
return new Transform.rotate(
angle: animationController.value * 2 * pi,
child: _widget,
);
},
),
尽管以上代码确实旋转了图像,但没有变换动画。我已经用SingleTickerProviderStateMixin
覆盖了我的课程,并实现了initState(),如下所示:
@override
void initState() {
super.initState();
animationController = new AnimationController(
vsync: this,
duration: new Duration(seconds: 2),
);
//animationController.forward();
}
请帮助。
请尝试这个
import 'package:flutter/material.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: MyHomePage(),
);
}
}
class MyHomePage extends StatefulWidget {
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
double angle = 0.0;
void _onPanUpdateHandler() {
setState(
() {
angle += 0.2;
},
);
}
@override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: GestureDetector(
onTap: _onPanUpdateHandler,
child: Transform.rotate(
angle: angle,
child: Container(
color: Colors.red,
child: SizedBox(
child: null,
height: 100,
width: 100,
),
),
),
)),
);
}
}