diff --git a/circle_app/lib/app/circle/view.dart b/circle_app/lib/app/circle/view.dart index f90c41c..df18421 100644 --- a/circle_app/lib/app/circle/view.dart +++ b/circle_app/lib/app/circle/view.dart @@ -1,3 +1,4 @@ +import 'package:circle_app/app/circle/widgets/info_list_view.dart'; import 'package:circle_app/common/Widgets/open_vip_tip/view.dart'; import 'package:circle_app/router/app_routers.dart'; import 'package:circle_app/util/util.dart'; @@ -8,11 +9,22 @@ import 'package:get/get.dart'; import 'logic.dart'; -class CirclePage extends StatelessWidget { +class CirclePage extends StatefulWidget { CirclePage({Key? key}) : super(key: key); + @override + State createState() => _CirclePageState(); +} + +class _CirclePageState extends State + with AutomaticKeepAliveClientMixin { + @override + bool get wantKeepAlive => true; + // 是否需要缓存 final logic = Get.put(CircleLogic()); + final state = Get.find().state; + var getContext; @override @@ -35,33 +47,49 @@ class CirclePage extends StatelessWidget { 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; - if (index == logic.circle.lists.length - 1) { - logic.loadMore(); - } - print(index.toString()); - controller.update(); - }, - index: controller.state.index, - itemCount: logic.circle.lists.length, - viewportFraction: 0.95, - // scale: 0.9, - loop: false, - // pagination: new SwiperPagination(),//如果不填则不显示指示点 - // control: new SwiperControl(),//如果不填则不显示左右按钮 - )) - ]), + return Stack( + children: [ + Container( + child: Column(children: [ + navigatorItem(), + Text(controller.state.msg), + //组件使用 + Expanded( + child: Swiper( + itemBuilder: (BuildContext context, int index) { + var bean = logic.circle.lists[index]; + return InfoListView(index, bean, logic); + }, + onIndexChanged: (index) { + controller.state.index = index; + if (index == logic.circle.lists.length - 1) { + logic.loadMore(); + } + print(index.toString()); + controller.update(); + }, + index: controller.state.index, + itemCount: logic.circle.lists.length, + viewportFraction: 0.95, + // scale: 0.9, + loop: false, + // pagination: new SwiperPagination(),//如果不填则不显示指示点 + // control: new SwiperControl(),//如果不填则不显示左右按钮 + )) + ]), + ), + Positioned( + bottom: 36.sp, + right: 10.sp, + child: GestureDetector( + onTap: () { + Get.toNamed(AppRoutes.Call_out); + }, + child: Image.asset( + getCircleImage('send_msg'), + width: 60.sp, + ))) + ], ); }), ), @@ -153,661 +181,6 @@ class CirclePage extends StatelessWidget { )); } - _getPageByIndex(int myIndex) { - var bean = logic.circle.lists[myIndex]; - TextSpan descSpan; - TextSpan span; - if (bean.intro.length > 60) { - String truncatedText = bean.intro.substring(0, 60); - descSpan = TextSpan( - text: truncatedText, - style: TextStyle(color: Colors.white, fontSize: 10.sp), - ); - span = TextSpan( - text: '查看更多', - style: TextStyle(color: Color(0xFFFF4DF6), fontSize: 10.sp), - ); - } else { - descSpan = TextSpan( - text: bean.intro, - style: TextStyle(color: Colors.white, fontSize: 10.sp), - ); - span = TextSpan( - text: '', - style: TextStyle(color: Color(0xFFFF4DF6), fontSize: 10.sp), - ); - } - - List urlList = bean.lastJoinUsers; - List widgets = []; - int index = 0; - urlList.forEach((element) { - widgets.add(Positioned( - left: 15.sp * index, - child: circleWidget(element.avatar), - )); - 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: 88.sp, - decoration: BoxDecoration( - image: DecorationImage( - fit: BoxFit.fill, - image: AssetImage( - getCircleImage('circle_desc')))), - child: Container( - margin: EdgeInsets.only(top: 14.sp), - child: Column( - children: [ - Container( - width: Get.width, - height: 30.sp, - child: GestureDetector( - onTap: () { - _showTextContentDialog( - context, bean.intro); - }, - child: RichText( - overflow: TextOverflow.fade, - maxLines: 2, - text: TextSpan(children: [ - descSpan, - span - ])), - ), - ), - Container( - child: Row( - children: [ - Row( - children: [ - Container( - height: 30.sp, - width: 30.0.sp + - 15.sp * - (widgets.length - 1.sp), - child: Stack( - children: widgets, - ), - ), - SizedBox( - width: 8.sp, - ), - Text( - '${convertToTenThousand(bean.viewTotal)}圈友', - 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(bean); - } else { - return normalDynamicItem(bean); - } - }), - ), - 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: [ - Container( - width: 42.sp, - height: 42.sp, - decoration: BoxDecoration( - borderRadius: BorderRadius.circular(8.0), - gradient: LinearGradient( - begin: Alignment.topCenter, - end: Alignment.bottomCenter, - colors: [ - Color(0xFF71F3F2), - Color(0xFFF558FF), - ], - stops: [0.0365, 0.9427], - ), - ), - padding: EdgeInsets.all(1.sp), - child: ClipRRect( - borderRadius: BorderRadius.circular(8.0), - child: Image.network( - bean.image, - width: 40.sp, - height: 40.sp, - ), - ), - ), - Expanded( - child: Container( - padding: EdgeInsets.only(left: 8.sp, top: 12.sp), - // alignment: Alignment., - height: 72.sp, - child: Column( - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - Text( - bean.title, - style: TextStyle( - color: Colors.white, - fontSize: 18.sp, - fontWeight: FontWeight.w600), - ), - SizedBox( - height: 4.sp, - ), - Text( - '${convertToTenThousand(bean.joinTotal)}人看过', - textAlign: TextAlign.left, - style: TextStyle( - color: Color(0xff03FEFB), - fontSize: 12.sp, - ), - ), - ], - ), - )), - GestureDetector( - onTap: () { - if (bean.isJoin) { - _showOutCircleDialog(getContext, logic, bean); - } else { - logic.outCircle( - bean.id.toString(), bean.isJoin); - } - }, - child: Image.asset( - getCircleImage('add'), - width: 77.sp, - ), - ) - ], - ), - )), - Positioned( - top: 70.sp, - child: Image.asset( - getCircleImage('circle_line'), - width: Get.width, - )), - - ], - ))); - } - - ///至尊喊话 - vipDynamicItem(Circle bean) { - Text descText = Text( - bean.intro, - style: TextStyle(color: Colors.white, fontSize: 14.sp), - maxLines: 2, - ); - - List urlList = bean.lastJoinUsers; - List widgets = []; - int index = 0; - urlList.forEach((element) { - widgets.add(Positioned( - left: 12.sp * index, - child: circleWidget(element.avatar, 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: [ - 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(Circle bean) { - Text descText = Text( - bean.intro, - style: TextStyle(color: Colors.white, fontSize: 14.sp), - maxLines: 2, - ); - - List 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 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: [ - 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, @@ -911,201 +284,4 @@ class CirclePage extends StatelessWidget { ); } - void _showTextContentDialog(BuildContext context, String msg) { - showDialog( - context: context, - builder: (BuildContext context) { - return Dialog( - backgroundColor: Colors.transparent, - child: Container( - height: 300.sp, - padding: EdgeInsets.all(1.0), - child: Stack( - children: [ - Container( - decoration: BoxDecoration( - shape: BoxShape.rectangle, - borderRadius: BorderRadius.circular(10.0), - gradient: LinearGradient( - colors: [Color(0xFFDD3DF4), Color(0xFF30FFD9)], - begin: Alignment.topCenter, - end: Alignment.bottomCenter, - ), - ), - ), - Container( - margin: EdgeInsets.all(1.sp), - decoration: BoxDecoration( - shape: BoxShape.rectangle, - borderRadius: BorderRadius.circular(10.0), - gradient: LinearGradient( - colors: [Color(0xFF4C3E5F), Color(0xFF324140)], - begin: Alignment.topCenter, - end: Alignment.bottomCenter, - ), - ), - ), - Container( - margin: EdgeInsets.only(top: 24.sp), - child: Column( - children: [ - Container( - margin: EdgeInsets.only( - top: 12.sp, left: 14.sp, right: 14.sp), - alignment: Alignment.center, - child: Text( - msg, - textAlign: TextAlign.center, - style: TextStyle( - color: Color(0xCCF7FAFA), fontSize: 16.sp), - ), - ), - ], - ), - ) - ], - ), - ), - ); - }, - ); - } - - void _showOutCircleDialog( - BuildContext context, CircleLogic controller, Circle bean) { - showDialog( - context: context, - builder: (BuildContext context) { - return Dialog( - backgroundColor: Colors.transparent, - child: Container( - height: 160.sp, - padding: EdgeInsets.all(1.0), - child: Stack( - children: [ - Container( - decoration: BoxDecoration( - shape: BoxShape.rectangle, - borderRadius: BorderRadius.circular(10.0), - gradient: LinearGradient( - colors: [Color(0xFFDD3DF4), Color(0xFF30FFD9)], - begin: Alignment.topCenter, - end: Alignment.bottomCenter, - ), - ), - ), - Container( - margin: EdgeInsets.all(1.sp), - decoration: BoxDecoration( - shape: BoxShape.rectangle, - borderRadius: BorderRadius.circular(10.0), - gradient: LinearGradient( - colors: [Color(0xFF4C3E5F), Color(0xFF324140)], - begin: Alignment.topCenter, - end: Alignment.bottomCenter, - ), - ), - ), - Container( - margin: EdgeInsets.only(top: 24.sp), - child: Column( - children: [ - Center( - child: Text( - "提示", - style: - TextStyle(color: Colors.white, fontSize: 16.sp), - ), - ), - Container( - margin: EdgeInsets.only( - top: 12.sp, left: 14.sp, right: 14.sp), - alignment: Alignment.center, - child: Text( - "是否确认退出该圈子。", - textAlign: TextAlign.center, - style: TextStyle( - color: Color(0xCCF7FAFA), fontSize: 16.sp), - ), - ), - Row( - mainAxisAlignment: MainAxisAlignment.center, - // mainAxisAlignment: MainAxisAlignment.spaceBetween, - children: [ - GestureDetector( - onTap: () { - Navigator.pop(context); - }, - child: Container( - margin: EdgeInsets.only(top: 30.sp), - decoration: BoxDecoration( - borderRadius: BorderRadius.circular(17), - gradient: LinearGradient( - colors: [ - Color(0x26FFFFFF), - Color(0x26FFFFFF), - ], - begin: Alignment.centerLeft, - end: Alignment.centerRight, - ), - ), - padding: EdgeInsets.only( - top: 10.sp, - bottom: 10.sp, - left: 52.sp, - right: 52.sp), - child: Text( - "否", - style: TextStyle( - color: Colors.white, - fontSize: 12, - ), - ), - ), - ), - SizedBox(width: 24.sp), - GestureDetector( - onTap: () { - Navigator.pop(context); - logic.outCircle(bean.id.toString(), bean.isJoin); - }, - child: Container( - margin: EdgeInsets.only(top: 24.sp), - decoration: BoxDecoration( - borderRadius: BorderRadius.circular(17), - gradient: LinearGradient( - colors: [ - Color(0xFF06F9FA), - Color(0xFFDC5BFD), - ], - begin: Alignment.centerLeft, - end: Alignment.centerRight, - ), - ), - padding: EdgeInsets.only( - top: 10.sp, - bottom: 10.sp, - left: 52.sp, - right: 52.sp), - child: Text( - "是", - style: TextStyle( - color: Colors.white, - fontSize: 12, - ), - ), - ), - ) - ], - ) - ], - ), - ) - ], - ), - ), - ); - }, - ); - } } diff --git a/circle_app/lib/app/circle/widgets/info_list_view.dart b/circle_app/lib/app/circle/widgets/info_list_view.dart new file mode 100644 index 0000000..619bc15 --- /dev/null +++ b/circle_app/lib/app/circle/widgets/info_list_view.dart @@ -0,0 +1,892 @@ +import 'package:circle_app/app/circle/logic.dart'; +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 'package:get/get_core/src/get_main.dart'; + +class InfoListView extends StatelessWidget { + CircleLogic logic; + Circle bean; + int index; + final ScrollController scrollController = ScrollController(); + + InfoListView(this.index,this.bean,this.logic, {super.key}); + @override + Widget build(BuildContext context) { + TextSpan descSpan; + TextSpan span; + if (bean.intro.length > 60) { + String truncatedText = bean.intro.substring(0, 60); + descSpan = TextSpan( + text: truncatedText, + style: TextStyle(color: Colors.white, fontSize: 10.sp), + ); + span = TextSpan( + text: '查看更多', + style: TextStyle(color: Color(0xFFFF4DF6), fontSize: 10.sp), + ); + } else { + descSpan = TextSpan( + text: bean.intro, + style: TextStyle(color: Colors.white, fontSize: 10.sp), + ); + span = TextSpan( + text: '', + style: TextStyle(color: Color(0xFFFF4DF6), fontSize: 10.sp), + ); + } + + + List urlList = bean.lastJoinUsers; + List widgets = []; + int i = 0; + urlList.forEach((element) { + widgets.add(Positioned( + left: 15.sp * i, + child: circleWidget(element.avatar), + )); + i++; + }); + + 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( + controller: scrollController, + itemCount: 10, + itemBuilder: (context, index) { + if (index == 0) { + return Container( + padding: EdgeInsets.only(left: 12.sp, right: 12.sp), + height: 88.sp, + decoration: BoxDecoration( + image: DecorationImage( + fit: BoxFit.fill, + image: AssetImage( + getCircleImage('circle_desc')))), + child: Container( + margin: EdgeInsets.only(top: 14.sp), + child: Column( + children: [ + Container( + width: Get.width, + height: 30.sp, + child: GestureDetector( + onTap: () { + _showTextContentDialog( + context, bean.intro); + }, + child: RichText( + overflow: TextOverflow.fade, + maxLines: 2, + text: TextSpan(children: [ + descSpan, + span + ])), + ), + ), + Container( + child: Row( + children: [ + Row( + children: [ + Container( + height: 30.sp, + width: 30.0.sp + + 15.sp * + (widgets.length - 1.sp), + child: Stack( + children: widgets, + ), + ), + SizedBox( + width: 8.sp, + ), + Text( + '${convertToTenThousand(bean.viewTotal)}圈友', + 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(bean); + } else { + return normalDynamicItem(bean); + } + }), + ), + 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: [ + Container( + width: 42.sp, + height: 42.sp, + decoration: BoxDecoration( + borderRadius: BorderRadius.circular(8.0), + gradient: LinearGradient( + begin: Alignment.topCenter, + end: Alignment.bottomCenter, + colors: [ + Color(0xFF71F3F2), + Color(0xFFF558FF), + ], + stops: [0.0365, 0.9427], + ), + ), + padding: EdgeInsets.all(1.sp), + child: ClipRRect( + borderRadius: BorderRadius.circular(8.0), + child: Image.network( + bean.image, + width: 40.sp, + height: 40.sp, + ), + ), + ), + Expanded( + child: Container( + padding: EdgeInsets.only(left: 8.sp, top: 12.sp), + // alignment: Alignment., + height: 72.sp, + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Text( + bean.title, + style: TextStyle( + color: Colors.white, + fontSize: 18.sp, + fontWeight: FontWeight.w600), + ), + SizedBox( + height: 4.sp, + ), + Text( + '${convertToTenThousand(bean.joinTotal)}人看过', + textAlign: TextAlign.left, + style: TextStyle( + color: Color(0xff03FEFB), + fontSize: 12.sp, + ), + ), + ], + ), + )), + GestureDetector( + onTap: () { + if (bean.isJoin) { + _showOutCircleDialog(context, logic, bean); + } else { + logic.outCircle( + bean.id.toString(), bean.isJoin); + } + }, + child: Image.asset( + getCircleImage('add'), + width: 77.sp, + ), + ) + ], + ), + )), + Positioned( + top: 70.sp, + child: Image.asset( + getCircleImage('circle_line'), + width: Get.width, + )), + ], + ))); + } + void _showTextContentDialog(BuildContext context, String msg) { + showDialog( + context: context, + builder: (BuildContext context) { + return Dialog( + backgroundColor: Colors.transparent, + child: Container( + height: 300.sp, + padding: EdgeInsets.all(1.0), + child: Stack( + children: [ + Container( + decoration: BoxDecoration( + shape: BoxShape.rectangle, + borderRadius: BorderRadius.circular(10.0), + gradient: LinearGradient( + colors: [Color(0xFFDD3DF4), Color(0xFF30FFD9)], + begin: Alignment.topCenter, + end: Alignment.bottomCenter, + ), + ), + ), + Container( + margin: EdgeInsets.all(1.sp), + decoration: BoxDecoration( + shape: BoxShape.rectangle, + borderRadius: BorderRadius.circular(10.0), + gradient: LinearGradient( + colors: [Color(0xFF4C3E5F), Color(0xFF324140)], + begin: Alignment.topCenter, + end: Alignment.bottomCenter, + ), + ), + ), + Container( + margin: EdgeInsets.only(top: 24.sp), + child: Column( + children: [ + Container( + margin: EdgeInsets.only( + top: 12.sp, left: 14.sp, right: 14.sp), + alignment: Alignment.center, + child: Text( + msg, + textAlign: TextAlign.center, + style: TextStyle( + color: Color(0xCCF7FAFA), fontSize: 16.sp), + ), + ), + ], + ), + ) + ], + ), + ), + ); + }, + ); + } + + + ///至尊喊话 + vipDynamicItem(Circle bean) { + Text descText = Text( + bean.intro, + style: TextStyle(color: Colors.white, fontSize: 14.sp), + maxLines: 2, + ); + + List urlList = bean.lastJoinUsers; + List widgets = []; + int index = 0; + urlList.forEach((element) { + widgets.add(Positioned( + left: 12.sp * index, + child: circleWidget(element.avatar, 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: [ + 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(Circle bean) { + Text descText = Text( + bean.intro, + style: TextStyle(color: Colors.white, fontSize: 14.sp), + maxLines: 2, + ); + + List 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 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: [ + 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, + ) + ], + ), + ) + ], + ), + ) + ], + ), + ); + } + + + 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, + ), + ) + ], + )); + } + + + void _showOutCircleDialog( + BuildContext context, CircleLogic controller, Circle bean) { + showDialog( + context: context, + builder: (BuildContext context) { + return Dialog( + backgroundColor: Colors.transparent, + child: Container( + height: 160.sp, + padding: EdgeInsets.all(1.0), + child: Stack( + children: [ + Container( + decoration: BoxDecoration( + shape: BoxShape.rectangle, + borderRadius: BorderRadius.circular(10.0), + gradient: LinearGradient( + colors: [Color(0xFFDD3DF4), Color(0xFF30FFD9)], + begin: Alignment.topCenter, + end: Alignment.bottomCenter, + ), + ), + ), + Container( + margin: EdgeInsets.all(1.sp), + decoration: BoxDecoration( + shape: BoxShape.rectangle, + borderRadius: BorderRadius.circular(10.0), + gradient: LinearGradient( + colors: [Color(0xFF4C3E5F), Color(0xFF324140)], + begin: Alignment.topCenter, + end: Alignment.bottomCenter, + ), + ), + ), + Container( + margin: EdgeInsets.only(top: 24.sp), + child: Column( + children: [ + Center( + child: Text( + "提示", + style: + TextStyle(color: Colors.white, fontSize: 16.sp), + ), + ), + Container( + margin: EdgeInsets.only( + top: 12.sp, left: 14.sp, right: 14.sp), + alignment: Alignment.center, + child: Text( + "是否确认退出该圈子。", + textAlign: TextAlign.center, + style: TextStyle( + color: Color(0xCCF7FAFA), fontSize: 16.sp), + ), + ), + Row( + mainAxisAlignment: MainAxisAlignment.center, + // mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + GestureDetector( + onTap: () { + Navigator.pop(context); + }, + child: Container( + margin: EdgeInsets.only(top: 30.sp), + decoration: BoxDecoration( + borderRadius: BorderRadius.circular(17), + gradient: LinearGradient( + colors: [ + Color(0x26FFFFFF), + Color(0x26FFFFFF), + ], + begin: Alignment.centerLeft, + end: Alignment.centerRight, + ), + ), + padding: EdgeInsets.only( + top: 10.sp, + bottom: 10.sp, + left: 52.sp, + right: 52.sp), + child: Text( + "否", + style: TextStyle( + color: Colors.white, + fontSize: 12, + ), + ), + ), + ), + SizedBox(width: 24.sp), + GestureDetector( + onTap: () { + Navigator.pop(context); + logic.outCircle(bean.id.toString(), bean.isJoin); + }, + child: Container( + margin: EdgeInsets.only(top: 24.sp), + decoration: BoxDecoration( + borderRadius: BorderRadius.circular(17), + gradient: LinearGradient( + colors: [ + Color(0xFF06F9FA), + Color(0xFFDC5BFD), + ], + begin: Alignment.centerLeft, + end: Alignment.centerRight, + ), + ), + padding: EdgeInsets.only( + top: 10.sp, + bottom: 10.sp, + left: 52.sp, + right: 52.sp), + child: Text( + "是", + style: TextStyle( + color: Colors.white, + fontSize: 12, + ), + ), + ), + ) + ], + ) + ], + ), + ) + ], + ), + ), + ); + }, + ); + } +} \ No newline at end of file diff --git a/circle_app/lib/app/home/logic.dart b/circle_app/lib/app/home/logic.dart index 7285522..7004333 100644 --- a/circle_app/lib/app/home/logic.dart +++ b/circle_app/lib/app/home/logic.dart @@ -10,20 +10,20 @@ import 'state.dart'; class HomeLogic extends GetxController { - + PageController pageController = PageController(initialPage: 1); int currentIndex = 1; Widget currentPage = Container(); final HomeState state = HomeState(); - final List tabs = []; + final List tabs = []; var circlePage = CirclePage(); @override void onInit() { super.onInit(); tabs.add(MsgPage()); - tabs.add(circlePage); + tabs.add(CirclePage()); tabs.add(MinefragmentPage()); } diff --git a/circle_app/lib/app/home/view.dart b/circle_app/lib/app/home/view.dart index 62ff055..d72ad2a 100644 --- a/circle_app/lib/app/home/view.dart +++ b/circle_app/lib/app/home/view.dart @@ -1,3 +1,5 @@ +import 'dart:io'; + import 'package:circle_app/app/minefragment/view.dart'; import 'package:circle_app/app/circle/view.dart'; import 'package:circle_app/app/msg/view.dart'; @@ -10,14 +12,20 @@ import 'package:get/get.dart'; import '../../router/app_routers.dart'; import 'logic.dart'; -class HomePage extends StatelessWidget { +class HomePage extends StatefulWidget { HomePage({Key? key}) : super(key: key); + @override + State createState() => _HomePageState(); +} + +class _HomePageState extends State with AutomaticKeepAliveClientMixin { + @override + bool get wantKeepAlive => true; final logic = Get.lazyPut(() => HomeLogic()); + final state = Get.find().state; - - @override Widget build(BuildContext context) { return GetBuilder(builder: (HomeLogic controller) { @@ -50,19 +58,16 @@ class HomePage extends StatelessWidget { ], ), ), - body: controller.tabs[controller.currentIndex], + body: PageView( + physics: const NeverScrollableScrollPhysics(), + controller: controller.pageController, + onPageChanged: (int index) { + controller.updateIndex(index); + }, + children: controller.tabs, + ), ), - Positioned( - bottom: Get.bottomBarHeight + 36.sp, - right: 10.sp, - child: GestureDetector( - onTap: () { - Get.toNamed(AppRoutes.Call_out); - }, - child: Image.asset( - getCircleImage('send_msg'), - width: 60.sp, - ))) + ],), ); }); @@ -72,6 +77,7 @@ class HomePage extends StatelessWidget { return GestureDetector( onTap: () { if (!isSelected) { + controller.pageController.jumpToPage(index); controller.updateIndex(index); } },