我有一个Flutter应用,正在下拉网站使用的文本,因此以HTML格式设置。我正在使用flutter_markdown软件包0.2.0版将其转换为适合在我的应用中显示的格式化文本。
这一切都很好,但是,如果我尝试在Markdown小部件上方和/或下方添加小部件,则不会呈现文本,Flutter会引发以下错误:
flutter: ══╡ EXCEPTION CAUGHT BY RENDERING LIBRARY ╞═════════════════════════════════════════════════════════
flutter: The following assertion was thrown during performResize():
flutter: Vertical viewport was given unbounded height.
flutter: Viewports expand in the scrolling direction to fill their container.In this case, a vertical
flutter: viewport was given an unlimited amount of vertical space in which to expand. This situation
flutter: typically happens when a scrollable widget is nested inside another scrollable widget.
flutter: If this widget is always nested in a scrollable widget there is no need to use a viewport because
flutter: there will always be enough vertical space for the children. In this case, consider using a Column
flutter: instead. Otherwise, consider using the "shrinkWrap" property (or a ShrinkWrappingViewport) to size
flutter: the height of the viewport to the sum of the heights of its children.
将Markdown代码放入扩展的窗口小部件中是可行的,但是markdown部分会滚动,并且按钮(或扩展窗口小部件外部的任何窗口小部件)都固定在屏幕上,并且不会随文本滚动。
我想知道整个事情是否需要在Expanded内进行,但是那又需要在Column,Row或Flex内进行,然后只有一个孩子,而我有多个孩子。我对结构有点困惑。我确定我确实缺少一些明显的东西?!
此代码给出错误:
class _DetailScreenState extends State<DetailScreen> {
GlobalKey<ScaffoldState> scaffoldState = GlobalKey();
@override
Widget build(BuildContext context) {
return Scaffold(
key: scaffoldState,
backgroundColor: Color(0xffeeeeee),
appBar: AppBar(
elevation: 0,
title: Text("Section Title", style: TextStyle(fontSize: 16.0, fontWeight: FontWeight.bold),)
),
body: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: <Widget>[
SizedBox(height: 20.0),
FlatButton.icon(
onPressed: _addToCalendar,
padding: EdgeInsets.all(15.0),
color: Color(0xffffd2b1),
icon: Icon(Icons.calendar_today),
label: const Text('Add to calendar', style: TextStyle(fontWeight:FontWeight.w300, fontSize: 15.0)),
),
Markdown(data: widget.programme.description),
FlatButton(
onPressed: _triggerFunction,
color: Color(0xffffd2b1),
padding: EdgeInsets.all(20),
child: Text('Button text here', style: TextStyle(fontFamily: 'roboto', fontWeight: FontWeight.bold, color: Colors.black87), textAlign: TextAlign.center,),
),
]
),
);
}
}
此代码将起作用...
class _DetailScreenState extends State<DetailScreen> {
GlobalKey<ScaffoldState> scaffoldState = GlobalKey();
@override
Widget build(BuildContext context) {
return Scaffold(
key: scaffoldState,
backgroundColor: Color(0xffeeeeee),
appBar: AppBar(
elevation: 0,
title: Text("Section Title", style: TextStyle(fontSize: 16.0, fontWeight: FontWeight.bold),)
),
body: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: <Widget>[
SizedBox(height: 20.0),
FlatButton.icon(
onPressed: _addToCalendar,
padding: EdgeInsets.all(15.0),
color: Color(0xffffd2b1),
icon: Icon(Icons.calendar_today),
label: const Text('Add to calendar', style: TextStyle(fontWeight:FontWeight.w300, fontSize: 15.0)),
),
Expanded(
child: Markdown(data: widget.programme.description),
),
FlatButton(
onPressed: _triggerFunction,
color: Color(0xffffd2b1),
padding: EdgeInsets.all(20),
child: Text('Button text here', style: TextStyle(fontFamily: 'roboto', fontWeight: FontWeight.bold, color: Colors.black87), textAlign: TextAlign.center,),
),
]
),
);
}
}
,但markdown部分滚动,按钮固定在屏幕上,并且不随文本滚动,这在我的应用程序的当前版本中还可以,但是客户端希望添加很多其他内容,所以我真的想能够拥有一个滚动区域,其中包含所有内容(包括降价)。