flare_flutter 动画显示问题
flare_flutter animation display issues
问题是无法显示动画,只能显示图片。这里只有 BottomAnimeLoader 的部分代码。所以请帮我弄清楚为什么这里只有静态图像。 (使用flutter框架和dart语言)
the animation is static
import 'package:flare_flutter/flare_actor.dart';
import 'package:flutter/material.dart';
class BottomAnimeLoader extends StatefulWidget {
@override
_BottomAnimeLoaderState createState() => _BottomAnimeLoaderState();
}
class _BottomAnimeLoaderState extends State<BottomAnimeLoader> {
String _animationName = "new";
@override
Widget build(BuildContext context) {
return Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
mainAxisSize: MainAxisSize.min,
children: [
Expanded(
child: FlareActor(
"assets/flr/success.flr",
fit: BoxFit.contain,
alignment: Alignment.center,
animation: _animationName,
))
],
),
);
}
}
因为没有你的flr文件,我用官方例子的flr文件来模拟这个案例
如果你的_animationName
名称有误,那么它将变成静态图像
官方例子里的_animationName
是idle
,如果改成new
就会变成静态图
请更正您的_animationName
,例如下面的https://rive.app/a/pollux/files/flare/success-check_animationName
是Untitled
工作演示
完整测试代码
import 'package:flutter/material.dart';
import 'package:flare_flutter/flare_actor.dart';
class BottomAnimeLoader extends StatefulWidget {
@override
_BottomAnimeLoaderState createState() => _BottomAnimeLoaderState();
}
class _BottomAnimeLoaderState extends State<BottomAnimeLoader> {
String _animationName = "success";
@override
Widget build(BuildContext context) {
return Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
mainAxisSize: MainAxisSize.min,
children: [
Expanded(
child: FlareActor(
"assets/flr/success.flr",
fit: BoxFit.contain,
alignment: Alignment.center,
animation: _animationName,
))
],
),
);
}
}
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
visualDensity: VisualDensity.adaptivePlatformDensity,
),
home: BottomAnimeLoader(),
);
}
}
问题是无法显示动画,只能显示图片。这里只有 BottomAnimeLoader 的部分代码。所以请帮我弄清楚为什么这里只有静态图像。 (使用flutter框架和dart语言)
the animation is static
import 'package:flare_flutter/flare_actor.dart';
import 'package:flutter/material.dart';
class BottomAnimeLoader extends StatefulWidget {
@override
_BottomAnimeLoaderState createState() => _BottomAnimeLoaderState();
}
class _BottomAnimeLoaderState extends State<BottomAnimeLoader> {
String _animationName = "new";
@override
Widget build(BuildContext context) {
return Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
mainAxisSize: MainAxisSize.min,
children: [
Expanded(
child: FlareActor(
"assets/flr/success.flr",
fit: BoxFit.contain,
alignment: Alignment.center,
animation: _animationName,
))
],
),
);
}
}
因为没有你的flr文件,我用官方例子的flr文件来模拟这个案例
如果你的_animationName
名称有误,那么它将变成静态图像
官方例子里的_animationName
是idle
,如果改成new
就会变成静态图
请更正您的_animationName
,例如下面的https://rive.app/a/pollux/files/flare/success-check_animationName
是Untitled
工作演示
完整测试代码
import 'package:flutter/material.dart';
import 'package:flare_flutter/flare_actor.dart';
class BottomAnimeLoader extends StatefulWidget {
@override
_BottomAnimeLoaderState createState() => _BottomAnimeLoaderState();
}
class _BottomAnimeLoaderState extends State<BottomAnimeLoader> {
String _animationName = "success";
@override
Widget build(BuildContext context) {
return Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
mainAxisSize: MainAxisSize.min,
children: [
Expanded(
child: FlareActor(
"assets/flr/success.flr",
fit: BoxFit.contain,
alignment: Alignment.center,
animation: _animationName,
))
],
),
);
}
}
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
visualDensity: VisualDensity.adaptivePlatformDensity,
),
home: BottomAnimeLoader(),
);
}
}