谁能告诉我为啥在尝试实现动画时在 Flutter 中出现此错误
Posted
技术标签:
【中文标题】谁能告诉我为啥在尝试实现动画时在 Flutter 中出现此错误【英文标题】：Can anybody tell why am I getting this error in Flutter while trying to implement animation谁能告诉我为什么在尝试实现动画时在 Flutter 中出现此错误 【发布时间】：2021-01-14 02:25:46 【问题描述】： Another exception was thrown: 'package:flutter/src/animation/curves.dart': Failed assertion: line 182 pos 12: 'begin <= 1.0': is not true.
════════小部件库捕获的异常═════════════════════════════════════ ═════════════════════ 'package:flutter/src/animation/curves.dart'：断言失败：第 182 行 pos 12：'begin
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_app_test/DrawerClass.dart';
import 'package:flutter_app_test/widgets/category_widget.dart';
import 'package:flutter_app_test/widgets/search_bar.dart';
import 'constants.dart';
class MyHomeWidget extends StatefulWidget
@override
State<StatefulWidget> createState()
return MyHomeWidgetState();
class MyHomeWidgetState extends State<MyHomeWidget>
with SingleTickerProviderStateMixin
AnimationController animationController;
Animation animationcolor;
Animation animationsize;
Animation animationsizeText;
@override
void initState()
super.initState();
animationController = AnimationController(vsync: this, duration: Duration(seconds:4));
animationsizeText=Tween<double>(begin: 10.0,end: 30.0).animate(CurvedAnimation(parent:
animationController,curve: Interval(1.75,2.75)));
animationsize = TweenSequence(
[
TweenSequenceItem(tween: Tween(begin: 50.0, end: 30.0), weight: 1),
TweenSequenceItem(tween: Tween(begin: 30.0, end: 50.0), weight: 1)
],).animate(CurvedAnimation(parent: animationController,curve: Interval(3.0,4.0)));
animationcolor = ColorTween(begin: Colors.grey, end: Colors.black)
.animate(animationController);
animationController.forward();
animationController.addListener(()
setState(() );
);
@override
Widget build(BuildContext context)
var screen_size = MediaQuery.of(context).size;
return Scaffold(
drawer: DrawerClass(),
appBar: AppBar(
title: Text("App Bar Title"),
),
bottomNavigationBar: BottomNavigationBar(
currentIndex: 0,
backgroundColor: Colors.blue,
items: [
BottomNavigationBarItem(
icon: Image.asset(
'assets/images/cloud.png',
height: 30,
),
title: Text(
'item1',
style: TextStyle(color: Colors.white),
),
),
BottomNavigationBarItem(
icon: Image.asset(
'assets/images/cloud.png',
height: 30,
),
title: Text(
'item2',
style: TextStyle(color: Colors.white),
),
),
BottomNavigationBarItem(
icon: Image.asset(
'assets/images/cloud.png',
height: 30,
),
title: Text(
'item3',
style: TextStyle(color: Colors.white),
),
),
],
),
body:Stack(
children: <Widget>[
Container(
width: screen_size.width,
height: screen_size.height * 0.4,
decoration: BoxDecoration(
color: Colors.lightBlueAccent,
image: DecorationImage(
image: AssetImage('assets/images/cloud.png'),
alignment: Alignment.centerLeft,
)),
child: Column(
children: [
Align(
alignment: Alignment.topRight,
child: Container(
width: animationsize.value,
height: animationsize.value,
decoration: BoxDecoration(
shape: BoxShape.circle,
color: Colors.white,
image: DecorationImage(
image: AssetImage('assets/images/cloud.png'),
),
),
),
),
Center(
child: Text(
"Good Morning, Faiz Ahammed",
style: TextStyle(
fontSize: animationsizeText.value,
fontWeight: FontWeight.w100,
color: animationcolor.value),
),
),
],
),
),
SafeArea(
child: Padding(
padding: EdgeInsets.fromLTRB(20.0, 120.0, 20.0,5.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
SearchBar(),
Expanded(
child: GridView.count(
mainAxisSpacing: 20.0,
crossAxisSpacing: 20.0,
childAspectRatio: 0.85,
crossAxisCount: 2,
children: <Widget>[
Category(
title: "Meditation",
svgsrc: "assets/images/cloud.png",
onPress: () ,
),
Category(
title: "Yoga",
svgsrc: "assets/images/cloud.png",
onPress: () ,
),
Category(
title: "Karatte",
svgsrc: "assets/images/cloud.png",
onPress: () ,
),
Category(
title: "Kunfu",
svgsrc: "assets/images/cloud.png",
onPress: () ,
),
Category(
title: "Swimming",
svgsrc: "assets/images/cloud.png",
onPress: () ,
),
Category(
title: "Cycling",
svgsrc: "assets/images/cloud.png",
onPress: () ,
),
Category(
title: "Trekking",
svgsrc: "assets/images/cloud.png",
onPress: () ,
),
Category(
title: "Sailing",
svgsrc: "assets/images/cloud.png",
onPress: () ,
),
],
),
),
],
),
),
),
],
),
);
【问题讨论】：
【参考方案1】：如果您在Interval Class documentation 阅读，您会看到：
从 0.0 直到开始的曲线，然后从 0.0 开始弯曲（根据曲线）到 1.0 结束，然后在结束后保持 1.0。
所以begin 和end 参数都必须是0.0<=begin<end<=1.0 之类的值。
在你的代码中你没有注意这个：
Interval(1.75,2.75)
如果不深入了解完整代码，我无法理解您的意图，但这些值没有意义。 Interval 是一条曲线，它只代表一个值如何变化，所以数字本身的缩放应该没有任何区别。
从技术上讲，曲线是将值从 0.0 -> 1.0 映射到 0.0 -> 1.0 的函数。也就是说，它可以使动画在其进程的不同部分加速或减速。顾名思义，它只指动画的Curve。有关常见动画曲线的示例，请参阅此page。
【讨论】：
以上是关于谁能告诉我为啥在尝试实现动画时在 Flutter 中出现此错误的主要内容，如果未能解决你的问题，请参考以下文章
如何在 Flutter 中显示 onclick 按钮动画布局？