scroll - 在颤动中如何仅滚动屏幕的下半部分
问题描述
我正在尝试创建一个 UI,其中上部是剪切视图内的图像,底部是一些文本内容。
我尝试了 Expanded 并使用 Expanded Widget 包装了 SingleChildScrollLView,但我得到了一个白屏。
var DetailsScreenBottomPart = SingleChildScrollView(
child: Column(
mainAxisSize: MainAxisSize.min,
children: <Widget>[
Padding(
padding: EdgeInsets.all(18.0),
child: Row(
children: <Widget>[
Text('Basic Information'),
Spacer(),
Text('See all')
],
)),
Container(
padding: EdgeInsets.symmetric(horizontal: 18.0, vertical: 20.0),
child: Text(
'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Urna porttitor rhoncus dolor purus non enim praesent. Tristique senectus et netus et malesuada. Justo laoreet sit amet cursus sit. Nunc sed blandit libero volutpat. Donec enim diam vulputate ut pharetra sit amet. Lacus luctus accumsan tortor posuere. Mauris nunc congue nisi vitae suscipit. Commodo nulla facilisi nullam vehicula ipsum a. Fermentum posuere urna nec tincidunt praesent semper feugiat nibh sed. Ultrices sagittis orci a scelerisque. Enim nulla aliquet porttitor lacus luctus accumsan tortor posuere ac. Consequat id porta nibh venenatis. Viverra mauris in aliquam sem fringilla ut morbi. Habitasse platea dictumst vestibulum rhoncus est pellentesque elit. Sollicitudin aliquam ultrices sagittis orci a scelerisque. Eget nunc lobortis mattis aliquam faucibus purus in massa tempor. asgdsgdsgfdsgsdfgsdgsdgsdgfsd asgsdhsdhsdh ghsh sfh sfh fsgh shg sfdh fsh sfgh j dfjsfh sfgj dfgj dfgj dfg jdfjg dfj dfjgdfj dfj dfgj d'),
),
],
));
我想要的输出非常简单,但是自从我今天开始颤动以来,我对小部件的可用性感到有些困惑和不知所措,我可以滚动屏幕的下半部分并保持上半部分不变吗?这在颤动中是否可能。
解决方案
您需要使用 Column with 2 Expanded Child。在你的第二个孩子里面保留可滚动的视图。例如:
@override
Widget build(BuildContext context) {
return Scaffold(
body: Column(
children: <Widget>[
Expanded(
flex: 1,
child: Container(),
),
Expanded(
flex: 1,
child: Container(
width: double.infinity,
child: SingleChildScrollView(
child: Column(
children: <Widget>[
Container(height: 100, child: Text("Item 1")),
Container(height: 100, child: Text("Item 2")),
Container(height: 100, child: Text("Item 3")),
Container(height: 100, child: Text("Item 4")),
Container(height: 100, child: Text("Item 5")),
Container(height: 100, child: Text("Item 6")),
Container(height: 100, child: Text("Item 7")),
Container(height: 100, child: Text("Item 8")),
Container(height: 100, child: Text("Item 9")),
Container(height: 100, child: Text("Item 10")),
],
),
),
),
)
],
));
}
推荐阅读
- python - 为什么“ stage += 1 ”行不起作用?
- powershell - 如何只恢复没有路径和文件扩展名的文件名?
- stanford-nlp - CoreNLP TrueCaseAnnotator 在某些情况下返回大写文本
- json - 来自 ajax 调用的全日历显示事件
- python - 如何处理两个神经网络的两个输入
- scala - 减少scala(不是Spark)
- android - onFailure : 调用没有参数的公共 okhttp3.RequestBody() 失败
- powerbi - 每年每个类别的标准差
- python - 在多个步骤中应用 `str.format()`(或 str.format_map()`)
- google-drive-api - 上传文件 Google drive api 文件名 无标题?