[英]IconButton widget in my flutter app takes 2-3 seconds to render. Why does this happen?
I am a flutter newbie.我是flutter新手。 I have two IconButtons in my android flutter app.我的 android flutter 应用程序中有两个 IconButtons。 When i run the app the two IconButtons take 2 seconds to render after all other components have rendered.当我运行应用程序时,两个 IconButtons 在所有其他组件呈现后需要 2 秒来呈现。
This is my code, The IconButtons are used in the end:这是我的代码,最后使用了 IconButtons:
class MyHomePageState extends State<MyHomePage> {
late Widget _iconButton1;
late Widget _iconButton2;
@override
void initState() {
_iconButton1 = IconButton(
padding: const EdgeInsets.all(0),
iconSize: 80,
onPressed: () {
setTime();
setState(() {});
},
icon: Image.asset("assets/reset_big.png"),
);
_iconButton2 = IconButton(
padding: const EdgeInsets.all(0),
iconSize: 80,
onPressed: () {
datePicker();
setState(() {});
},
icon: Image.asset("assets/calendar_big.png"),
);
super.initState();
count();
setState(() {});
}
@override
Widget build(BuildContext context) {
return Container(
decoration: const BoxDecoration(
image: DecorationImage(
image: AssetImage("assets/bgimg.jpg"), fit: BoxFit.cover),
),
child: Scaffold(
backgroundColor: Colors.transparent,
appBar: AppBar(
title: Column(
children: <Widget>[
const SizedBox(
height: 20,
),
Text(
widget.title,
style: const TextStyle(
fontFamily: 'Poppins', fontSize: 40, color: Colors.white60),
),
],
),
elevation: 0,
backgroundColor: Colors.transparent,
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Stack(
alignment: Alignment.center,
children: [
BlurryContainer(
blur: 0,
height: 150,
width: 150,
color: Colors.transparent,
borderRadius: const BorderRadius.all(Radius.circular(100)),
child: Center(
child: Text(
'$curr',
style: const TextStyle(
fontFamily: 'Rubik',
fontSize: 80,
color: Color.fromARGB(255, 240, 238, 243)),
),
),
),
],
),
],
),
),
floatingActionButton: Column(
mainAxisAlignment: MainAxisAlignment.end,
children: [
Container(
decoration: const BoxDecoration(
shape: BoxShape.circle,
color: Colors.transparent,
),
child: _iconButton1),
const SizedBox(
height: 10,
),
_iconButton2
FloatingActionButton(onPressed: () {
Navigator.push(context,
MaterialPageRoute(builder: (context) => SettingsScreen()));
})
],
),
),
);
}
}
and when i debug the app i get this in the console.当我调试应用程序时,我在控制台中得到了这个。 Don't know if its related to the issue.不知道它是否与问题有关。
I/MSHandlerLifeCycle(16618): isMultiSplitHandlerRequested: windowingMode=1 isFullscreen=true isPopOver=false isHidden=false skipActivityType=false isHandlerType=true this: DecorView@fe2bf28[MainActivity] I/MSHandlerLifeCycle(16618): isMultiSplitHandlerRequested: windowingMode=1 isFullscreen=true isPopOver=false isHidden=false skipActivityType=false isHandlerType=true 这个: DecorView@fe2bf28[MainActivity]
I thought it was because the widgets were being rebuilt and changed my code as this post says Prevent widget from being rebuilt But it has no effect.我认为这是因为小部件正在重建并更改了我的代码,因为这篇文章说防止小部件被重建但它没有效果。
I want the buttons to render just like the other components do.我希望按钮像其他组件一样呈现。
Your image sizes are probably too large.您的图像尺寸可能太大。
"assets/calendar_big.png"
"assets/reset_big.png"
Please check the sizes.请检查尺寸。
Also, pre cache the image like this inside initState另外,像这样在 initState 中预缓存图像
precacheImage(AssetImage("assets/calendar_big.png"), context);
precacheImage(AssetImage("assets/reset_big.png"), context);
Why are you initializing the widgets inside initState?为什么要在 initState 中初始化小部件?
Remove these from initState从 initState 中删除这些
_iconButton1 = IconButton(
padding: const EdgeInsets.all(0),
iconSize: 80,
onPressed: () {
setTime();
setState(() {});
},
icon: Image.asset("assets/reset_big.png"),
);
_iconButton2 = IconButton(
padding: const EdgeInsets.all(0),
iconSize: 80,
onPressed: () {
datePicker();
setState(() {});
},
icon: Image.asset("assets/calendar_big.png"),
);
Add them directly where they are needed in place of _iconButton1
and _iconButton2
.直接将它们添加到需要的位置,以代替_iconButton1
和_iconButton2
。
child: _iconButton1
_iconButton2
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.