我有Column
,里面有7个Expanded
小部件,其中一个是ClipRRect
,但是有一个问题:它不是圆形的。
我认为有两种方法:
用容器包装它,并为其宽度赋予最高值,但我不知道如何?
使用其他小部件吗?
使用CachedNetworkImage
时,不能使用CircleAvatar
。
Expanded(),
Expanded(),
Expanded(),
Expanded(
flex: 5,
//padding: EdgeInsets.symmetric(horizontal: 10),
child: TabBarView(
controller: _tabController,
children: <Widget>[
Center(
child: Text(
'tracks',
style: TextStyle(color: Colors.white),
)),
Container(
height: 20,
width: 20,
color: Colors.red,
child: AnimatedBuilder(
animation: _animationController,
child: AspectRatio (
aspectRatio: 1,
child: ClipOval(
//borderRadius: BorderRadius.circular(10000000.0),
child: CachedNetworkImage(
fit: BoxFit.cover,
imageUrl: thisSongInfo.albumImageUrl,
),
),
),
builder: (BuildContext context, Widget child) {
return Transform.rotate(
child: child,
angle: _animationController.value * 2.0 * math.pi,
);
},
),
),
Center(
child: Text(
'information',
style: TextStyle(color: Colors.white),
),
),
],
),
),
Expanded(),
Expanded(),
Expanded(),
我编辑并将所有代码放入扩展后的 我也把debugPaintSizeEnabled = true;即时通讯 链接: https://imge.to/i/fU8vi
答案 0 :(得分:0)
用ClipRRect
值为1的AspectRatio
小部件包装aspectRation
小部件。这将强制子小部件为正方形。
或者,如果合适,请使用CircleAvatar
小部件,将其子级显示为一个圆圈-这可以替换AspectRatio
和ClipRRect
小部件。
编辑:这实际上是由于TabBarView
出于某种原因强制将其子级显示为全角。将TabBarView
的子元素包装在Row
中,以便可以水平调整其大小。