关于Flutter 控件还有4个基础的没有说分别是
Stack(折叠布局)
Checkbox(单选框)
Wrap (流式布局)
ProgressIndicator(进度条)
还有一些常用的小部件
SizedBox(用来确定大小,设置边距,两个控件之间的距离)
Padding(设置内边距)
DecoratedBox(用来装饰父布局)
Divider (水平线)
VerticalDivider(垂直线)
但是今天的我膨胀了,想要试一下用Flutter 写一些稍微复杂一点的布局,先上图
1598324252(1).jpg
这个看起来比较复杂,写起来还是比较简单的我先把我写的效果图上一下
GIF 2020-8-25 11-00-01.gif
首先来分析一下这个布局,
由于可以滑动 ,并且不存在复用的可能,2个选择,SingleChildScrollView嵌套Column ,或者ListView 利用children 设置子布局,为了显示 滑动进度条 使用 Scrollbar ,仔细看一下除了Column 和Row 嵌套Expanded , 再给Text 设置其他的一些属性,剩下真就是没什么了
image.png
图例中标注了方向,水平的使用Row ,垂直的使用 Column
代码可以去demo里面找,
我学习flutter的整个过程都记录在里面了
https://www.jianshu.com/c/36554cb4c804
最后附上demo 地址
网友评论