2

您好，我尝试在颤动中使用滑块实现耀斑动画。我创建了五个键（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中发布了这个问题，但可能我做错了

4

1 回答 1

0

我丑陋的解决方案。我为flareactor的每个键使用一个堆栈，当滑块更改值时，键更改并且我是否可见，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");
              }

            });
          },
        ),
于 2019-07-06T12:50:12.800 回答