xjw/circle_app
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

添加圈子页面UI

Browse Source
This commit is contained in:
CYH 2023-06-14 15:07:13 +08:00
parent 0fe1290440
commit 001aef310a
44 changed files with 1142 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
circle_app/assets/images/circle/add.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 22 KiB

BIN
circle_app/assets/images/circle/add_tip_bg.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 72 KiB

BIN
circle_app/assets/images/circle/avatar_bg.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.7 KiB

BIN
circle_app/assets/images/circle/chat.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.0 KiB

BIN
circle_app/assets/images/circle/circle_bg.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 196 KiB

BIN
circle_app/assets/images/circle/circle_desc.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 70 KiB

BIN
circle_app/assets/images/circle/close.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.9 KiB

BIN
circle_app/assets/images/circle/location.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.2 KiB

BIN
circle_app/assets/images/circle/more.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.9 KiB

BIN
circle_app/assets/images/circle/my_circle.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.9 KiB

BIN
circle_app/assets/images/circle/normal_bg.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 121 KiB

BIN
circle_app/assets/images/circle/pic_bg.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 206 KiB

BIN
circle_app/assets/images/circle/play.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.2 KiB

BIN
circle_app/assets/images/circle/send_msg.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 23 KiB

BIN
circle_app/assets/images/circle/top_circle_bg.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 171 KiB

BIN
circle_app/assets/images/circle/vip.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 7.2 KiB

BIN
circle_app/assets/images/circle/vip_say.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 11 KiB

BIN
circle_app/assets/images/msg/msg_arr.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.5 KiB

BIN
circle_app/assets/images/msg/msg_first.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 27 KiB

BIN
circle_app/assets/images/msg/msg_love.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 7.9 KiB

BIN
circle_app/assets/images/msg/msg_pipei.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 14 KiB

BIN
circle_app/assets/images/tabbar/tabbar_bg.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 234 KiB

25
circle_app/ios/Podfile.lock
View File

@ -3,17 +3,32 @@ PODS:
- fluttertoast (0.0.2):
- Flutter
- Toast
- FMDB (2.7.5):
- FMDB/standard (= 2.7.5)
- FMDB/standard (2.7.5)
- image_picker_ios (0.0.1):
- Flutter
- path_provider_foundation (0.0.1):
- Flutter
- FlutterMacOS
- sqflite (0.0.3):
- Flutter
- FMDB (>= 2.7.5)
- Toast (4.0.0)
- url_launcher_ios (0.0.1):
- Flutter
DEPENDENCIES:
- Flutter (from `Flutter`)
- fluttertoast (from `.symlinks/plugins/fluttertoast/ios`)
- image_picker_ios (from `.symlinks/plugins/image_picker_ios/ios`)
- path_provider_foundation (from `.symlinks/plugins/path_provider_foundation/ios`)
- sqflite (from `.symlinks/plugins/sqflite/ios`)
- url_launcher_ios (from `.symlinks/plugins/url_launcher_ios/ios`)
SPEC REPOS:
trunk:
- FMDB
- Toast
EXTERNAL SOURCES:
@ -23,12 +38,22 @@ EXTERNAL SOURCES:
:path: ".symlinks/plugins/fluttertoast/ios"
image_picker_ios:
:path: ".symlinks/plugins/image_picker_ios/ios"
path_provider_foundation:
:path: ".symlinks/plugins/path_provider_foundation/ios"
sqflite:
:path: ".symlinks/plugins/sqflite/ios"
url_launcher_ios:
:path: ".symlinks/plugins/url_launcher_ios/ios"
SPEC CHECKSUMS:
Flutter: f04841e97a9d0b0a8025694d0796dd46242b2854
fluttertoast: fafc4fa4d01a6a9e4f772ecd190ffa525e9e2d9c
FMDB: 2ce00b547f966261cd18927a3ddb07cb6f3db82a
image_picker_ios: 4a8aadfbb6dc30ad5141a2ce3832af9214a705b5
path_provider_foundation: eaf5b3e458fc0e5fbb9940fb09980e853fe058b8
sqflite: 31f7eba61e3074736dff8807a9b41581e4f7f15a
Toast: 91b396c56ee72a5790816f40d3a94dd357abc196
url_launcher_ios: 08a3dfac5fb39e8759aeb0abbd5d9480f30fc8b4
PODFILE CHECKSUM: ef19549a9bc3046e7bb7d2fab4d021637c0c58a3

10
circle_app/lib/app/call_out/binding.dart Normal file
View File

@ -0,0 +1,10 @@
import 'package:get/get.dart';
import 'logic.dart';
class Call_outBinding extends Bindings {
@override
void dependencies() {
Get.lazyPut(() => Call_outLogic());
}
}

7
circle_app/lib/app/call_out/logic.dart Normal file
View File

@ -0,0 +1,7 @@
import 'package:get/get.dart';
import 'state.dart';
class Call_outLogic extends GetxController {
final Call_outState state = Call_outState();
}

5
circle_app/lib/app/call_out/state.dart Normal file
View File

@ -0,0 +1,5 @@
class Call_outState {
Call_outState() {
///Initialize variables
}
}

16
circle_app/lib/app/call_out/view.dart Normal file
View File

@ -0,0 +1,16 @@
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'logic.dart';
class Call_outPage extends StatelessWidget {
Call_outPage({Key? key}) : super(key: key);
final logic = Get.find<Call_outLogic>();
final state = Get.find<Call_outLogic>().state;
@override
Widget build(BuildContext context) {
return Container();
}
}

10
circle_app/lib/app/circle/logic.dart Normal file
View File

@ -0,0 +1,10 @@
import 'package:flutter/cupertino.dart';
import 'package:get/get.dart';
import 'state.dart';
class CircleLogic extends GetxController {
PageController pageController = PageController(initialPage: 1,viewportFraction: 0.8
);
final CircleState state = CircleState();
}

7
circle_app/lib/app/circle/state.dart Normal file
View File

@ -0,0 +1,7 @@
class CircleState {
String msg = '';
int index = 1;
CircleState() {
///Initialize variables
}
}

821
circle_app/lib/app/circle/view.dart Normal file
View File

@ -0,0 +1,821 @@
import 'package:circle_app/util/util.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:flutter_swiper/flutter_swiper.dart';
import 'package:get/get.dart';
import 'logic.dart';
class CirclePage extends StatelessWidget {
CirclePage({Key? key}) : super(key: key);
final logic = Get.put(CircleLogic());
final state = Get.find<CircleLogic>().state;
@override
Widget build(BuildContext context) {
return Container(
width: MediaQuery.of(context).size.width,
height: MediaQuery.of(context).size.height,
decoration: BoxDecoration(
image: DecorationImage(
fit: BoxFit.fill,
image: AssetImage(getBaseImage('home_back')))),
// child: Image.asset(
// getBaseImage('bg'),
// fit: BoxFit.fill,
// ),
child: Scaffold(
backgroundColor: Colors.transparent,
body: SafeArea(
child: GetBuilder(builder: (CircleLogic controller) {
return Container(
child: Column(children: [
navigatorItem(),
Text(controller.state.msg),
//组件使用
Expanded(
child: Swiper(
itemBuilder: (BuildContext context, int index) {
return _getPageByIndex(index);
},
onIndexChanged: (index) {
controller.state.index = index;
controller.update();
},
index: controller.state.index,
itemCount: 3,
viewportFraction: 0.95,
// scale: 0.9,
loop: false,
// pagination: new SwiperPagination(),//如果不填则不显示指示点
// control: new SwiperControl(),//如果不填则不显示左右按钮
))
]),
);
}),
),
));
}
navigatorItem() {
List<String> urlList = [
'https://p3-passport.byteimg.com/img/user-avatar/eb429d4dbb3c246f580a6f7894f2b246~100x100.awebp',
'https://p3-passport.byteimg.com/img/user-avatar/eb429d4dbb3c246f580a6f7894f2b246~100x100.awebp',
'https://p3-passport.byteimg.com/img/user-avatar/eb429d4dbb3c246f580a6f7894f2b246~100x100.awebp'
];
List<Widget> widgets = [];
int index = 0;
urlList.forEach((element) {
widgets.add(Positioned(
left: 15.sp * index,
child: circleWidget(element),
));
index++;
});
return Container(
width: Get.width,
padding: EdgeInsets.only(left: 18.sp, right: 18.sp),
height: 44.sp,
child: Stack(
alignment: Alignment.center,
children: [
Positioned(
left: 0,
child: Container(
width: 30.sp * widgets.length,
height: 44.sp,
child: Stack(
children: widgets,
),
)),
ShaderMask(
shaderCallback: (Rect bounds) {
return const LinearGradient(
begin: Alignment(0.0, -1.0),
end: Alignment.bottomCenter,
colors: [Color(0xff71F3F2), Color(0xffF657FF)],
).createShader(Offset.zero & bounds.size);
},
child: Text(
'发现',
style: TextStyle(
fontSize: 18.sp,
fontWeight: FontWeight.w600,
color: Colors.white,
shadows: [
Shadow(color: Color(0xffF657FF), offset: Offset(0.0, -1))
]),
),
),
Positioned(
right: 0,
child: GestureDetector(
child: Image.asset(
getCircleImage('my_circle'),
width: 64.sp,
),
)),
],
),
);
}
circleWidget(String url, {double width = 30}) {
return GestureDetector(
child: Stack(
alignment: Alignment.center,
children: [
Image.asset(
getCircleImage('avatar_bg'),
width: width.sp,
),
ClipOval(
child: Image.network(
url,
width: (width - 1).sp,
height: (width - 1).sp,
fit: BoxFit.fill,
),
)
],
));
}
_getPageByIndex(int index) {
TextSpan span = TextSpan(
text: '查看更多',
style: TextStyle(color: Color(0xFFFF4DF6), fontSize: 14.sp),
);
TextSpan descSpan = TextSpan(
text: '圈子介绍圈子介绍圈子介绍圈子介绍圈子介绍圈子介绍圈子介绍圈子介绍圈子介绍圈子介绍圈子介绍圈',
style: TextStyle(color: Colors.white, fontSize: 12.sp),
);
List<String> urlList = [
'https://p3-passport.byteimg.com/img/user-avatar/eb429d4dbb3c246f580a6f7894f2b246~100x100.awebp',
'https://p3-passport.byteimg.com/img/user-avatar/eb429d4dbb3c246f580a6f7894f2b246~100x100.awebp',
'https://p3-passport.byteimg.com/img/user-avatar/eb429d4dbb3c246f580a6f7894f2b246~100x100.awebp'
];
List<Widget> widgets = [];
int index = 0;
urlList.forEach((element) {
widgets.add(Positioned(
left: 15.sp * index,
child: circleWidget(element),
));
index++;
});
return ClipRRect(
borderRadius: BorderRadius.circular(10.sp),
child: Container(
width: Get.width,
margin: EdgeInsets.only(left: index > 0 ? 4.sp : 0, right: 4.sp),
child: Stack(
children: [
ClipRRect(
borderRadius: BorderRadius.circular(10.sp),
child: SizedBox(
width: Get.width,
child: Image.asset(
getCircleImage('circle_bg'),
fit: BoxFit.fill,
),
)),
Container(
height: Get.height,
width: Get.width,
margin: EdgeInsets.only(top: 72.sp),
child: ListView.builder(
itemCount: 3,
itemBuilder: (context,index) {
if (index == 0) {
return Container(
padding: EdgeInsets.only(left: 12.sp, right: 12.sp),
height: 72.sp,
decoration: BoxDecoration(
image: DecorationImage(
fit: BoxFit.fill,
image:
AssetImage(getCircleImage('circle_desc')))),
child: Column(
children: [
Container(
width: Get.width,
child: RichText(
overflow: TextOverflow.fade,
maxLines: 2,
text: TextSpan(
children: <InlineSpan>[descSpan, span])),
),
Container(
child: Row(
children: [
Row(
children: [
Container(
height: 30.sp,
width: 30.0 + 15 * (widgets.length - 1),
child: Stack(
children: widgets,
),
),
SizedBox(
width: 8.sp,
),
Text(
'3.5万圈友',
style: TextStyle(
color: Colors.white, fontSize: 12.sp),
),
SizedBox(
width: 8.sp,
),
Image.asset(
getCircleImage('play'),
width: 20.sp,
)
],
)
],
),
),
],
),
);
} else if (index == 1) {
return vipDynamicItem();
} else {
return normalDynamicItem();
}
}),
),
ClipRRect(
borderRadius: BorderRadius.only(
topLeft: Radius.circular(10.sp),
topRight: Radius.circular(10.sp)),
child: Container(
padding: EdgeInsets.only(left: 12.sp, right: 12.sp),
height: 72.sp,
decoration: BoxDecoration(
image: DecorationImage(
fit: BoxFit.fill,
image: AssetImage(
getCircleImage('top_circle_bg')))),
child: Row(
// mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Image.network(
'https://p3-passport.byteimg.com/img/user-avatar/eb429d4dbb3c246f580a6f7894f2b246~100x100.awebp',
width: 42.sp,
height: 42.sp,
fit: BoxFit.fill,
),
Expanded(
child: Container(
padding:
EdgeInsets.only(left: 8.sp, top: 12.sp),
alignment: Alignment.centerLeft,
height: 72.sp,
child: Column(
children: [
Text(
'圈子名称',
style: TextStyle(
color: Colors.white,
fontSize: 18.sp,
fontWeight: FontWeight.w600),
),
SizedBox(
height: 4.sp,
),
Text(
'35.6万人看过',
style: TextStyle(
color: Color(0xff03FEFB),
fontSize: 12.sp,
),
),
],
),
)),
GestureDetector(
onTap: () {
Get.bottomSheet(tipWdiget(),isScrollControlled:true,enableDrag:false);
},
child: Image.asset(
getCircleImage('add'),
width: 77.sp,
),
)
],
),
)),
Positioned(
bottom: 56.sp,
right: 0.sp,
child: GestureDetector(child: Image.asset(getCircleImage('send_msg'),width: 60.sp,)))
],
)));
}
///至尊喊话
vipDynamicItem() {
Text descText = Text(
'圈子介绍圈子介绍圈子介绍圈子介绍圈子介绍圈子介绍圈子介圈子介绍圈子介绍圈',
style: TextStyle(color: Colors.white, fontSize: 14.sp),
);
List<String> urlList = [
'https://p3-passport.byteimg.com/img/user-avatar/eb429d4dbb3c246f580a6f7894f2b246~100x100.awebp',
'https://p3-passport.byteimg.com/img/user-avatar/eb429d4dbb3c246f580a6f7894f2b246~100x100.awebp',
'https://p3-passport.byteimg.com/img/user-avatar/eb429d4dbb3c246f580a6f7894f2b246~100x100.awebp'
];
List<Widget> widgets = [];
int index = 0;
urlList.forEach((element) {
widgets.add(Positioned(
left: 12.sp * index,
child: circleWidget(element, width: 24),
));
index++;
});
widgets.add(Positioned(
left: 12.sp * urlList.length,
child: Image.asset(
getCircleImage('more'),
width: 24.sp,
)));
return Container(
margin: EdgeInsets.only(top: 10.sp),
width: Get.width,
height: 279.sp,
decoration: BoxDecoration(
image: DecorationImage(
fit: BoxFit.fill,
image: AssetImage(
getCircleImage('pic_bg'),
))),
child: Stack(
children: [
Positioned(
left: 0,
top: 2.sp,
child: Image.asset(getCircleImage('vip_say')),
height: 18.sp,
),
Positioned(
right: 2.sp,
top: 2.sp,
child: Image.asset(getCircleImage('location')),
height: 18.sp,
),
Container(
height: 279.sp,
width: Get.width,
padding: EdgeInsets.only(top: 12.sp, left: 12.sp, right: 12.sp),
child: Column(
children: [
Container(
height: 72.sp,
child: Row(
// mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
GestureDetector(
child: Stack(
alignment: Alignment.center,
children: [
Image.asset(
getCircleImage('avatar_bg'),
width: 42.sp,
),
ClipOval(
child: Image.network(
'https://p3-passport.byteimg.com/img/user-avatar/eb429d4dbb3c246f580a6f7894f2b246~100x100.awebp',
width: 40.sp,
height: 40.sp,
fit: BoxFit.fill,
),
)
],
)),
Expanded(
child: Container(
padding: EdgeInsets.only(left: 8.sp, top: 12.sp),
alignment: Alignment.centerLeft,
height: 72.sp,
child: Column(
children: [
Row(
children: [
Text(
'圈子名称',
style: TextStyle(
color: Colors.white,
fontSize: 18.sp,
fontWeight: FontWeight.w600),
),
SizedBox(
width: 8.sp,
),
Image.asset(
getCircleImage('vip'),
width: 36.sp,
)
],
),
SizedBox(
height: 4.sp,
),
Row(
children: [
Container(
alignment: Alignment.center,
height: 18.sp,
padding:
EdgeInsets.only(left: 6.sp, right: 6.sp),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(9.sp),
gradient:const LinearGradient(
begin: Alignment(0.25, 0.5),
end: Alignment(0.75, 0.5),
colors: [
Color(0xff8DFFF8),
Color(0xffB5D3FF)
])),
child: Text(
'男.33.DOM.异性恋',
style: TextStyle(
color: Colors.black,
fontSize: 12.sp,
),
),
)
],
),
],
),
)),
],
),
),
Container(
// margin: EdgeInsets.only(top: 4.sp),
child: descText,
),
Container(
height: 100.sp,
margin: EdgeInsets.only(top: 5.sp),
child: GridView(
physics: const NeverScrollableScrollPhysics(),
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: 3, //横轴三个子widget
crossAxisSpacing: 8.sp,
childAspectRatio: 1.0 //宽高比为1时，子widget
),
children: <Widget>[
ClipRRect(
borderRadius: BorderRadius.circular(6.sp),
child: Image.network(
'https://pic1.zhimg.com/v2-3be05963f5f3753a8cb75b6692154d4a_720w.jpg?source=172ae18b',
fit: BoxFit.fill,
),
),
ClipRRect(
borderRadius: BorderRadius.circular(6.sp),
child: Image.network(
'https://pic1.zhimg.com/v2-3be05963f5f3753a8cb75b6692154d4a_720w.jpg?source=172ae18b',
fit: BoxFit.fill),
),
ClipRRect(
borderRadius: BorderRadius.circular(6.sp),
child: Image.network(
'https://pic1.zhimg.com/v2-3be05963f5f3753a8cb75b6692154d4a_720w.jpg?source=172ae18b',
fit: BoxFit.fill),
),
]),
),
Container(
height: 34.sp,
padding: EdgeInsets.only(left: 5.sp,right: 10.sp),
margin: EdgeInsets.only(top: 5.sp),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(17.sp),
gradient: const LinearGradient(
begin: Alignment(0.25, 0.5),
end: Alignment(0.75, 0.5),
colors: [Color(0xff261240), Color(0xff122D40)])),
child: Row(
children: [
Container(
width: 24 + 12.sp * widgets.length - 12.sp,
height: 24.sp,
child: Stack(children: widgets),
),
SizedBox(width: 4.sp,),
Expanded(
child: Text(
'1位圈友已私聊',
style: TextStyle(color: Colors.white, fontSize: 12.sp),
)),
Image.asset(
getCircleImage('chat'),
width: 60.sp,
)
],
),
)
],
),
)
],
),
);
}
///普通图文喊话
normalDynamicItem() {
Text descText = Text(
'圈子介绍圈子介绍圈子介绍圈子介绍圈子介绍圈子介绍圈子介圈子介绍圈子介绍圈',
style: TextStyle(color: Colors.white, fontSize: 14.sp),
);
List<String> urlList = [
'https://p3-passport.byteimg.com/img/user-avatar/eb429d4dbb3c246f580a6f7894f2b246~100x100.awebp',
'https://p3-passport.byteimg.com/img/user-avatar/eb429d4dbb3c246f580a6f7894f2b246~100x100.awebp',
'https://p3-passport.byteimg.com/img/user-avatar/eb429d4dbb3c246f580a6f7894f2b246~100x100.awebp'
];
List<Widget> widgets = [];
int index = 0;
urlList.forEach((element) {
widgets.add(Positioned(
left: 12.sp * index,
child: circleWidget(element, width: 24),
));
index++;
});
widgets.add(Positioned(
left: 12.sp * urlList.length,
child: Image.asset(
getCircleImage('more'),
width: 24.sp,
)));
return Container(
margin: EdgeInsets.only(top: 10.sp),
width: Get.width,
height: 279.sp,
decoration: BoxDecoration(
image: DecorationImage(
fit: BoxFit.fill,
image: AssetImage(
getCircleImage('normal_bg'),
))),
child: Stack(
children: [
Positioned(
right: 2.sp,
top: 2.sp,
child: Image.asset(getCircleImage('location')),
height: 18.sp,
),
Container(
height: 279.sp,
width: Get.width,
padding: EdgeInsets.only( left: 12.sp, right: 12.sp),
child: Column(
children: [
Container(
height: 72.sp,
child: Row(
// mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
GestureDetector(
child: Stack(
alignment: Alignment.center,
children: [
Image.asset(
getCircleImage('avatar_bg'),
width: 42.sp,
),
ClipOval(
child: Image.network(
'https://p3-passport.byteimg.com/img/user-avatar/eb429d4dbb3c246f580a6f7894f2b246~100x100.awebp',
width: 40.sp,
height: 40.sp,
fit: BoxFit.fill,
),
)
],
)),
Expanded(
child: Container(
padding: EdgeInsets.only(left: 8.sp, top: 12.sp),
alignment: Alignment.centerLeft,
height: 72.sp,
child: Column(
children: [
Row(
children: [
Text(
'圈子名称',
style: TextStyle(
color: Colors.white,
fontSize: 18.sp,
fontWeight: FontWeight.w600),
),
SizedBox(
width: 8.sp,
),
Image.asset(
getCircleImage('vip'),
width: 36.sp,
)
],
),
SizedBox(
height: 4.sp,
),
Row(
children: [
Container(
alignment: Alignment.center,
height: 18.sp,
padding:
EdgeInsets.only(left: 6.sp, right: 6.sp),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(9.sp),
gradient: LinearGradient(
begin: Alignment(0.25, 0.5),
end: Alignment(0.75, 0.5),
colors: [
Color(0xff8DFFF8),
Color(0xffB5D3FF)
])),
child: Text(
'男.33.DOM.异性恋',
style: TextStyle(
color: Colors.black,
fontSize: 12.sp,
),
),
)
],
),
],
),
)),
],
),
),
Container(
// margin: EdgeInsets.only(top: 4.sp),
child: descText,
),
Container(
height: 100.sp,
margin: EdgeInsets.only(top: 5.sp),
child: GridView(
physics: const NeverScrollableScrollPhysics(),
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: 3, //横轴三个子widget
crossAxisSpacing: 8.sp,
childAspectRatio: 1.0 //宽高比为1时，子widget
),
children: <Widget>[
ClipRRect(
borderRadius: BorderRadius.circular(6.sp),
child: Image.network(
'https://pic1.zhimg.com/v2-3be05963f5f3753a8cb75b6692154d4a_720w.jpg?source=172ae18b',
fit: BoxFit.fill,
),
),
ClipRRect(
borderRadius: BorderRadius.circular(6.sp),
child: Image.network(
'https://pic1.zhimg.com/v2-3be05963f5f3753a8cb75b6692154d4a_720w.jpg?source=172ae18b',
fit: BoxFit.fill),
),
ClipRRect(
borderRadius: BorderRadius.circular(6.sp),
child: Image.network(
'https://pic1.zhimg.com/v2-3be05963f5f3753a8cb75b6692154d4a_720w.jpg?source=172ae18b',
fit: BoxFit.fill),
),
]),
),
Container(
height: 34.sp,
padding: EdgeInsets.only(left: 5.sp,right: 10.sp),
margin: EdgeInsets.only(top: 5.sp),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(17.sp),
gradient: const LinearGradient(
begin: Alignment(0.25, 0.5),
end: Alignment(0.75, 0.5),
colors: [Color(0xff261240), Color(0xff122D40)])),
child: Row(
children: [
Container(
width: 24 + 12.sp * widgets.length - 12.sp,
height: 24.sp,
child: Stack(children: widgets),
),
SizedBox(width: 4.sp,),
Expanded(
child: Text(
'1位圈友已私聊',
style: TextStyle(color: Colors.white, fontSize: 12.sp),
)),
Image.asset(
getCircleImage('chat'),
width: 60.sp,
)
],
),
)
],
),
)
],
),
);
}
tipWdiget() {
return Container(
width: Get.width,
height: Get.height,
child: Center(
child: Container(
width: 339.sp,
height: 330.sp,
decoration: BoxDecoration(
image: DecorationImage(
fit: BoxFit.fill,
image: AssetImage(getCircleImage('add_tip_bg'))
)
),
child: Stack(
alignment: Alignment.center,
children: [
Positioned(
top: 5.sp,
right: 12.sp,
child: GestureDetector(
onTap: () {
Get.back();
},
child: Image.asset(getCircleImage('close'),width: 24.sp,),
)),
Positioned(
top: 24.sp,
child: Text('解锁圈子才能主动私聊',style: TextStyle(color: Colors.white,fontSize: 16.sp),)),
Positioned(
left: 17.sp,
top: 64.sp,
child: Text('为什么要解锁圈子?',style: TextStyle(color: Colors.white,fontSize: 16.sp),)),
Positioned(
top: 98.sp,
child:Container(
width: 339.sp,
padding: EdgeInsets.only(left: 17.sp,right: 17.sp),
child: Text('为打造纯净的社交环境，更好地服务大家，基于以下几方面考虑:1、平台升级为全天24小时人工审核，保证用户真实，避免骗子、酒托、虚假人士等扰乱平台 ;2、杜绝未入圈用户随意骚扰或影响已入圈的跨友;3、谢绝只会白嫖的猎奇人士。',style: TextStyle(color:Color.fromRGBO(247, 250, 250, 0.8),fontSize: 12.sp)),
)),
Positioned(
bottom: 18.sp,
child: Container(
width: 168.sp,
height: 42.sp,
alignment: Alignment.center,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(21.sp),
gradient: const LinearGradient(
begin: Alignment.centerLeft,
end:Alignment.centerRight,
colors: [Color(0xff0AFCFF),Color(0xffD739EA)]
)
),
child: Text('立即解锁',style: TextStyle(color: Colors.white,fontSize: 16.sp),),
)),
Positioned(
bottom: 72.sp,
child: Container(
child: Row(
children: [
Text('￥18',style: TextStyle(color: Color(0xffE845FF),fontSize: 16.sp,fontWeight: FontWeight.w600),),
SizedBox(width: 2.sp,),
Text('(原价60)',style: TextStyle(color: Colors.white70,fontSize: 16.sp,fontWeight: FontWeight.w400,decoration: TextDecoration.lineThrough,
decorationColor: Colors.white70,),),
],
),
))
],
),
),
),
);
}
}

2
circle_app/lib/app/home/logic.dart
View File

@ -8,7 +8,7 @@ import 'state.dart';
class HomeLogic extends GetxController {
int currentIndex = 0;
int currentIndex = 1;
Widget currentPage = Container(color: Colors.red,);
final HomeState state = HomeState();

16
circle_app/lib/app/home/view.dart
View File

@ -1,4 +1,8 @@
import 'package:circle_app/app/minefragment/view.dart';
import 'package:circle_app/app/circle/view.dart';
import 'package:circle_app/app/msg/view.dart';
import 'package:circle_app/router/app_routers.dart';
import 'package:circle_app/util/util.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
@ -14,9 +18,9 @@ class HomePage extends StatelessWidget {
final state = Get.find<HomeLogic>().state;
final List _tabs = [
Container(),
Container(),
MinefragmentPage(),
MsgPage(),
CirclePage(),
MinefragmentPage(),
];
@override
@ -33,6 +37,12 @@ class HomePage extends StatelessWidget {
width: Get.width,
// color: Colors.red,
padding: EdgeInsets.only(left: 50.sp,right: 50.sp,top: 8.sp),
decoration: BoxDecoration(
image:DecorationImage(
fit: BoxFit.fill,
image: AssetImage(getTabbarImage('tabbar_bg'),)
)
),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
crossAxisAlignment: CrossAxisAlignment.start,

10
circle_app/lib/app/msg/binding.dart Normal file
View File

@ -0,0 +1,10 @@
import 'package:get/get.dart';
import 'logic.dart';
class MsgBinding extends Bindings {
@override
void dependencies() {
Get.lazyPut(() => MsgLogic());
}
}

7
circle_app/lib/app/msg/logic.dart Normal file
View File

@ -0,0 +1,7 @@
import 'package:get/get.dart';
import 'state.dart';
class MsgLogic extends GetxController {
final MsgState state = MsgState();
}

6
circle_app/lib/app/msg/state.dart Normal file
View File

@ -0,0 +1,6 @@
class MsgState {
String msg = '';
MsgState() {
///Initialize variables
}
}

179
circle_app/lib/app/msg/view.dart Normal file
View File

@ -0,0 +1,179 @@
import 'package:circle_app/util/util.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'logic.dart';
class MsgPage extends StatelessWidget {
MsgPage({Key? key}) : super(key: key);
final logic = Get.put(MsgLogic());
@override
Widget build(BuildContext context) {
return Container(
width: MediaQuery.of(context).size.width,
height: MediaQuery.of(context).size.height,
decoration: BoxDecoration(
image: DecorationImage(
fit: BoxFit.fill,
image: AssetImage(getBaseImage('home_back')))),
// child: Image.asset(
// getBaseImage('bg'),
// fit: BoxFit.fill,
// ),
child: Scaffold(
backgroundColor: Colors.transparent,
body: SafeArea(
child:GetBuilder(builder: (MsgLogic controller) {
return Container(
child: Column(
children: [
navigatorItem(),
tipWidget(),
reconmandWidget(),
Text(controller.state.msg)
],
),
);
}),
),
));
}
navigatorItem() {
return Container(
width: Get.width,
padding: EdgeInsets.only(left: 18.sp, right: 18.sp),
height: 44.sp,
child: Stack(
alignment: Alignment.center,
children: [
Positioned(
left: 0,
child: GestureDetector(
child: Image.asset(
getMsgImage('msg_love'),
width: 30.sp,
),
)),
ShaderMask(
shaderCallback: (Rect bounds) {
return const LinearGradient(
begin: Alignment(0.0, -1.0),
end: Alignment.bottomCenter,
colors: [Color(0xff71F3F2), Color(0xffF657FF)],
).createShader(Offset.zero & bounds.size);
},
child: Text(
'消息',
style: TextStyle(
fontSize: 18.sp,
fontWeight: FontWeight.w600,
color: Colors.white,
shadows: [
Shadow(color: Color(0xffF657FF), offset: Offset(0.0, -1))
]),
),
),
Positioned(
right: 0,
child: GestureDetector(
child: Image.asset(
getMsgImage('msg_pipei'),
width: 85.sp,
),
)),
],
),
);
}
tipWidget() {
return Container(
margin: EdgeInsets.only(top: 18.sp,bottom: 15.sp),
padding: EdgeInsets.only(left: 16.sp,right: 18.sp),
width: Get.width,
height: 20,
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text('想要聊天的圈友',style: TextStyle(color: Colors.white,fontSize: 16.sp,fontWeight: FontWeight.w500),),
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
ShaderMask(
shaderCallback: (Rect bounds) {
return const LinearGradient(
begin:Alignment.centerRight,
end: Alignment.centerLeft,
colors: [Color(0xff71F3F2), Color(0xffF657FF)],
).createShader(Offset.zero & bounds.size);
},
child:Text(
'n人等您聊',
style: TextStyle(fontSize: 16.sp,fontWeight: FontWeight.w600,color: Colors.white),
),
),
Image.asset(getMsgImage('msg_arr'),width: 24.sp,)
],
)
],
),
);
}
reconmandWidget() {
return Container(
padding: EdgeInsets.only(left: 16.sp,right: 18.sp),
width: Get.width,
child: Row(
children: [
Container(
child: Column(
children: [
Image.asset(getMsgImage('msg_first'), width: 50.sp,),
SizedBox(height: 4.sp,),
Text('抢占第一',
style: TextStyle(color: Colors.white, fontSize: 12.sp),),
],
),
),
Expanded(child: SingleChildScrollView(
scrollDirection: Axis.horizontal,
child:Container(
// width: 50.sp * 10,
child: Row(
children: [
peopleWidget(),
peopleWidget(),
peopleWidget(),
peopleWidget(),
peopleWidget(),
peopleWidget(),
peopleWidget(),
peopleWidget(),
peopleWidget(),
peopleWidget(),
],
),
),
))
],
),
);
}
peopleWidget() {
return Container(
margin: EdgeInsets.only(left: 18.sp),
child: Column(
children: [
Image.asset(getMsgImage('msg_first'),width: 50.sp,),
SizedBox(height: 4.sp,),
Text('抢占第一',style: TextStyle(color: Colors.white,fontSize: 12.sp),),
],
),
);
}
}

1
circle_app/lib/common/values/values.dart
View File

@ -7,6 +7,7 @@ abstract class Values {
static const String home_images = 'assets/images/home/';
static const String mine_images = 'assets/images/mine/';
static const String msg_images = 'assets/images/msg/';
static const String circle_images = 'assets/images/circle/';
}

6
circle_app/lib/util/util.dart
View File

@ -37,6 +37,12 @@ String getTabbarImage(String image) {
return '${Values.tabbar_images}${image}.png';
}
String getCircleImage(String image) {
return '${Values.circle_images}${image}.png';
}
///弹窗文本提示 msg: 提示内容
showToast(String msg) {
Fluttertoast.showToast(

4
circle_app/linux/flutter/generated_plugin_registrant.cc
View File

@ -7,9 +7,13 @@
#include "generated_plugin_registrant.h"
#include <file_selector_linux/file_selector_plugin.h>
#include <url_launcher_linux/url_launcher_plugin.h>
void fl_register_plugins(FlPluginRegistry* registry) {
g_autoptr(FlPluginRegistrar) file_selector_linux_registrar =
fl_plugin_registry_get_registrar_for_plugin(registry, "FileSelectorPlugin");
file_selector_plugin_register_with_registrar(file_selector_linux_registrar);
g_autoptr(FlPluginRegistrar) url_launcher_linux_registrar =
fl_plugin_registry_get_registrar_for_plugin(registry, "UrlLauncherPlugin");
url_launcher_plugin_register_with_registrar(url_launcher_linux_registrar);
}

1
circle_app/linux/flutter/generated_plugins.cmake
View File

@ -4,6 +4,7 @@
list(APPEND FLUTTER_PLUGIN_LIST
file_selector_linux
url_launcher_linux
)
list(APPEND FLUTTER_FFI_PLUGIN_LIST

6
circle_app/macos/Flutter/GeneratedPluginRegistrant.swift
View File

@ -6,7 +6,13 @@ import FlutterMacOS
import Foundation
import file_selector_macos
import path_provider_foundation
import sqflite
import url_launcher_macos
func RegisterGeneratedPlugins(registry: FlutterPluginRegistry) {
FileSelectorPlugin.register(with: registry.registrar(forPlugin: "FileSelectorPlugin"))
PathProviderPlugin.register(with: registry.registrar(forPlugin: "PathProviderPlugin"))
SqflitePlugin.register(with: registry.registrar(forPlugin: "SqflitePlugin"))
UrlLauncherPlugin.register(with: registry.registrar(forPlugin: "UrlLauncherPlugin"))
}

3
circle_app/pubspec.yaml
View File

@ -45,6 +45,7 @@ dependencies:
url_launcher: ^6.0.0
# 下拉刷新
pull_to_refresh: ^2.0.0
flutter_swiper: ^1.1.6
dev_dependencies:
flutter_test:
@ -77,6 +78,8 @@ flutter:
- assets/images/navigator/
- assets/images/tabbar/
- assets/images/mine/
- assets/images/msg/
- assets/images/circle/
# - images/a_dot_ham.jpeg
# An image asset can refer to one or more resolution-specific "variants", see

3
circle_app/windows/flutter/generated_plugin_registrant.cc
View File

@ -7,8 +7,11 @@
#include "generated_plugin_registrant.h"
#include <file_selector_windows/file_selector_windows.h>
#include <url_launcher_windows/url_launcher_windows.h>
void RegisterPlugins(flutter::PluginRegistry* registry) {
FileSelectorWindowsRegisterWithRegistrar(
registry->GetRegistrarForPlugin("FileSelectorWindows"));
UrlLauncherWindowsRegisterWithRegistrar(
registry->GetRegistrarForPlugin("UrlLauncherWindows"));
}

1
circle_app/windows/flutter/generated_plugins.cmake
View File

@ -4,6 +4,7 @@
list(APPEND FLUTTER_PLUGIN_LIST
file_selector_windows
url_launcher_windows
)
list(APPEND FLUTTER_FFI_PLUGIN_LIST