Flutter开发中的问题小结
2020-08-11 本文已影响0人
only_run
图片的圆角不显示的问题
//不起作用
Container(
child: Image.network(
pickList[index],
fit: BoxFit.cover,
colorBlendMode: BlendMode.plus,
),
decoration: BoxDecoration(
borderRadius:
BorderRadius.all(Radius.circular(Adapter.px(12)))),
);
原因:Container的由三层图层叠加组成,decoration,child,foregroundDecoration;圆角设置到decoration被child的内容遮挡;
解决思路:图片加到decoration,或者child也设置圆角
Container(
decoration: BoxDecoration(
image: DecorationImage(
image: NetworkImage(pickList[index]), fit: BoxFit.cover),
borderRadius:
BorderRadius.all(Radius.circular(Adapter.px(12)))),
);
ClipRRect(
borderRadius: BorderRadius.all(Radius.circular(Adapter.px(5))),
child: Image.network(
'${inventory.imgUrl}',
width: Adapter.px(150),
height: Adapter.px(150),
fit: BoxFit.cover,
),
);
ListView嵌套GridView报错 需要指定GridView的高度
════════ Exception caught by rendering library ═════════════════════════════════════════════════════
The following assertion was thrown during performResize():
Vertical viewport was given unbounded height.
原因:ListView,GridView默认都是垂直方向滚动,ListView并不知道嵌套的同方向的可滚动Widget(不仅仅是GridView,ListView+ListView也是这样)的高度
解决思路:GridView设置固定的高度;
或者GridView禁止滚动 设置physics: NeverScrollableScrollPhysics(),同时ListView和GridView 包裹内容 设置shrinkWrap: true
@override
Widget buildContent(BuildContext context) {
return Container(
child: GridView.count(
crossAxisCount: 2,
children: list.map<Widget>((s) {
return Container(
height: Adapter.px(200),
child: Text('item $s'),
color: XColors.backGreen,
);
}).toList(),
mainAxisSpacing: Adapter.px(10),
crossAxisSpacing: Adapter.px(10),
//child宽高比例
childAspectRatio: 1.0,
//收缩使包裹内容
shrinkWrap: true,
//滚动特性
physics: NeverScrollableScrollPhysics(),
//预加载尺寸范围(宽度/高度,由滚动方向决定)
cacheExtent: Adapter.px(50),
),
);
}
其他参考:Flutter 问题收集及解决方案