Flutter中设置TabBarView高度

Flutter中TabBarView高度默认充满全屏,the TabBarView doesn’t have a bounded height. 本文记录设置TabBarView高度的方法

参考:https://stackoverflow.com/questions/52023610/getting-horizontal-viewport-was-given-unbounded-height-with-tabbarview-in-flutter

(1)Wrap the parent widget(Column) with a limited height widget like SizedBox or AspectRatio. Then use the Expanded widget like this:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
SizedBox(
height: 300.0,
child: Column(
children: <Widget>[
.
.
.
Expanded(
child: TabBarView(
children: <Widget>[
Container(
height: 200.0,
color: Colors.grey,
),
Container(
height: 200.0,
color: Colors.green,
),
Container(
height: 200.0,
color: Colors.purple,
),
],
),
),
],
),
),

(2)Use a bounded widget like SizedBox or AspectRatio on the TabBarView itself:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
SizedBox(
height: 300.0,
child: TabBarView(
children: <Widget>[
Container(
color: Colors.grey,
),
Container(
color: Colors.green,
),
Container(
color: Colors.purple,
),
],
),
),

Powered by AppBlog.CN     浙ICP备14037229号

Copyright © 2012 - 2020 APP开发技术博客 All Rights Reserved.

访客数 : | 访问量 :