Browse Source

[feat]商店页,iOS平台的UI调整

hezihao 7 months ago
parent
commit
51d17d8bfa
2 changed files with 178 additions and 97 deletions
  1. 176 95
      lib/module/store/store_page.dart
  2. 2 2
      lib/widget/platform_util.dart

+ 176 - 95
lib/module/store/store_page.dart

@@ -9,6 +9,7 @@ import 'package:keyboard/data/consts/web_url.dart';
 import 'package:keyboard/module/store/store_controller.dart';
 import 'package:keyboard/module/store/store_user_reviews_bean.dart';
 import 'package:keyboard/resource/string.gen.dart';
+import 'package:keyboard/widget/platform_util.dart';
 
 import '../../resource/assets.gen.dart';
 import '../../router/app_pages.dart';
@@ -34,6 +35,38 @@ class StorePage extends BasePage<StoreController> {
 
   @override
   Widget buildBody(BuildContext context) {
+    Widget bottomArea;
+    if (PlatformUtil.isIOS) {
+      bottomArea = Column(
+        children: [
+          // iOS平台的隐私协议和服务条款
+          _buildLastBottomCorner(
+            child: Container(
+              margin: EdgeInsets.only(left: 16.w),
+              child: _buildPrivacy(
+                privacyColor: Color(0x99673300),
+                mainAxisAlignment: MainAxisAlignment.start,
+              ),
+            ),
+          ),
+          // 恢复订阅入口
+          _buildRecoverSubscribe(),
+          SizedBox(height: 50.h),
+        ],
+      );
+    } else {
+      // 安卓端,可以有会员心声和购买须知
+      bottomArea = Column(
+        children: [
+          // 产品描述
+          _buildLastBottomCorner(child: _buildVipDesc()),
+          SizedBox(height: 32.h),
+          _buildUserReviews(),
+          SizedBox(height: 20.h),
+          _buildUserNotice(),
+        ],
+      );
+    }
     return Stack(
       children: [
         SingleChildScrollView(
@@ -42,11 +75,7 @@ class StorePage extends BasePage<StoreController> {
               _buildBanner(context),
               SizedBox(height: 12.h),
               _buildGoodsCard(),
-              _buildVipDesc(),
-              SizedBox(height: 32.h),
-              _buildUserReviews(),
-              SizedBox(height: 20.h),
-              _buildUserNotice(),
+              bottomArea,
             ],
           ),
         ),
@@ -221,7 +250,10 @@ class StorePage extends BasePage<StoreController> {
                   }).toList(),
             );
           }),
-          _buildPayWayCard(),
+          // iOS平台的产品描述
+          if (PlatformUtil.isIOS) _buildVipDesc(),
+          // 非iOS平台,才有支付宝支付和微信支付
+          if (!PlatformUtil.isIOS) _buildPayWayCard(),
         ],
       ),
     );
@@ -457,7 +489,8 @@ class StorePage extends BasePage<StoreController> {
     );
   }
 
-  Widget _buildVipDesc() {
+  /// 最后的底部圆角
+  Widget _buildLastBottomCorner({required Widget child}) {
     return Container(
       alignment: Alignment.centerLeft,
       margin: EdgeInsets.symmetric(horizontal: 16.w),
@@ -486,15 +519,20 @@ class StorePage extends BasePage<StoreController> {
         ],
       ),
 
-      child: Obx(() {
-        return Text(
-          controller.selectedGoodsInfoItem?.selectDesc ?? "",
-          style: Styles.getTextStyle99673300W400(12.sp),
-        );
-      }),
+      child: child,
     );
   }
 
+  /// 产品描述
+  Widget _buildVipDesc() {
+    return Obx(() {
+      return Text(
+        controller.selectedGoodsInfoItem?.selectDesc ?? "",
+        style: Styles.getTextStyle99673300W400(12.sp),
+      );
+    });
+  }
+
   // 轮播图
   Widget _buildBanner(BuildContext context) {
     return SizedBox(
@@ -758,6 +796,38 @@ class StorePage extends BasePage<StoreController> {
     );
   }
 
+  /// 恢复订阅
+  Widget _buildRecoverSubscribe() {
+    return Container(
+      margin: EdgeInsets.only(left: 16.w, top: 8.h, right: 16.w),
+      child: Row(
+        children: [
+          Text(
+            "⚠️  订阅未生效?点此试试",
+            style: TextStyle(
+              color: Color(0xFF666355),
+              fontSize: 13.sp,
+              fontWeight: FontWeight.w400,
+            ),
+          ),
+          GestureDetector(
+            onTap: () {
+              // 恢复订阅
+            },
+            child: Text(
+              "  恢复订阅>",
+              style: TextStyle(
+                color: Color(0xFF479DF7),
+                fontSize: 13.sp,
+                fontWeight: FontWeight.w400,
+              ),
+            ),
+          ),
+        ],
+      ),
+    );
+  }
+
   Widget _buildBuyButtonCard() {
     return Container(
       width: 360.w,
@@ -782,119 +852,130 @@ class StorePage extends BasePage<StoreController> {
       child: Column(
         children: [
           GestureDetector(
-
             onTap: controller.clickPayNow,
             child: Container(
               alignment: Alignment.topCenter,
-                width: 328.w,
-                height: 56.w,
+              width: 328.w,
+              height: 56.w,
               decoration: ShapeDecoration(
                 color: const Color(0xFFFFF587),
                 shape: RoundedRectangleBorder(
                   borderRadius: BorderRadius.circular(30.55.r),
                 ),
               ),
-            child: Container(
-              width: 328.w,
-              height: 54.w,
-              decoration: ShapeDecoration(
-                gradient: LinearGradient(
-                  begin: Alignment(0.60, -0.39),
-                  end: Alignment(0.60, 0.95),
-                  colors: [
-                    const Color(0xFFF95FAC),
-                    const Color(0xFFFD5E4D),
-                    const Color(0xFFFD5E4D),
-                    const Color(0xFFFB8A3C),
-                  ],
-                ),
-                shape: RoundedRectangleBorder(
-                  borderRadius: BorderRadius.circular(30.55.r),
+              child: Container(
+                width: 328.w,
+                height: 54.w,
+                decoration: ShapeDecoration(
+                  gradient: LinearGradient(
+                    begin: Alignment(0.60, -0.39),
+                    end: Alignment(0.60, 0.95),
+                    colors: [
+                      const Color(0xFFF95FAC),
+                      const Color(0xFFFD5E4D),
+                      const Color(0xFFFD5E4D),
+                      const Color(0xFFFB8A3C),
+                    ],
+                  ),
+                  shape: RoundedRectangleBorder(
+                    borderRadius: BorderRadius.circular(30.55.r),
+                  ),
                 ),
-              ),
-              child: Center(
-                child: Text(
-                  StringName.storePayNow,
-                  style: Styles.getTextStyleWhiteW500(17.sp),
+                child: Center(
+                  child: Text(
+                    StringName.storePayNow,
+                    style: Styles.getTextStyleWhiteW500(17.sp),
+                  ),
                 ),
               ),
-            )),
+            ),
           ),
 
-          _buildPrivacy(),
+          // 安卓平台的隐私协议和服务条款
+          if (!PlatformUtil.isIOS) _buildPrivacy(),
         ],
       ),
     );
   }
 
-  Widget _buildPrivacy(){
+  /// 隐私协议和服务条款
+  Widget _buildPrivacy({
+    Color privacyColor = const Color(0xFF459FFF),
+    MainAxisAlignment mainAxisAlignment = MainAxisAlignment.center,
+  }) {
     return Row(
-      mainAxisAlignment: MainAxisAlignment.center,
+      mainAxisAlignment: mainAxisAlignment,
       children: [
         Obx(() {
           return GestureDetector(
-              behavior: HitTestBehavior.opaque,
-              onTap: () {
-                controller.isAgree.value = !controller.isAgree.value;
-              },
-              child:Padding(
-                padding: EdgeInsets.symmetric(vertical: 10.w,horizontal: 10.w),child:
-              controller.isAgree.value
-                  ? Assets.images.iconStoreAgreePrivacy.image(
-                width: 16.w,
-                height: 16.w,
-              )
-                  : SizedBox(
-                child: Container(
-                  padding: EdgeInsets.all(1.w),
-                  width: 16.w,
-                  height: 16.w,
-                  child: Container(
-                    decoration: BoxDecoration(
-                      shape: BoxShape.circle,
-                      border: Border.all(
-                        color: Colors.black.withAlpha(153),
-                        width: 1.w,
+            behavior: HitTestBehavior.opaque,
+            onTap: () {
+              controller.isAgree.value = !controller.isAgree.value;
+            },
+            child: Padding(
+              padding: EdgeInsets.symmetric(vertical: 10.w, horizontal: 10.w),
+              child:
+                  controller.isAgree.value
+                      ? Assets.images.iconStoreAgreePrivacy.image(
+                        width: 16.w,
+                        height: 16.w,
+                      )
+                      : SizedBox(
+                        child: Container(
+                          padding: EdgeInsets.all(1.w),
+                          width: 16.w,
+                          height: 16.w,
+                          child: Container(
+                            decoration: BoxDecoration(
+                              shape: BoxShape.circle,
+                              border: Border.all(
+                                color: Colors.black.withAlpha(153),
+                                width: 1.w,
+                              ),
+                            ),
+                          ),
+                        ),
                       ),
-                    ),
-                  ),
-                ),
-              ),)
+            ),
           );
         }),
-        Transform.translate(offset: Offset(-10.w,0),child:
-        Text.rich(
-          TextSpan(
-            children: [
-              TextSpan(
-                text: StringName.textSpanIHaveReadAndAgree,
-                style: TextStyle(
-                  color: Colors.black.withAlpha(153),
-                  fontSize: 10.sp,
-                  fontWeight: FontWeight.w400,
+        Transform.translate(
+          offset: Offset(-10.w, 0),
+          child: Text.rich(
+            TextSpan(
+              children: [
+                TextSpan(
+                  text: StringName.textSpanIHaveReadAndAgree,
+                  style: TextStyle(
+                    color: Colors.black.withAlpha(153),
+                    fontSize: 10.sp,
+                    fontWeight: FontWeight.w400,
+                  ),
+                ),
+                ClickTextSpan(
+                  text: StringName.textSpanPrivacyPolicy,
+                  url: WebUrl.privacyPolicy,
+                  color: privacyColor,
                 ),
-              ),
-              ClickTextSpan(
-                text: StringName.textSpanPrivacyPolicy,
-                url: WebUrl.privacyPolicy,
-              ),
 
-              TextSpan(
-                text: StringName.textSpanAnd,
-                style: TextStyle(
-                  color: Colors.black.withAlpha(153),
-                  fontSize: 10.sp,
-                  fontWeight: FontWeight.w400,
+                TextSpan(
+                  text: StringName.textSpanAnd,
+                  style: TextStyle(
+                    color: Colors.black.withAlpha(153),
+                    fontSize: 10.sp,
+                    fontWeight: FontWeight.w400,
+                  ),
                 ),
-              ),
 
-              ClickTextSpan(
-                text: StringName.textSpanServiceTerms,
-                url: WebUrl.serviceAgreement,
-              ),
-            ],
+                ClickTextSpan(
+                  text: StringName.textSpanServiceTerms,
+                  url: WebUrl.serviceAgreement,
+                  color: privacyColor,
+                ),
+              ],
+            ),
           ),
-        ),)
+        ),
       ],
     );
   }

+ 2 - 2
lib/widget/platform_util.dart

@@ -12,10 +12,10 @@ class PlatformUtil {
 
   static bool get isAndroid => Platform.isAndroid;
 
-  static bool get isIOS => Platform.isIOS;
+  // static bool get isIOS => Platform.isIOS;
 
   /// 切换注释,就可以用来测试iOS平台的效果
-  // static bool get isIOS => true;
+  static bool get isIOS => true;
 
   static bool get isFuchsia => Platform.isFuchsia;