我的 textview 只是让我底部溢出像素。我已经尝试将其放入扩展的 singlechildscrollview 中,但仍然收到相同的错误?
My textview just gives me bottom overflowed by pixels. I have tried putting it into expanded,singlechildscrollview but still same error is recieved?
这是我的代码,以便更好地理解。我正在使用文本视图在列中显示段落。我的容器的大小是固定的,其中放置了我的文本视图。
编辑:-
当我在带有滚动方向的文本视图上使用 singlechildscrollview 时:Axis。水平它可以工作但是当我将滚动方向更改为垂直时它显示相同的错误。
Container(
color: Colors.amber,
width: double.infinity,
height: MediaQuery.of(context).size.height * 0.85,
child: PageView(
//physics: NeverScrollableScrollPhysics(),
//to get list as pages using pageview
children: List.generate(4, (index) {
//creating indivadiuals pages for pageview inside a list
map_of_answers['q $index'] = idea['q $index'];
return Column(
children: [
Container(
//this is our question textview widget
width: double.infinity,
margin: const EdgeInsets.all(20),
child: Text(list_of_questions[index],
textAlign: TextAlign.center,
style: GoogleFonts.openSans(
fontWeight: FontWeight.w500, fontSize: 25)),
),
Container(
//our answer textview widget
padding: const EdgeInsets.all(20.0),
width: double.infinity,
child: Text(
idea['q $index'],
style: GoogleFonts.openSans(fontSize: 15),
),
),
],
);
}),
controller: controller,
onPageChanged: (value) {
setState(() {
activeIndex = value;
});
}));
Here is the screenshot of the error on my phone.
您可以用 SingleChildScrollView
包装列小部件,这将解决问题:
Container(
color: Colors.amber,
width: double.infinity,
height: MediaQuery.of(context).size.height * 0.85,
child: PageView(
//physics: NeverScrollableScrollPhysics(),
//to get list as pages using pageview
children: List.generate(4, (index) {
//creating indivadiuals pages for pageview inside a list
map_of_answers['q $index'] = idea['q $index'];
return SingleChildScrollView(
// add this widget
child: Column(
children: [
Container(
//this is our question textview widget
width: double.infinity,
margin: const EdgeInsets.all(20),
child: Text(list_of_questions[index],
textAlign: TextAlign.center,
style: GoogleFonts.openSans(
fontWeight: FontWeight.w500, fontSize: 25)),
),
Container(
//our answer textview widget
padding: const EdgeInsets.all(20.0),
width: double.infinity,
child: Text(
idea['q $index'],
style: GoogleFonts.openSans(fontSize: 15),
),
),
],
),
);
}),
controller: controller,
onPageChanged: (value) {
setState(() {
activeIndex = value;
});
}),
),
);
如果您未指定 height
和 width
,容器会根据 child 小部件调整其大小。这意味着如果 height
为空,它将查看其 child height
以调整自身大小。在这种情况下,它是您的 Text
小部件。由于您的 Text
小部件的高度不受限制,它将显示其所有当前内容,从而导致溢出或超过 MediaQuery.of(context).size.height * 0.85
高度。
您可以指定 Container
高度或使其可滚动。可以用 ListView
或 SingleChildScrollView
包装它。
这是我的代码,以便更好地理解。我正在使用文本视图在列中显示段落。我的容器的大小是固定的,其中放置了我的文本视图。
编辑:-
当我在带有滚动方向的文本视图上使用 singlechildscrollview 时:Axis。水平它可以工作但是当我将滚动方向更改为垂直时它显示相同的错误。
Container(
color: Colors.amber,
width: double.infinity,
height: MediaQuery.of(context).size.height * 0.85,
child: PageView(
//physics: NeverScrollableScrollPhysics(),
//to get list as pages using pageview
children: List.generate(4, (index) {
//creating indivadiuals pages for pageview inside a list
map_of_answers['q $index'] = idea['q $index'];
return Column(
children: [
Container(
//this is our question textview widget
width: double.infinity,
margin: const EdgeInsets.all(20),
child: Text(list_of_questions[index],
textAlign: TextAlign.center,
style: GoogleFonts.openSans(
fontWeight: FontWeight.w500, fontSize: 25)),
),
Container(
//our answer textview widget
padding: const EdgeInsets.all(20.0),
width: double.infinity,
child: Text(
idea['q $index'],
style: GoogleFonts.openSans(fontSize: 15),
),
),
],
);
}),
controller: controller,
onPageChanged: (value) {
setState(() {
activeIndex = value;
});
}));
Here is the screenshot of the error on my phone.
您可以用 SingleChildScrollView
包装列小部件,这将解决问题:
Container(
color: Colors.amber,
width: double.infinity,
height: MediaQuery.of(context).size.height * 0.85,
child: PageView(
//physics: NeverScrollableScrollPhysics(),
//to get list as pages using pageview
children: List.generate(4, (index) {
//creating indivadiuals pages for pageview inside a list
map_of_answers['q $index'] = idea['q $index'];
return SingleChildScrollView(
// add this widget
child: Column(
children: [
Container(
//this is our question textview widget
width: double.infinity,
margin: const EdgeInsets.all(20),
child: Text(list_of_questions[index],
textAlign: TextAlign.center,
style: GoogleFonts.openSans(
fontWeight: FontWeight.w500, fontSize: 25)),
),
Container(
//our answer textview widget
padding: const EdgeInsets.all(20.0),
width: double.infinity,
child: Text(
idea['q $index'],
style: GoogleFonts.openSans(fontSize: 15),
),
),
],
),
);
}),
controller: controller,
onPageChanged: (value) {
setState(() {
activeIndex = value;
});
}),
),
);
如果您未指定 height
和 width
,容器会根据 child 小部件调整其大小。这意味着如果 height
为空,它将查看其 child height
以调整自身大小。在这种情况下,它是您的 Text
小部件。由于您的 Text
小部件的高度不受限制,它将显示其所有当前内容,从而导致溢出或超过 MediaQuery.of(context).size.height * 0.85
高度。
您可以指定 Container
高度或使其可滚动。可以用 ListView
或 SingleChildScrollView
包装它。