test

demo/Views/User/UserView.swift

@@ -8,6 +8,8 @@
 import SwiftUI
 
 struct UserView: View {
+    @State private var showDetail = false
+
     var body: some View {
         ScrollView {
             Header
@@ -21,9 +23,8 @@ struct UserView: View {
                 tj
             }
             .padding(16)
-            .background(LinearGradient(colors: [Color.orange, Color.gray], startPoint: .top, endPoint: UnitPoint(x: 0, y: 0.5)))
+            .background(Color.gray.opacity(0.2))
             .cornerRadius(12)
-            .offset(y: -76)
         }
     }
 
@@ -51,11 +52,17 @@ struct UserView: View {
             Image(systemName: "gearshape")
                 .foregroundColor(Color.gray)
         }
-        .padding(.horizontal, 16)
+        .padding(.horizontal, 24)
     }
 
     var ToVip: some View {
         HStack(spacing: /*@START_MENU_TOKEN@*/nil/*@END_MENU_TOKEN@*/, content: {
+            Text("VIP de yixie 简介部分")
+            Button(action: {
+                self.showDetail.toggle()
+            }, label: {
+                Text("详情")
+            })
             Spacer()
             Button("立即开通") {}
                 .foregroundColor(Color.red)
@@ -68,6 +75,8 @@ struct UserView: View {
         .padding(16)
         .padding(.bottom, 64)
         .frame(maxWidth: .infinity)
+        .frame(height: showDetail ? 100 : 200)
+        .animation(.default, value: showDetail)
         .background(
             Image("Images/banner3").resizable(resizingMode: .tile)
 //                .overlay(
@@ -82,17 +91,7 @@ struct UserView: View {
         ScrollView(.horizontal) {
             HStack(spacing: 16) {
                 ForEach(/*@START_MENU_TOKEN@*/0 ..< 5/*@END_MENU_TOKEN@*/) { _ in
-                    VStack {
-                        HStack {
-                            Image(systemName: "star")
-                            Text("我的积分")
-                        }
-                        Text("共8888分")
-                            .font(.caption)
-                    }
-                    .padding(12)
-                    .background(Color.white)
-                    .cornerRadius(8)
+                    UserAccountCard(model: UserAccountCardModel(title: "我的积分", icon: "star", info: "共30001分"))
                 }
             }
         }