当前位置:网站首页>flutter 做底部的三个按键,有叠加,有填充
flutter 做底部的三个按键,有叠加,有填充
2022-07-30 23:13:00 【氤氲息】
//底部三个按键
Widget addBottomSection() {
return Container(
margin: const EdgeInsets.only(bottom: 24, left: 16, right: 16),
child: Row(
children: [
Expanded(
child: Container(
alignment: Alignment.center,//这个很重要
child: Stack(
clipBehavior: Clip.none,
alignment: Alignment.topRight,
children: [
GestureDetector(
onTap: () {
Future.delayed(const Duration(seconds: 1), () {
if (_isCanDrag) {
getBottleSetting();
}
});
setState(() {
_isDragAnimation = true;
});
dragPlay();
},
child: Stack(
clipBehavior: Clip.none,
alignment: Alignment.bottomCenter,
children: [
Container(
height: 102,
width: 102,
decoration: const BoxDecoration(
image: DecorationImage(
image:
AssetImage('assets/images/bg_drift_drag.png'),
fit: BoxFit.fill, // 完全填充
),
),
),
Positioned(
left: 10,
child: Container(
margin: const EdgeInsets.only(bottom: 20),
child: const Image(
image: AssetImage(
'assets/images/icon_drift_net.png'),
width: 100,
fit: BoxFit.fitWidth),
),
),
Container(
padding: const EdgeInsets.only(bottom: 10),
child: Text(
S.current.bottle_grab,
style: const TextStyle(
fontSize: 14,
color: Color(0xFFFFF5F1),
decoration: TextDecoration.none),
)),
],
),
),
Positioned(
right: -5, child: showMessageNumView(remainFishTimes))
],
),
)),
Expanded(
child: Container(
alignment: Alignment.center,
child: Stack(
clipBehavior: Clip.none,
alignment: Alignment.topRight,
children: [
GestureDetector(
onTap: () {
showThrowBottleDialog();
},
child: Stack(
clipBehavior: Clip.none,
alignment: Alignment.bottomCenter,
children: [
Container(
height: 102,
width: 102,
decoration: const BoxDecoration(
image: DecorationImage(
image:
AssetImage('assets/images/bg_drift_throw.png'),
fit: BoxFit.fill, // 完全填充
),
),
),
Positioned(
left: 20,
child: Container(
margin: const EdgeInsets.only(bottom: 35),
child: const Image(
image:
AssetImage('assets/images/icon_bottle.png'),
width: 64,
fit: BoxFit.fitWidth),
),
),
Container(
padding: const EdgeInsets.only(bottom: 10),
child: Text(
S.current.bottle_throw,
style: const TextStyle(
fontSize: 14,
color: const Color(0xFFFFF5F1),
decoration: TextDecoration.none),
)),
],
),
),
Positioned(
right: -5, child: showMessageNumView(remainThrowTimes))
],
),
)),
Expanded(
child: Container(
alignment: Alignment.center,
child: Stack(
clipBehavior: Clip.none,
alignment: Alignment.topRight,
children: [
GestureDetector(
onTap: () {
MyRouter.pushMy(context, const MyBottleNav())
.then((value) => getMessageNum());
},
child: Stack(
clipBehavior: Clip.none,
alignment: Alignment.bottomCenter,
children: [
Container(
height: 102,
width: 102,
decoration: const BoxDecoration(
image: DecorationImage(
image: AssetImage(
'assets/images/bg_drift_bottles.png'),
fit: BoxFit.fill, // 完全填充
),
),
),
Positioned(
left: 10,
child: Container(
margin: const EdgeInsets.only(bottom: 35),
child: const Image(
image: AssetImage(
'assets/images/icon_drift_bottles.png'),
width: 84,
fit: BoxFit.fitWidth),
),
),
Container(
padding: const EdgeInsets.only(bottom: 10),
child: Text(
S.current.bottle_my,
style: const TextStyle(
fontSize: 14,
color: Color(0xFFFFF5F1),
decoration: TextDecoration.none),
)),
],
),
),
Positioned(right: -5, child: showMessageNumView(MesNum))
],
),
)),
],
),
);
}
边栏推荐
- 力扣题(3)—— 无重复字符的最长子串
- 【MySQL】Mysql事务以及权限管理
- 2sk2225 Substitute 3A/1500V Chinese Documentation【PDF Data Book】
- IJCAI2022教程 | 口语语言理解:最新进展和新领域
- “蔚来杯“2022牛客暑期多校训练营2 H.Take the Elevator
- 编码与进制
- oracle数据库版本问题咨询(就是对比从数据库查询出来的版本,和docker里面的oracle版本)?
- [SAM template question] P3975 [TJOI2015] string theory
- Successfully solved ImportError: always import the name '_validate_lengths'
- Successfully resolved ModuleNotFoundError: No module named 'Image'
猜你喜欢
随机推荐
2021GDCPC广东省大学生程序设计竞赛 B.Byfibonacci
2sk2225代换3A/1500V中文资料【PDF数据手册】
Apache Doris系列之:深入认识实时分析型数据库Apache Doris
【MySQL】DQL相关操作
# Dasctf 7月赋能赛 WP
反转链表-就地逆置法
“蔚来杯“2022牛客暑期多校训练营4 N.Particle Arts 规律 方差
HF2022-EzPHP reproduction
Excel basic study notes
[MySQL] DQL related operations
【飞控开发基础教程10】疯壳·开源编队无人机-PID 基础原理
Detailed operator
成功解决ModuleNotFoundError: No module named ‘Image‘
阿里云视频点播+项目实战
leetcode 406. Queue Reconstruction by Height 根据身高重建队列(中等)
【MySQL】Mysql事务以及权限管理
反转链表-头插反转法
Summary of BFS questions
mysql获取当前时间
“蔚来杯“2022牛客暑期多校训练营4 L.Black Hole 垃圾计算几何







![[MySQL] DQL related operations](/img/a5/c92e0404c6a970a62595bc7a3b68cd.gif)
