如何解决行中的“颤振”图标“ X像素右溢出”
我正在尝试在Flutter中构建一个标签栏,使其关闭和打开动画。当它打开时,由于行中的图标只有在行扩展后才完全可见,所以给了我著名的Flutter“溢出”错误。
我尝试阅读有关可能的解决方案的信息,但大多数都与文本溢出问题有关。我曾尝试将我的Row用“扩展”包装,但是我意识到无论如何这没有多大意义。我查看了其他解决方案,但是找不到与“行中的图标”小部件有关的问题类似的东西。
我希望有人能帮助我,希望这对以后的人有所帮助。
class Agent < ApplicationRecord
def self.totals_in_last_three_months
joins("
RIGHT JOIN generate_series(
date_trunc('month',statement_timestamp() - interval'2 months'),date_trunc('month',statement_timestamp()),interval'1 month'
) as months(month)
ON date_trunc('month',agents.created_at) = months.month")
.group('months.month')
.count('agents.*')
end
end
解决方法
有许多选项可以处理它,具体取决于您的需求。我添加了两个
- 首先。包装
Flexible Widget
Flutter Widget of the Week about it 中的每个图标
bool isSelected = false;
@override
Widget build(BuildContext context) {
return GestureDetector(
onTap: () {
setState(() {
isSelected = !isSelected;
});
},child: Center(
child: AnimatedContainer(
padding: isSelected
? EdgeInsets.symmetric(vertical: 12.0,horizontal: 12.0)
: EdgeInsets.symmetric(vertical: 12.0,horizontal: 30.0),width: isSelected ? 48 : MediaQuery.of(context).size.width * 0.85,child: isSelected
? Icon(Icons.favorite)
: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,children: [
_icon(Icons.home),_icon(Icons.message),_icon(Icons.add),_icon(Icons.shopping_cart),_icon(Icons.person_outline),],),decoration: BoxDecoration(
color: Colors.grey,borderRadius: BorderRadius.circular(30)),duration: Duration(seconds: 1),curve: Curves.fastOutSlowIn,);
}
Widget _icon(IconData data) {
return Flexible(child: Icon(data));
}
- 第二个是使用onEnd回调。 documentation。
bool isSelected = false; bool hasFullWidth = true;
@override
Widget build(BuildContext context) {
return GestureDetector(
onTap: () {
setState(() {
isSelected = !isSelected;
hasFullWidth = false;
});
},child: !isSelected && hasFullWidth
? Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,children: [
Icon(Icons.home),Icon(Icons.message),Icon(Icons.add),Icon(Icons.shopping_cart),Icon(Icons.person_outline),)
: Icon(Icons.favorite),onEnd: () {
if (!isSelected) {
setState(() {
hasFullWidth = true;
});
}
},);
}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。