是否有任何解决方案可以使我的 Flare Button 正常工作？扑

Question

基本上，我有一个用 Flare 制作的按钮，它应该制作动画然后我点击它！它运行良好，但每次我点击我的应用程序中的任何地方时动画都会开始，而不仅仅是按钮。有什么方法可以让我只在点击按钮区域时制作动画？我正在使用 GestureDetector 来处理点击。

https://i.stack.imgur.com/ZBjmz.jpg

我的代码：

import 'package:flutter/material.dart';
import 'package:flare_flutter/flare_actor.dart';  
import 'package:vibrate/vibrate.dart';

void main() => runApp(MaterialApp(
  home: InvalidButton(),
));

class InvalidButton extends StatefulWidget {
  @override
  _InvalidButtonState createState() => _InvalidButtonState();
}

class _InvalidButtonState extends State<InvalidButton> {
  var _type = FeedbackType.heavy;
  final FlareControls controls = FlareControls();
  void _playAnimation(){
    controls.play('invalid');
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.pink[50],
      body: Container(
        child: GestureDetector(
        onTap: () {
          setState(() {
            _playAnimation();
            Vibrate.feedback(_type);
          });
        },
        child: FlareActor(
          'assets/invalid_button.flr',
          animation: 'invalid',
          alignment: Alignment.center,
          fit: BoxFit.contain,
          controller: controls,
          ),
      ),
      ),
    );
  }
}

我是新手，很乐意提供任何帮助！

Answer 1

Rive 编辑器中的按钮周围有 space 吗？如果是这样，请进入设计模式，单击画板，然后单击 "fit contents"。那应该删除额外的 space。然后，用 SizedBox 包裹 FlareActor 并设置其大小，如下所示：

SizedBox(
  width: 100,
  height: 100,
  child: FlareActor(),
)

应该这样做。

是否有任何解决方案可以使我的 Flare Button 正常工作？扑

Is there any solution to make my Flare Button work properly? Flutter

mobile

flare

dart

flutter