自测返回界面排版问题优化5条

yvan.ni
1 parent e39b5c05
Showing 9 changed files with 52 additions and 55 deletions
packageD/pages/AI-test-skin/analyse/analyse.wxml
packageD/pages/AI-test-skin/analyse/analyse.wxss
packageD/pages/AI-test-skin/fail_result/fail_result.wxss
packageD/pages/AI-test-skin/index/aiskin.wxml
packageD/pages/AI-test-skin/index/aiskin.wxss
packageD/pages/AI-test-skin/select_photo/select_photo.wxss
packageD/pages/AI-test-skin/shoot_notice/shoot_notice.wxss
packageD/pages/AI-test-skin/success_result/success_result.wxml
packageD/pages/AI-test-skin/success_result/success_result.wxss
 <view class="content">
-    <view style="width: 750rpx; display: flex;justify-content: center; height: autuo">
+    <view style="width: 750rpx; display: flex;justify-content: center; height: 310px">
         <view class="img" style="background-image: url({{iurl}}/miniapp/images/skinimg/11.png);"></view>
     </view>
-    <view style="text-align: center;margin-top: -20%;">
-        <text style="color: #fff;">正在分析...</text>
-        <progress border-radius="6" percent="{{per}}" activeColor="#fff" backgroundColor="#85898a" class="progress"></progress>
+    <view style="text-align: center;">
+        <text style="color: #fff; font-size: 28rpx">正在分析...</text>
+        <progress border-radius="3" percent="{{per}}" activeColor="#fff"  stroke-width="4"
+                  backgroundColor="#85898a" class="progress"></progress>
     </view>
 </view>
@@ -29,13 +29,13 @@ page {
     display: inline-block;
     width: 350px;
     height: 350px;
-    transform: scale(0.5);
-    animation: 1s mymove infinite steps(27, end);
+    transform: scale(0.4);
+    animation: 2s mymove infinite steps(27, end);
 }
 .progress {
     margin-top: 3%;
-    width: 60%;
+    width: 48%;
     /* text-align: center; */
     margin-left: 50%;
     transform: translateX(-50%);
@@ -25,10 +25,10 @@ page {
     margin: 70rpx 0 30rpx 50%;
     transform: translateX(-50%);
     background: #4bd6df;
-    padding: 20rpx;
-    width: 50%;
+    padding: 15rpx 10rpx;
+    width: 46%;
     text-align: center;
-    border-radius: 40rpx;
+    border-radius: 50rpx;
     color: #fff;
 }
 .btn_fixed {
@@ -3,8 +3,10 @@
         <cover-view style="padding: 6rpx 6rpx 6rpx 25rpx;" bindtap="goto" data-url="/packageD/pages/AI-test-skin/history_record/history_record">历史档案</cover-view>
         <text class="iconfont icon-arrow_right" style="font-size: 30rpx"></text>
     </view>
-    <image src="{{iurl}}/miniapp/images/skinimg/shouye.jpeg"></image>
-    <view class="start_btn" bindtap="goto" data-url="/packageD/pages/AI-test-skin/shoot_notice/shoot_notice">
-        <text>开始测肤</text>
+    <view style="position: relative;width: 100%">
+        <image style="width: 100%" src="{{iurl}}/miniapp/images/skinimg/shouye.jpeg" mode="widthFix"></image>
+        <view class="start_btn" bindtap="goto" data-url="/packageD/pages/AI-test-skin/shoot_notice/shoot_notice">
+            <text>开始测肤</text>
+        </view>
     </view>
 </view>
 \ No newline at end of file
-/* packageB/pages/AI-test-skin/aiskin.wxss */
-page {
-    width: 100%;
-    height: 100%;
-}
-image {
-    width: 100vw;
-    height: 100%;
-}
+
 .container1 {
     position: relative;
     width: 100%;
-    height: 100%;
 }
 .history {
     margin-top: 30rpx;
@@ -22,18 +13,18 @@ image {
     box-shadow: 0 0 2px 2px #f7f5f5;
     color: #4ad5df;
     align-items: center;
+    z-index: 100;
 }
 .start_btn {
-    position: fixed;
-    bottom: 50rpx;
-    /* margin: auto; */
-    /* text-align: center; */
     margin-left: 50%;
     transform: translateX(-50%);
     background: #4bd6df;
-    padding: 20rpx;
+    padding:16rpx 20rpx;
     width: 67%;
     text-align: center;
     border-radius: 40rpx;
     color: #fff;
+    font-size: 30rpx;
+    position:absolute;
+    bottom: 90rpx;
 }
 \ No newline at end of file
@@ -23,9 +23,8 @@ page {
 .foot_btn .ok_btn {
     background: #5dd9dc;
-    padding: 0 50rpx;
+    padding: 16rpx 40rpx;
     border-radius: 50rpx;
     /* margin: 0 auto; */
-    line-height: 100rpx;
     color: #fff;
 }
@@ -72,10 +72,10 @@ page {
     margin: 70rpx 0 30rpx 50%;
     transform: translateX(-50%);
     background: #4bd6df;
-    padding: 20rpx;
+    padding: 15rpx 15rpx;
     width: 50%;
     text-align: center;
-    border-radius: 40rpx;
+    border-radius: 50rpx;
     color: #fff;
 }
 .btn_fixed {
@@ -130,7 +130,7 @@
     <!-- 局部放大的 -->
     <block wx:if="{{img_scale}}">
         <!-- 图片显示区 -->
-        <view class="dialog_img" style="{{show_type == 5?'height:60%':'height:75%'}}">
+        <view class="dialog_img" style="{{show_type == 5?'height:60%':'height:85%'}}">
             <view class="img_content rel">
                 <!-- 如果是黑眼圈的左眼右眼的时候 -->
                 <view wx:if="{{is_esys_show}}" class="face_show_view rel" style="width:{{eye_w}}px;height:{{eye_h}}px;margin-top: -{{eye_top}}px;margin-left: -{{is_esys_show==1?eye_left1:eye_left2}}px">
@@ -237,7 +237,7 @@
             </block> -->
         </view>
         <!-- 文字显示区 -->
-        <view class="dialog_txt" style="{{show_type == 5?'height:40%':'height:25%'}}">
+        <view class="dialog_txt" style="{{show_type == 5?'height:40%':'height:15%'}}">
             <block wx:if="{{show_type == 5}}">
                 <view class="heiyanquan_img flex">
                     <view class="img1 t-c">
@@ -259,31 +259,31 @@
             </block>
             <view class="dialog_progress">
                 <view style="margin-right:7px;font-size:32rpx;">
-                    <text wx:if="{{show_type==1}}">毛孔粗大{{pore_num}}</text>
-                    <text wx:if="{{show_type==2}}">色斑{{speckle_num}}</text>
+                    <text wx:if="{{show_type==1}}">毛孔粗大 {{pore_num}}</text>
+                    <text wx:if="{{show_type==2}}">色斑 {{speckle_num}}</text>
                     <block wx:if="{{show_type==3}}">
-                        <text wx:if="{{scroll_id==1}}">全部皱纹{{wrinkle_num}}</text>
-                        <text wx:if="{{scroll_id==2}}">抬头纹{{wrinkle_num1}}</text>
-                        <text wx:if="{{scroll_id==3}}">川字纹{{wrinkle_num2}}</text>
-                        <text wx:if="{{scroll_id==4}}">眼周细纹{{wrinkle_num3}}</text>
-                        <text wx:if="{{scroll_id==5}}">鱼尾纹{{wrinkle_num4}}</text>
-                        <text wx:if="{{scroll_id==6}}">法令纹{{wrinkle_num5}}</text>
-                        <text wx:if="{{scroll_id==7}}">口周纹{{wrinkle_num6}}</text>
+                        <text wx:if="{{scroll_id==1}}" style="position: relative;top: 25rpx;">全部皱纹 {{wrinkle_num}}</text>
+                        <text wx:if="{{scroll_id==2}}" style="position: relative;top: 25rpx;">抬头纹 {{wrinkle_num1}}</text>
+                        <text wx:if="{{scroll_id==3}}" style="position: relative;top: 25rpx;">川字纹 {{wrinkle_num2}}</text>
+                        <text wx:if="{{scroll_id==4}}" style="position: relative;top: 25rpx;">眼周细纹 {{wrinkle_num3}}</text>
+                        <text wx:if="{{scroll_id==5}}" style="position: relative;top: 25rpx;">鱼尾纹 {{wrinkle_num4}}</text>
+                        <text wx:if="{{scroll_id==6}}" style="position: relative;top: 25rpx;">法令纹 {{wrinkle_num5}}</text>
+                        <text wx:if="{{scroll_id==7}}" style="position: relative;top: 25rpx;">口周纹 {{wrinkle_num6}}</text>
                     </block>
-                    <text wx:if="{{show_type==4}}">黑头{{blackhead_num}}</text>
+                    <text wx:if="{{show_type==4}}">黑头 {{blackhead_num}}</text>
                     <block wx:if="{{show_type==5}}">
                         <text wx:if="{{!s_dark_type}}">黑眼圈 {{s_filter.get_dark_type(dark_type)}}</text>
                         <text wx:if="{{s_dark_type==1}}">左眼黑眼圈 {{s_filter.get_dark_type(dark_type1)}}</text>
                         <text wx:if="{{s_dark_type==2}}">右眼黑眼圈 {{s_filter.get_dark_type(dark_type2)}}</text>
                     </block>
                     <block wx:if="{{show_type==6}}">
-                        <text wx:if="{{scroll_id==1}}">全部痤疮{{acne_num}}</text>
-                        <text wx:if="{{scroll_id==2}}">粉刺{{acne_num1}}</text>
-                        <text wx:if="{{scroll_id==3}}">痘印{{acne_num2}}</text>
-                        <text wx:if="{{scroll_id==4}}">脓包{{acne_num3}}</text>
-                        <text wx:if="{{scroll_id==5}}">结节{{acne_num4}}</text>
+                        <text wx:if="{{scroll_id==1}}">全部痤疮 {{acne_num}}</text>
+                        <text wx:if="{{scroll_id==2}}">粉刺 {{acne_num1}}</text>
+                        <text wx:if="{{scroll_id==3}}">痘印 {{acne_num2}}</text>
+                        <text wx:if="{{scroll_id==4}}">脓包 {{acne_num3}}</text>
+                        <text wx:if="{{scroll_id==5}}">结节 {{acne_num4}}</text>
                     </block>
-                    <text wx:if="{{show_type==7}}">敏感度{{s_filter.get_nai_shou(skin_sensitive_check)}}</text>
+                    <text wx:if="{{show_type==7}}">敏感度 {{s_filter.get_nai_shou(skin_sensitive_check)}}</text>
                 </view>
                 <view style="margin-top:10rpx;display: flex;display: none">
                     <view class="pp"></view>
@@ -305,8 +305,6 @@
                 </view>
             </scroll-view>
         </view>
-
-
     </block>
     <!-- 全图的，能够自由拖拽和放大 -->
@@ -19,7 +19,7 @@ page {
     position: fixed;
     bottom: 100rpx;
     right: 0;
-    padding:8rpx  20rpx;
+    padding:8rpx 20rpx;
     background-color: #fff;
     border: 2rpx solid #f0f0f0;
     /* color: #FFF; */
@@ -465,7 +465,7 @@ page {
     flex-direction: column;
     justify-content: space-evenly;
     background-color: #fff;
-    min-height: 25%;
+    min-height: 10%;
 }
 .dialog_txt .heiyanquan_img {
@@ -859,4 +859,10 @@ page {
     top: 15px;
     position: absolute;
     right: 50rpx;
-}
 \ No newline at end of file
+}
+
+::-webkit-scrollbar {
+    width: 0;
+    height: 0;
+    color: transparent;
+}