Я пытаюсь создать игру колеса фортуны с флаттером. для этого я нашел this_tutorial и последовал за ним. и это именно то, что я хотел. но у меня есть условие, что анимация должна быть остановлена для определенного индекса (фиксированный индекс).
Я добавил условие, но анимация останавливается внезапно, очень быстро и не останавливается плавно.
Full_Code_here
код:
import 'dart:math';
import 'package:flutter/material.dart';
import 'board_view.dart';
import 'model.dart';
class HomePage extends StatefulWidget {
@override
State<StatefulWidget> createState() {
return _HomePageState();
}
}
class _HomePageState extends State<HomePage>
with SingleTickerProviderStateMixin {
double _angle = 0;
double _current = 0;
AnimationController _ctrl;
Animation _ani;
List<Luck> _items = [
Luck("apple", Colors.accents[0]),
Luck("raspberry", Colors.accents[2]),
Luck("grapes", Colors.accents[4]),
Luck("fruit", Colors.accents[6]),
Luck("milk", Colors.accents[8]),
Luck("salad", Colors.accents[10]),
Luck("cheese", Colors.accents[12]),
Luck("carrot", Colors.accents[14]),
];
@override
void initState() {
super.initState();
var _duration = Duration(milliseconds: 5000);
_ctrl = AnimationController(vsync: this, duration: _duration);
_ani = CurvedAnimation(parent: _ctrl, curve: Curves.fastLinearToSlowEaseIn);
}
@override
Widget build(BuildContext context) {
return Scaffold(
body: Container(
decoration: BoxDecoration(
gradient: LinearGradient(
begin: Alignment.topCenter,
end: Alignment.bottomCenter,
colors: [Colors.green, Colors.blue.withOpacity(0.2)])),
child: AnimatedBuilder(
animation: _ani,
builder: (context, child) {
final _value = _ani.value;
final _angle = _value * this._angle;
return Stack(
alignment: Alignment.center,
children: <Widget>[
BoardView(items: _items, current: _current, angle: _angle),
_buildGo(),
_buildResult(_value),
],
);
}),
),
);
}
_buildGo() {
return Material(
color: Colors.white,
shape: CircleBorder(),
child: InkWell(
customBorder: CircleBorder(),
child: Container(
alignment: Alignment.center,
height: 72,
width: 72,
child: Text(
"GO",
style: TextStyle(fontSize: 22.0, fontWeight: FontWeight.bold),
),
),
onTap: _animation,
),
);
}
_animation() {
if (!_ctrl.isAnimating) {
var _random = Random().nextDouble();
_angle = 20 + Random().nextInt(5) + _random;
_ctrl.forward(from: 0.0).then((_) {
_current = (_current + _random);
_current = _current - _current ~/ 1;
_ctrl.reset();
});
}
}
int _calIndex(value) {
var _base = (2 * pi / _items.length / 2) / (2 * pi);
return (((_base + value) % 1) * _items.length).floor();
}
_buildResult(_value) {
var _index = _calIndex(_value * _angle + _current);
String _asset = _items[_index].asset;
//here I tried to stop animation on fixed index.
if(_index == 7)
{
_ctrl.stop();
}
return Padding(
padding: EdgeInsets.symmetric(vertical: 16.0),
child: Align(
alignment: Alignment.bottomCenter,
child: Image.asset(_asset, height: 80, width: 80),
),
);
}
}