增加VIP弹窗轮播，修改图片展示

circle_app/lib/app/circle/logic.dart

@@ -52,6 +52,8 @@ class CircleLogic extends GetxController {
   Circle getCircleIndex() {
     return circle.lists[state.index];
   }
+
+
 }
 
 class InterestsBean {

circle_app/lib/app/circle/state.dart

@@ -124,6 +124,7 @@ class User {
   String? avatar;
   String? city;
   int? gender;
+  int? age;
   int? id;
   double? lat;
   double? lng;
@@ -139,6 +140,7 @@ class User {
         this.id,
         this.lat,
         this.lng,
+        this.age,
         this.nickname,
         this.orientation,
         this.role,
@@ -149,6 +151,7 @@ class User {
     city = json['city'];
     gender = json['gender'];
     id = json['id'];
+    age = json['age'] ?? 0;
     lat = json['lat'] ?? 0.0;
     lng = json['lng'] ?? 0.0;
     nickname = json['nickname'];

circle_app/lib/app/circle/view.dart

@@ -54,7 +54,7 @@ class _CirclePageState extends State<CirclePage>
                     Container(
                       child: Column(children: [
                         navigatorItem(),
-                        Text(controller.state.msg),
+                        // Text(controller.state.msg),
                         //组件使用
                         Expanded(
                             child: Swiper(
@@ -130,9 +130,11 @@ class _CirclePageState extends State<CirclePage>
           Positioned(
               left: 0,
               child: Container(
+
                 width: 30.sp * widgets.length,
                 height: 44.sp,
                 child: Stack(
+                  alignment: Alignment.centerLeft,
                   children: widgets,
                 ),
               )),
@@ -189,108 +191,7 @@ class _CirclePageState extends State<CirclePage>
     ));
   }
 
-  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,
-                          ),
-                        ),
-                      ],
-                    ),
-                  ))
-            ],
-          ),
-        ),
-      ),
-    );
-  }
 
   void _showTextContentDialog(BuildContext context, String msg) {
     showDialog(

circle_app/lib/app/circle/widgets/info_list_view.dart

@@ -33,12 +33,13 @@ class InfoListView extends StatelessWidget {
     '性单恋'
   ];
   List<String> roleList = ['Sado', 'Maso', 'Dom', 'Sub', 'Switch'];
+  ListLogic? listsLg;
 
   @override
   Widget build(BuildContext context) {
     Get.lazyPut(() => ListLogic());
-    final listsLg = Get.find<ListLogic>();
+    listsLg = Get.find<ListLogic>();
-    listsLg.loadCallOutListData(bean.id.toString());
+    listsLg!.loadCallOutListData(bean.id.toString());
 
     TextSpan descSpan;
     TextSpan span;
@@ -267,18 +268,25 @@ class InfoListView extends StatelessWidget {
                                 ),
                               )),
                               GestureDetector(
-                                onTap: () {
+                                onTap: () async {
                                   if (bean.isJoin) {
                                     _showOutCircleDialog(context, logic, bean);
                                   } else {
-                                    logic.outCircle(
+                                    await logic.outCircle(
                                         bean.id.toString(), bean.isJoin);
+                                    logic.update();
                                   }
                                 },
-                                child: Image.asset(
+                                child:Stack(
+                                  alignment: Alignment.center,
+                                  children: [
+                                    Image.asset(
                                       getCircleImage('add'),
                                       width: 77.sp,
                                     ),
+                                    Text(!bean.isJoin ? '申请加入':'已加入',style: TextStyle(color: Colors.white,fontSize: 12.sp),)
+                                  ],
+                                )
                               )
                             ],
                           ),
@@ -356,9 +364,9 @@ class InfoListView extends StatelessWidget {
   }
 
   ///至尊喊话
-  vipDynamicItem(Lists bean) {
+  vipDynamicItem(Lists lists) {
     Text descText = Text(
-      bean.content!,
+      lists.content!,
       style: TextStyle(color: Colors.white, fontSize: 14.sp),
       maxLines: 2,
     );
@@ -366,7 +374,7 @@ class InfoListView extends StatelessWidget {
     // List<JoinUser> urlList = bean.lastJoinUsers;
     List<Widget> widgets = [];
     int index = 0;
-    bean.chat!.users!.forEach((element) {
+    lists.chat!.users!.forEach((element) {
       widgets.add(Positioned(
         left: 12.sp * index,
         child: circleWidget(element.avatar!, width: 24),
@@ -375,14 +383,34 @@ class InfoListView extends StatelessWidget {
     });
     if (widgets.isNotEmpty) {
       widgets.add(Positioned(
-          left: 12.sp * bean.chat!.users!.length,
+          left: 12.sp * lists.chat!.users!.length,
           child: Image.asset(
             getCircleImage('more'),
             width: 24.sp,
           )));
     }
 
-    double widgetHeight = 250.sp + contentHeight(bean.content!);
+    double picHeight = 0.0;
+
+    int type = 0;
+    if (lists.album != null) {
+      if (lists.album!.isNotEmpty) {
+        Album info = lists.album!.first!;
+        type = info.type!;
+
+        if (info.type == 1) {
+          if (lists.album!.length > 3) {
+            picHeight = 218.sp;
+          } else {
+            picHeight = 109.sp;
+          }
+        } else {
+          picHeight = 109.sp;
+        }
+      }
+    }
+
+    double widgetHeight = 140.sp + contentHeight(lists.content!) + picHeight;
 
     return Container(
       margin: EdgeInsets.only(top: 10.sp),
@@ -409,7 +437,7 @@ class InfoListView extends StatelessWidget {
             height: 18.sp,
           ),
           Container(
-            height: 279.sp,
+            height: widgetHeight,
             width: Get.width,
             padding: EdgeInsets.only(top: 12.sp, left: 12.sp, right: 12.sp),
             child: Column(
@@ -427,14 +455,19 @@ class InfoListView extends StatelessWidget {
                             getCircleImage('avatar_bg'),
                             width: 42.sp,
                           ),
-                          ClipOval(
+                          GestureDetector(
+                              onTap: () {
+                                listsLg?.pushMsgPage(lists,lists.id.toString());
+                              },
+                              child: ClipOval(
                                 child: Image.network(
-                              bean.user!.avatar!,
+                                  lists.user!.avatar!,
                                   width: 40.sp,
                                   height: 40.sp,
                                   fit: BoxFit.fill,
                                 ),
-                          )
+                                ),
+                              ))
                         ],
                       )),
                       Expanded(
@@ -447,7 +480,7 @@ class InfoListView extends StatelessWidget {
                             Row(
                               children: [
                                 Text(
-                                  bean.user!.nickname!,
+                                  lists.user!.nickname!,
                                   style: TextStyle(
                                       color: Colors.white,
                                       fontSize: 18.sp,
@@ -456,7 +489,7 @@ class InfoListView extends StatelessWidget {
                                 SizedBox(
                                   width: 8.sp,
                                 ),
-                                bean.user!.vip! == 0
+                                lists.user!.vip! == 0
                                     ? Container()
                                     : Image.asset(
                                         getCircleImage('vip'),
@@ -484,7 +517,7 @@ class InfoListView extends StatelessWidget {
                                             Color(0xffB5D3FF)
                                           ])),
                                   child: Text(
-                                    '${genderList[bean.user!.gender!]}.${'33'}.${roleList[bean.user!.role!]}.${orientationList[bean.user!.orientation!]}',
+                                    '${genderList[lists.user!.gender!]}.${lists.user!.age}.${roleList[lists.user!.role!]}.${orientationList[lists.user!.orientation!]}',
                                     style: TextStyle(
                                       color: Colors.black,
                                       fontSize: 12.sp,
@@ -507,34 +540,48 @@ class InfoListView extends StatelessWidget {
                 Container(
                   height: 100.sp,
                   margin: EdgeInsets.only(top: 5.sp),
-                  child: GridView(
+                  child: GridView.builder(
+                      itemCount: lists.album!.length,
                       physics: const NeverScrollableScrollPhysics(),
                       gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                           crossAxisCount: 3, //横轴三个子widget
                           crossAxisSpacing: 8.sp,
+                          mainAxisSpacing: 8.sp,
                           childAspectRatio: 1.0 //宽高比为1时，子widget
                           ),
-                      children: <Widget>[
+                      itemBuilder: (contentxt, currentIndex) {
-                        ClipRRect(
+                        Album album = lists.album![currentIndex];
+                        if (album.type == 2) {
+                          return ClipRRect(
                               borderRadius: BorderRadius.circular(6.sp),
-                          child: Image.network(
+                              child: VideoItemWidget(album.url!));
-                            'https://pic1.zhimg.com/v2-3be05963f5f3753a8cb75b6692154d4a_720w.jpg?source=172ae18b',
+                        }
-                            fit: BoxFit.fill,
+                        return GestureDetector(
-                          ),
+                          onTap: () {
-                        ),
+                            var imgList = <String>[];
-                        ClipRRect(
+                            for (var element in lists.album!) {
+                              imgList.add(element.url!);
+                            }
+                            Get.toNamed(AppRoutes.Swiper, arguments: {
+                              'imaglist': imgList,
+                              'index': currentIndex
+                            });
+                          },
+                          child: ClipRRect(
                             borderRadius: BorderRadius.circular(6.sp),
-                          child: Image.network(
+                            child: CachedNetworkImage(
-                              'https://pic1.zhimg.com/v2-3be05963f5f3753a8cb75b6692154d4a_720w.jpg?source=172ae18b',
+                              imageUrl: album.url!,
-                              fit: BoxFit.fill),
+                              placeholder: (context, url) =>
+                                  CircularProgressIndicator(
+                                color: Color(0xFF07FAFB),
                               ),
-                        ClipRRect(
+                              errorWidget: (context, url, error) =>
-                          borderRadius: BorderRadius.circular(6.sp),
+                                  Icon(Icons.error),
-                          child: Image.network(
+                              fit: BoxFit.cover,
-                              'https://pic1.zhimg.com/v2-3be05963f5f3753a8cb75b6692154d4a_720w.jpg?source=172ae18b',
-                              fit: BoxFit.fill),
                             ),
-                      ]),
+                          ),
+                        );
+                      }),
                 ),
                 Container(
                   height: 34.sp,
@@ -561,7 +608,7 @@ class InfoListView extends StatelessWidget {
                       widgets.isNotEmpty
                           ? Expanded(
                               child: Text(
-                              '${bean.chat!.count!}位圈友已私聊',
+                              '${lists.chat!.count!}位圈友已私聊',
                               style: TextStyle(
                                   color: Colors.white, fontSize: 12.sp),
                             ))
@@ -571,9 +618,14 @@ class InfoListView extends StatelessWidget {
                               style: TextStyle(
                                   color: Colors.white, fontSize: 12.sp),
                             )),
-                      Image.asset(
+                      GestureDetector(
+                        onTap: () {
+                          listsLg?.pushMsgPage(lists,bean.id.toString());
+                        },
+                        child: Image.asset(
                           getCircleImage('chat'),
                           width: 60.sp,
+                        ),
                       )
                     ],
                   ),
@@ -587,9 +639,9 @@ class InfoListView extends StatelessWidget {
   }
 
   ///普通图文喊话
-  normalDynamicItem(Lists bean) {
+  normalDynamicItem(Lists lists) {
     Text descText = Text(
-      bean.content!,
+      lists.content!,
       style: TextStyle(color: Colors.white, fontSize: 14.sp),
       // maxLines: 2,
     );
@@ -597,14 +649,16 @@ class InfoListView extends StatelessWidget {
     double picHeight = 0.0;
 
     int type = 0;
-    if (bean.album != null) {
+    if (lists.album != null) {
-      if (bean.album!.isNotEmpty) {
+      if (lists.album!.isNotEmpty) {
-        Album info = bean.album!.first!;
+        Album info = lists.album!.first!;
         type = info.type!;
 
         if (info.type == 1) {
-          if (bean.album!.length > 3) {
+          if (lists.album!.length > 3) {
             picHeight = 218.sp;
+          } else {
+            picHeight = 109.sp;
           }
         } else {
           picHeight = 109.sp;
@@ -614,7 +668,7 @@ class InfoListView extends StatelessWidget {
 
     List<Widget> widgets = [];
     int index = 0;
-    bean!.chat!.users!.forEach((element) {
+    lists!.chat!.users!.forEach((element) {
       widgets.add(Positioned(
         left: 12.sp * index,
         child: GestureDetector(
@@ -626,7 +680,7 @@ class InfoListView extends StatelessWidget {
     });
     if (widgets.isNotEmpty) {
       widgets.add(Positioned(
-          left: 12.sp * bean.chat!.users!.length,
+          left: 12.sp * lists.chat!.users!.length,
           child: Image.asset(
             getCircleImage('more'),
             width: 24.sp,
@@ -635,7 +689,7 @@ class InfoListView extends StatelessWidget {
     return Container(
       margin: EdgeInsets.only(top: 10.sp),
       width: Get.width,
-      height: 130.sp + contentHeight(bean.content!) + picHeight,
+      height: 130.sp + contentHeight(lists.content!) + picHeight,
       decoration: BoxDecoration(
           image: DecorationImage(
               fit: BoxFit.fill,
@@ -655,7 +709,7 @@ class InfoListView extends StatelessWidget {
                   height: 20.sp,
                 ),
                 Text(
-                  bean.user!.city ?? '外星',
+                  lists.user!.city ?? '外星',
                   style: TextStyle(color: Colors.white, fontSize: 12.sp),
                 )
               ],
@@ -663,7 +717,7 @@ class InfoListView extends StatelessWidget {
             // height: 18.sp,
           ),
           Container(
-            height: 130.sp + contentHeight(bean.content!) + picHeight,
+            height: 130.sp + contentHeight(lists.content!) + picHeight,
             width: Get.width,
             padding: EdgeInsets.only(left: 12.sp, right: 12.sp),
             child: Column(
@@ -681,14 +735,18 @@ class InfoListView extends StatelessWidget {
                             getCircleImage('avatar_bg'),
                             width: 42.sp,
                           ),
-                          ClipOval(
+              GestureDetector(
+                onTap: () {
+                  listsLg?.pushMsgPage(lists,bean.id.toString());
+                },
+                child:ClipOval(
                             child: Image.network(
-                              bean.user!.avatar!,
+                              lists.user!.avatar!,
                               width: 40.sp,
                               height: 40.sp,
                               fit: BoxFit.fill,
                             ),
-                          )
+                          ))
                         ],
                       )),
                       Expanded(
@@ -701,7 +759,7 @@ class InfoListView extends StatelessWidget {
                             Row(
                               children: [
                                 Text(
-                                  bean.user!.nickname! ?? '',
+                                  lists.user!.nickname! ?? '',
                                   style: TextStyle(
                                       color: Colors.white,
                                       fontSize: 18.sp,
@@ -710,7 +768,7 @@ class InfoListView extends StatelessWidget {
                                 SizedBox(
                                   width: 8.sp,
                                 ),
-                                bean.user!.vip! == 0
+                                lists.user!.vip! == 0
                                     ? Container()
                                     : Image.asset(
                                         getCircleImage('vip'),
@@ -738,7 +796,7 @@ class InfoListView extends StatelessWidget {
                                             Color(0xffB5D3FF)
                                           ])),
                                   child: Text(
-                                    '${genderList[bean.user!.gender!]}.${'33'}.${roleList[bean.user!.role!]}.${orientationList[bean.user!.orientation!]}',
+                                    '${genderList[lists.user!.gender!]}.${lists.user!.age}.${roleList[lists.user!.role!]}.${orientationList[lists.user!.orientation!]}',
                                     style: TextStyle(
                                       color: Colors.black,
                                       fontSize: 12.sp,
@@ -763,7 +821,7 @@ class InfoListView extends StatelessWidget {
                         height: picHeight,
                         margin: EdgeInsets.only(top: 5.sp),
                         child: GridView.builder(
-                            itemCount: bean.album!.length,
+                            itemCount: lists.album!.length,
                             physics: const NeverScrollableScrollPhysics(),
                             gridDelegate:
                                 SliverGridDelegateWithFixedCrossAxisCount(
@@ -773,7 +831,7 @@ class InfoListView extends StatelessWidget {
                                     childAspectRatio: 1.0 //宽高比为1时，子widget
                                     ),
                             itemBuilder: (contentxt, currentIndex) {
-                              Album album = bean.album![currentIndex];
+                              Album album = lists.album![currentIndex];
                               if (album.type == 2) {
                                 return ClipRRect(
                                     borderRadius: BorderRadius.circular(6.sp),
@@ -782,7 +840,7 @@ class InfoListView extends StatelessWidget {
                               return GestureDetector(
                                 onTap: () {
                                   var imgList = <String>[];
-                                  for (var element in bean.album!) {
+                                  for (var element in lists.album!) {
                                     imgList.add(element.url!);
                                   }
                                   Get.toNamed(AppRoutes.Swiper, arguments: {
@@ -800,7 +858,7 @@ class InfoListView extends StatelessWidget {
                                     ),
                                     errorWidget: (context, url, error) =>
                                         Icon(Icons.error),
-                                    fit: BoxFit.fill,
+                                    fit: BoxFit.cover,
                                   ),
                                 ),
                               );
@@ -831,7 +889,7 @@ class InfoListView extends StatelessWidget {
                       widgets.isNotEmpty
                           ? Expanded(
                               child: Text(
-                              '${bean.chat!.count!}位圈友已私聊',
+                              '${lists.chat!.count!}位圈友已私聊',
                               style: TextStyle(
                                   color: Colors.white, fontSize: 12.sp),
                             ))
@@ -841,10 +899,14 @@ class InfoListView extends StatelessWidget {
                               style: TextStyle(
                                   color: Colors.white, fontSize: 12.sp),
                             )),
-                      Image.asset(
+            GestureDetector(
+              onTap: () {
+                listsLg?.pushMsgPage(lists,bean.id.toString());
+              },
+              child:Image.asset(
                         getCircleImage('chat'),
                         width: 60.sp,
-                      )
+              ))
                     ],
                   ),
                 )
@@ -971,9 +1033,10 @@ class InfoListView extends StatelessWidget {
                           ),
                           SizedBox(width: 24.sp),
                           GestureDetector(
-                            onTap: () {
+                            onTap: () async {
                               Navigator.pop(context);
-                              logic.outCircle(bean.id.toString(), bean.isJoin);
+                              await logic.outCircle(bean.id.toString(), bean.isJoin);
+                              logic.update();
                             },
                             child: Container(
                               margin: EdgeInsets.only(top: 24.sp),

circle_app/lib/app/circle/widgets/list_logic.dart

@@ -1,5 +1,8 @@
 import 'package:circle_app/app/circle/state.dart';
+import 'package:circle_app/common/Widgets/base_tip_widget.dart';
+import 'package:circle_app/common/Widgets/open_vip_tip/view.dart';
 import 'package:circle_app/network/dio_manager.dart';
+import 'package:circle_app/router/app_routers.dart';
 import 'package:circle_app/util/util.dart';
 import 'package:flutter/material.dart';
 import 'package:get/get.dart';
@@ -19,7 +22,7 @@ class ListLogic extends GetxController {
         url: "/up-service/interest/$circleId/callouts",
         params: {"page": callOutPage, "page_size": "20"});
     if (data["code"] == 200) {
-      List dataList = data["data"]["lists"];
+      List dataList = data["data"]["lists"] ?? [];
       if (callOutPage == 1) {
         if (lists.isNotEmpty) {
           lists.clear();
@@ -31,9 +34,8 @@ class ListLogic extends GetxController {
           lists.add(Lists.fromJson(element));
         }
         callOutPage++;
-      } else {
-        callOutMore = false;
       }
+      callOutMore = dataList.length == 20;
       update();
     } else {
       showToast(data["msg"]);
@@ -51,6 +53,19 @@ class ListLogic extends GetxController {
     loadCallOutListData(_circleId);
   }
 
+  void pushMsgPage(Lists bean,String cicleId) {
+    Get.toNamed(AppRoutes.UserInfoActivity, arguments: bean.user!.id!.toString());
+    // if (bean.isQueen) {
+    //   showJoinCiclePiker(cicleId);
+    // } else {
+      //跳转消息页面
+      // Get.bottomSheet(Open_vip_tipPage(),
+      //     isScrollControlled: true,
+      //   enableDrag: false,
+      // );
+    // }
+  }
+
   @override
   void onInit() {
     // TODO: implement onInit

circle_app/lib/app/circle/widgets/play_video_view.dart

@@ -94,7 +94,7 @@ class _PlayVideoViewState extends State<PlayVideoView> {
               )),
           Positioned(
             left: 15.sp,
-            top: Get.statusBarHeight,
+            top: 44.sp,
             child: GestureDetector(
                 onTap: () {
                   Get.back();

circle_app/lib/common/Widgets/base_tip_widget.dart

@@ -0,0 +1,115 @@
+import 'package:circle_app/util/util.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter_screenutil/flutter_screenutil.dart';
+import 'package:get/get.dart';
+
+joiinCircileTipWdiget(String cicleId) {
+  return Scaffold(
+    backgroundColor: Colors.transparent,
+    body: Container(
+      width: Get.width,
+      height: Get.height,
+      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,
+                        ),
+                      ),
+                    ],
+                  ),
+                ))
+          ],
+        ),
+      ),
+    ),
+  );
+}
+  showJoinCiclePiker(String cicleId) {
+  return Get.bottomSheet(
+      joiinCircileTipWdiget(cicleId),
+    isScrollControlled: true,
+    enableDrag: false
+  );
+}

circle_app/lib/common/Widgets/open_vip_tip/view.dart

@@ -1,6 +1,7 @@
 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';
@@ -13,8 +14,15 @@ class Open_vip_tipPage extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
+    List vipFuncList = ['1', '2', '3', '4', '5', '6', '7', '8', '9'];
+    // for (int i = 1; i < 10; i++) {
+    //
+    // }
+
     return GetBuilder(builder: (Open_vip_tipLogic controller) {
-      return Container(
+      return Scaffold(
+        backgroundColor: Colors.transparent,
+        body: Container(
           width: Get.width,
           height: Get.height,
           child: Center(
@@ -47,11 +55,27 @@ class Open_vip_tipPage extends StatelessWidget {
                         style: TextStyle(color: Colors.white, fontSize: 16.sp),
                       )),
                   Positioned(
-                  left: 17.sp,
+                      top: 44.sp,
-                  top: 64.sp,
+                      child: Container(
-                  child: Text(
+                        width: Get.width,
-                    '为什么要解锁圈子?',
+                        height: 180.sp,
-                    style: TextStyle(color: Colors.white, fontSize: 16.sp),
+                        child: Swiper(
+                          itemCount: vipFuncList.length,
+                            itemBuilder: (BuildContext context, int index) {
+                              return funcItem(vipFuncList[index],
+                                  vipFuncList[index] + '111', index+1);
+                            },
+                          loop: true,
+                            autoplay:true,
+                          pagination: new SwiperPagination(
+                            builder: DotSwiperPaginationBuilder(
+                              color: Color(0x99FFFFFF),
+                              size:4.sp,
+                              activeColor: Color(0xFF00FFD2),
+                              activeSize: 4.sp
+                            )
+                          ),//如果不填则不显示指示点
+                            ),
                       )),
                   Positioned(
                       top: 227.sp,
@@ -61,10 +85,9 @@ class Open_vip_tipPage extends StatelessWidget {
                           child: Row(
                             mainAxisAlignment: MainAxisAlignment.spaceBetween,
                             children: [
-                         typeItem(controller,controller.index == 0,0),
+                              typeItem(controller, controller.index == 0, 0),
-
+                              typeItem(controller, controller.index == 1, 1),
-                          typeItem(controller,controller.index == 1,1),
+                              typeItem(controller, controller.index == 2, 2),
-                          typeItem(controller,controller.index == 2,2),
                             ],
                           ))),
                   Positioned(
@@ -78,10 +101,14 @@ class Open_vip_tipPage extends StatelessWidget {
                             gradient: const LinearGradient(
                                 begin: Alignment.centerLeft,
                                 end: Alignment.centerRight,
-                            colors: [Color(0xff0AFCFF), Color(0xffD739EA)])),
+                                colors: [
+                                  Color(0xff0AFCFF),
+                                  Color(0xffD739EA)
+                                ])),
                         child: Text(
                           '立即解锁',
-                      style: TextStyle(color: Colors.white, fontSize: 16.sp),
+                          style:
+                              TextStyle(color: Colors.white, fontSize: 16.sp),
                         ),
                       )),
                   Positioned(
@@ -114,12 +141,12 @@ class Open_vip_tipPage extends StatelessWidget {
               ),
             ),
           ),
+        ),
       );
     });
-
   }
 
-  typeItem(Open_vip_tipLogic controller,bool isSelected,int index) {
+  typeItem(Open_vip_tipLogic controller, bool isSelected, int index) {
     return GestureDetector(
         onTap: () {
           controller.index = index;
@@ -128,12 +155,14 @@ class Open_vip_tipPage extends StatelessWidget {
         child: Stack(
           alignment: Alignment.center,
           children: [
-        isSelected ? Image.asset(
+            isSelected
+                ? Image.asset(
                     getCircleImage('selected'),
                     width: 98.sp,
                     height: 110.sp,
                     fit: BoxFit.fill,
-        ) : Container(),
+                  )
+                : Container(),
             Container(
               width: isSelected ? 96.sp : 98.sp,
               height: isSelected ? 108.sp : 110.sp,
@@ -144,15 +173,33 @@ class Open_vip_tipPage extends StatelessWidget {
               child: Column(
                 mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                 children: [
-              Text('3个月',style: TextStyle(color: Colors.white,fontSize: 14.sp),),
+                  Text(
-              Text('0.67元/天',style: TextStyle(color: Colors.white,fontSize: 14.sp),),
+                    '3个月',
+                    style: TextStyle(color: Colors.white, fontSize: 14.sp),
+                  ),
+                  Text(
+                    '0.67元/天',
+                    style: TextStyle(color: Colors.white, fontSize: 14.sp),
+                  ),
                   Row(
                     mainAxisAlignment: MainAxisAlignment.center,
                     children: [
-                  Text('58元',style: TextStyle(color: Colors.white,fontSize: 14.sp),),
+                      Text(
-                  SizedBox(width: 4.sp,),
+                        '58元',
-                  Text('388元',style: TextStyle(color: Colors.white70,fontSize: 10.sp, decoration: TextDecoration.lineThrough,
+                        style: TextStyle(color: Colors.white, fontSize: 14.sp),
-                    decorationColor: Colors.white70,),),
+                      ),
+                      SizedBox(
+                        width: 4.sp,
+                      ),
+                      Text(
+                        '388元',
+                        style: TextStyle(
+                          color: Colors.white70,
+                          fontSize: 10.sp,
+                          decoration: TextDecoration.lineThrough,
+                          decorationColor: Colors.white70,
+                        ),
+                      ),
                     ],
                   )
                 ],
@@ -161,4 +208,36 @@ class Open_vip_tipPage extends StatelessWidget {
           ],
         ));
   }
+
+  funcItem(String func, String funcDesc, int index) {
+    return Container(
+      child: Column(
+        mainAxisAlignment: MainAxisAlignment.center,
+        children: [
+          Image.asset(
+            getBaseImage('vip_fun_$index'),
+            width: 70.sp,
+          ),
+          SizedBox(
+            height: 14.sp,
+          ),
+          Text(
+            func,
+            style: TextStyle(
+                color: Colors.white,
+                fontSize: 14.sp,
+                fontWeight: FontWeight.w500),
+          ),
+          SizedBox(
+            height: 4.sp,
+          ),
+          Text(funcDesc,
+              style: TextStyle(
+                color: Colors.white,
+                fontSize: 12.sp,
+              ))
+        ],
+      ),
+    );
+  }
 }

circle_app/lib/main.dart

@@ -107,6 +107,7 @@ class _MyAppState extends State<MyApp> {
             initialBinding: SplashBinding(),
             getPages: AppPages.routes,
             home: SplashPage(),
+            debugShowCheckedModeBanner: false,
           );
         });
   }