超级会员免费看
这篇博客介绍了如何使用Flutter构建一个个人中心页面，特别是焦点在于如何利用Stack布局来实现角标位于图标右上角的效果，避免元素变形。内容涵盖了顶部导航栏、头部个人信息和订单Item项的布局实现，提到了Expanded的使用以适应不同长度的文本，并在后续部分讨论了适配问题和解决方案，包括文字居中和宽度调整。
个人中心页面
为什么要挑这个页面来讲解下布局呢，因为它比较具有代表意义，块状的布局，包含Row，Column，Stack。最主要的是角标的处理方式。在一般的页面中，我们都采用上下布局，左右布局，列表等来做，很巧合的是这里基本都有，同时有一个要注意的点是角标，属于绝对位置的布局。
首先我们来解析一下这个个人中心页面；
- 顶部导航栏；
- 头部个人信息；
- 订单和其他中的Item项（角标要注意下）；
这个页面由三部分组成，我们分别来说下三部分怎么实现：
- 顶部导航栏
appBar: AppBar(
backgroundColor: Color.fromRGBO(73, 129, 245
订阅专栏 解锁全文
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
