您好，我尝试在 flutter 中使用 slider 实现耀斑动画。我创建了五个键(1、2、3、4、5)，它们调用特定的耀斑动画，它们在耀斑编辑器上工作得很好，但是当我启动应用程序时，我遇到了添加偏移或消失或出现的某些动画项目的问题, 是随机的...
我用不同的形状创建了一个简单的测试，这些形状是用不同的工具创建的，包括光晕编辑器圆圈、六边形、钢笔，我目前在使用钢笔工具创建形状时遇到了问题，这些形状会消失或随机出现。
耀斑版本:flare_flutter: ^1.5.2
chronology of the gif
value=0.0 black shape is showed // all is good
value=25.0 black shape is showed // all is good
value=0.0 black shape disepear // not good
value=25.0 black shape disepear // not good
value=0.0 black shape disepear // not good
value=25.0 black shape disepear // not good
reload app
value=0.0 black shape is showed // all is good
value=25.0 black shape is showed // all is good
这是例子
class MyHomePage extends StatefulWidget {
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
final FlareControls controls = FlareControls();
double slidervalue;
@override
void initState() {
slidervalue=0.0;
controls.play("1");
super.initState();
}
@override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
new Container (
width:150,
height: 150,
child :new FlareActor("assets/flare_test.flr", alignment:Alignment.center, fit:BoxFit.contain, animation:"idle" , controller:controls,
)
),
Slider(
value: slidervalue,
min: 0,
max: 100,
divisions: 4,
label: "$slidervalue",
onChanged: (value) {
setState(() {
slidervalue = value;
if(slidervalue==0.0){
controls.play("1");
}
if(slidervalue==25){
controls.play("2");
}
if(slidervalue==50){
controls.play("3");
}
if(slidervalue==75){
controls.play("4");
}
if (slidervalue==100){
controls.play("5");
}
});
},
),
],
),
)
);
}
}
如果我用改变状态中断动画，这里是另一个修改初始原点的观察结果。我在引用最后一个位置动画时观察到初始原点的偏移量。而不是重新启动初始原点
在这个例子中，我不知道为什么翻译使用最后一个旋转原点，而旋转在按下时保持初始原点。
在最后一个例子中，为什么我第一次按下按钮时一切正常，而第二次我松开平移轴？
我在 flare 中发布了这个问题，但可能我做错了
最佳答案
我丑陋的解决方案。我为 flareactor 的每个键使用一个堆栈，当 slider 改变值时，键改变并且我使可见或不可见，flareactor 取决于所选键。工作，但它并不漂亮...
final FlareControls _controls = FlareControls();
final FlareControls _controls2 = FlareControls();
final FlareControls _controls3 = FlareControls();
final FlareControls _controls4 = FlareControls();
final FlareControls _controls5 = FlareControls();
bool visibilitanim1;
bool visibilitanim2;
bool visibilitanim3;
bool visibilitanim4;
bool visibilitanim5;
double slidervalue;
@override
void initState() {
slidervalue=0;
visibilitanim1=true;
visibilitanim2=false;
visibilitanim3=false;
visibilitanim4=false;
visibilitanim5=false;
super.initState();
}
void _changed(bool visibility, String field) {
setState(() {
if (field == "anim1"){
visibilitanim1 = visibility;
}
if (field == "anim2"){
visibilitanim2 = visibility;
}
if (field == "anim3"){
visibilitanim3 = visibility;
}
if (field == "anim4"){
visibilitanim4 = visibility;
}
if (field == "anim5"){
visibilitanim5 = visibility;
}
});
} //modifi
@override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
new Stack (
children: <Widget>[
visibilitanim1 ? new Container (
width:150,
height: 150,
child :new FlareActor("assets/flare_test.flr", alignment:Alignment.center, fit:BoxFit.contain, animation:"1" , controller:_controls,
)
) : Container(),
visibilitanim2 ? new Container (
width:150,
height: 150,
child :new FlareActor("assets/flare_test.flr", alignment:Alignment.center, fit:BoxFit.contain, animation:"2" , controller:_controls2,
)
): Container(),
visibilitanim3 ? new Container (
width:150,
height: 150,
child :new FlareActor("assets/flare_test.flr", alignment:Alignment.center, fit:BoxFit.contain, animation:"3" , controller:_controls3,
)
): Container(),
visibilitanim4 ? new Container (
width:150,
height: 150,
child :new FlareActor("assets/flare_test.flr", alignment:Alignment.center, fit:BoxFit.contain, animation:"4" , controller:_controls4,
)
): Container(),
visibilitanim5 ? new Container (
width:150,
height: 150,
child :new FlareActor("assets/flare_test.flr", alignment:Alignment.center, fit:BoxFit.contain, animation:"5" , controller:_controls5,
)
): Container(),
],
),
Slider(
value: slidervalue,
min: 0,
max: 100,
divisions: 4,
label: "$slidervalue",
onChanged: (value) {
setState(() {
slidervalue = value;
if(slidervalue==0.0){
_changed(true, "anim1");
_controls.play("1");
_changed(false, "anim2");
_changed(false, "anim3");
_changed(false, "anim4");
_changed(false, "anim5");
}
if(slidervalue==25){
_changed(true, "anim2");
_controls2.play("2");
_changed(false, "anim1");
_changed(false, "anim3");
_changed(false, "anim4");
_changed(false, "anim5");
}
if(slidervalue==50){
_changed(true, "anim3");
_controls3.play("3");
_changed(false, "anim1");
_changed(false, "anim2");
_changed(false, "anim4");
_changed(false, "anim5");
}
if(slidervalue==75){
_changed(true, "anim4");
_controls4.play("4");
_changed(false, "anim1");
_changed(false, "anim2");
_changed(false, "anim3");
_changed(false, "anim5");
}
if (slidervalue==100){
_changed(true, "anim5");
_controls5.play("5");
_changed(false, "anim1");
_changed(false, "anim2");
_changed(false, "anim3");
_changed(false, "anim4");
}
});
},
),
关于flutter - 耀斑和 flutter 问题，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/56902274/