From dd610eee1ffdb4b3284bf896ad6d811ecb4d07a6 Mon Sep 17 00:00:00 2001 From: myf <> Date: Tue, 12 Jul 2022 13:59:34 +0800 Subject: [PATCH] homehome --- images/home/{女@2x.png => girl.png} | Bin images/home/{男@2x.png => man.png} | Bin .../{`RW)I4{_ISB7DCGKW9)]RGV@2x.png => p.png} | Bin .../{展开@2x.png => right_arrow_green.png} | Bin lib/views/home/Home.dart | 343 +++++++++++++++--- pubspec.yaml | 4 +- 6 files changed, 296 insertions(+), 51 deletions(-) rename images/home/{女@2x.png => girl.png} (100%) rename images/home/{男@2x.png => man.png} (100%) rename images/home/{`RW)I4{_ISB7DCGKW9)]RGV@2x.png => p.png} (100%) rename images/home/{展开@2x.png => right_arrow_green.png} (100%) diff --git a/images/home/女@2x.png b/images/home/girl.png similarity index 100% rename from images/home/女@2x.png rename to images/home/girl.png diff --git a/images/home/男@2x.png b/images/home/man.png similarity index 100% rename from images/home/男@2x.png rename to images/home/man.png diff --git a/images/home/`RW)I4{_ISB7DCGKW9)]RGV@2x.png b/images/home/p.png similarity index 100% rename from images/home/`RW)I4{_ISB7DCGKW9)]RGV@2x.png rename to images/home/p.png diff --git a/images/home/展开@2x.png b/images/home/right_arrow_green.png similarity index 100% rename from images/home/展开@2x.png rename to images/home/right_arrow_green.png diff --git a/lib/views/home/Home.dart b/lib/views/home/Home.dart index cd36568..c37b8a4 100644 --- a/lib/views/home/Home.dart +++ b/lib/views/home/Home.dart @@ -352,8 +352,8 @@ class _RoomComponentState extends State { begin: Alignment.topLeft, end: Alignment.bottomRight, colors: [ - Color.fromRGBO(255, 255, 255, 1), Color.fromRGBO(254, 249, 252, 1), + Color.fromRGBO(255, 255, 255, 1), ], ), ), @@ -370,6 +370,7 @@ class _RoomComponentState extends State { ), ClassifyComponent(), GameComponent(), + PlayWithFriendsComponent(), ], ), ); @@ -465,66 +466,308 @@ class _GameComponentState extends State { @override Widget build(BuildContext context) { return Container( - padding: EdgeInsets.fromLTRB(15, 0, 15, 0), - child: Column( - children: [ - Row( + padding: EdgeInsets.fromLTRB(15, 0, 15, 0), + child: Column( + children: [ + Row( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + Text( + "一起玩", + style: TextStyle( + color: Color.fromRGBO(51, 51, 51, 1), + fontSize: 16, + fontWeight: FontWeight.w800, + ), + ), + Row( + children: [ + Text( + "更多", + style: TextStyle( + color: Color.fromRGBO(153, 153, 153, 1), + fontSize: 14, + ), + ), + SizedBox( + width: 6, + ), + Image.asset( + "images/home/right_arrow.png", + width: 6, + height: 12, + ) + ], + ) + ], + ), + SizedBox( + height: 12, + ), + Image.asset( + "images/home/game-1.png", + width: double.infinity, + height: 76, + ), + SizedBox( + height: 4, + ), + Image.asset( + "images/home/game-2.png", + width: double.infinity, + height: 76, + ), + SizedBox( + height: 4, + ), + Image.asset( + "images/home/game-3.png", + width: double.infinity, + height: 76, + ), + SizedBox( + height: 23, + ), + ], + ), + ); + } +} + +// 玩友 +class PlayWithFriendsComponent extends StatefulWidget { + PlayWithFriendsComponent({Key? key}) : super(key: key); + + @override + State createState() => + _PlayWithFriendsComponentState(); +} + +class _PlayWithFriendsComponentState extends State { + final List _list = [ + { + "photo": "images/home/room.png", + "name": "小寡妇", + "distance": "8.9", + "constellation": "双鱼座", + "type": "1", + "sex": "0", + }, + { + "photo": "images/home/room.png", + "name": "单身狗", + "distance": "2.55", + "constellation": "双鱼座", + "type": "1", + "sex": "1", + }, + { + "photo": "images/home/room.png", + "name": "黑寡妇", + "distance": "4.0", + "constellation": "双鱼座", + "type": "1", + "sex": "0", + }, + { + "photo": "images/home/photo.png", + "name": "钻石王老五", + "distance": "3.9", + "constellation": "双鱼座", + "type": "2", + "sex": "1", + }, + { + "photo": "images/home/ranking.png", + "name": "钻石王老五", + "distance": "4.55", + "constellation": "射手座", + "type": "1", + "sex": "1", + } + ]; + + List _getData() { + List arr = []; + for (var i = 0; i < _list.length; i++) { + arr.add(Column( + children: [ + Container( + height: 84, + padding: EdgeInsets.fromLTRB(10, 6, 10, 6), + width: double.infinity, + decoration: BoxDecoration( + color: Color.fromRGBO(255, 255, 255, 1), + borderRadius: BorderRadius.all(Radius.circular(15)), + boxShadow: [ + BoxShadow( + // color: Color.fromRGBO(51, 51, 51, 1), + color: Color.fromRGBO(0, 0, 0, 0.1), + offset: Offset(0.0, 4.0), //阴影xy轴偏移量 + blurRadius: 24.0, //阴影模糊程度 + spreadRadius: 1.0 //阴影扩散程度 + ) + ], + ), + child: Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ - Text( - "一起玩", - style: TextStyle( - color: Color.fromRGBO(51, 51, 51, 1), - fontSize: 16, - fontWeight: FontWeight.w800, - ), - ), Row( children: [ - Text( - "更多", - style: TextStyle( - color: Color.fromRGBO(153, 153, 153, 1), - fontSize: 14, + ClipOval( + child: Image.asset( + _list[i]['photo'], + width: 73, + height: 73, ), ), SizedBox( - width: 6, + width: 8, ), - Image.asset( - "images/home/right_arrow.png", - width: 6, - height: 12, + Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + SizedBox( + height: 9, + ), + Row( + children: [ + Text( + _list[i]['name'], + style: TextStyle( + fontSize: 14, + color: Color.fromRGBO(51, 51, 51, 1), + fontWeight: FontWeight.bold), + ), + SizedBox( + width: 5, + ), + // "images/home/man.png",//男 + _list[i]["sex"] == "0" + ? Image.asset( + "images/home/girl.png", + width: 15, + height: 15, + ) + : Image.asset( + "images/home/man.png", + width: 15, + height: 15, + ), + ], + ), + Text( + "${_list[i]['distance']}km", + style: TextStyle( + fontSize: 10, + color: Color.fromRGBO(153, 153, 153, 1), + ), + ), + SizedBox( + height: 6, + ), + Container( + padding: EdgeInsets.fromLTRB(8, 2, 8, 2), + decoration: BoxDecoration( + color: Color.fromRGBO(239, 239, 241, 1), + borderRadius: BorderRadius.all(Radius.circular(8)), + ), + child: Text( + _list[i]['constellation'], + style: TextStyle( + fontSize: 10, + color: Color.fromRGBO(51, 51, 51, 1), + ), + ), + ), + ], ) ], - ) + ), + Container( + padding: EdgeInsets.fromLTRB(10, 6, 10, 6), + decoration: BoxDecoration( + color: Color.fromRGBO(234, 249, 251, 1), + borderRadius: BorderRadius.all(Radius.circular(13))), + child: Row( + children: [ + Text( + '在玩${_list[i]['type'] == "1" ? "交友派对" : _list[i]['type'] == "2" ? "相亲房" : ""}', + style: TextStyle( + color: Color.fromRGBO(21, 185, 208, 1), + fontSize: 12, + fontWeight: FontWeight.w400, + ), + ), + SizedBox( + width: 8, + ), + Image.asset( + "images/home/right_arrow_green.png", + width: 5, + height: 8, + ), + ], + ), + ), ], ), - SizedBox( - height: 12, - ), - Image.asset( - "images/home/game-1.png", - width: double.infinity, - height: 76, - ), - SizedBox( - height: 4, - ), - Image.asset( - "images/home/game-2.png", - width: double.infinity, - height: 76, - ), - SizedBox( - height: 4, - ), - Image.asset( - "images/home/game-3.png", - width: double.infinity, - height: 76, - ), - ], - )); + ), + SizedBox( + height: 10, + ), + ], + )); + } + return arr; + } + + @override + Widget build(BuildContext context) { + return Container( + padding: EdgeInsets.fromLTRB(15, 0, 15, 0), + child: Column( + children: [ + Row( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + Text( + "玩友", + style: TextStyle( + color: Color.fromRGBO(51, 51, 51, 1), + fontSize: 16, + fontWeight: FontWeight.w800, + ), + ), + Row( + children: [ + Text( + "开启位置权限，获得附近玩友", + style: TextStyle( + color: Color.fromRGBO(153, 153, 153, 1), + fontSize: 14, + ), + ), + SizedBox( + width: 6, + ), + Image.asset( + "images/home/right_arrow.png", + width: 6, + height: 12, + ) + ], + ) + ], + ), + SizedBox( + height: 16, + ), + Column( + children: _getData(), + ), + ], + ), + ); } } diff --git a/pubspec.yaml b/pubspec.yaml index e4ca624..1546d82 100644 --- a/pubspec.yaml +++ b/pubspec.yaml @@ -83,7 +83,9 @@ flutter: - images/home/game-1.png - images/home/game-2.png - images/home/game-3.png - + - images/home/girl.png + - images/home/man.png + - images/home/right_arrow_green.png # An image asset can refer to one or more resolution-specific "variants", see # https://flutter.dev/assets-and-images/#resolution-aware