如何将底部边缘与上方视图的中心对齐 swiftui

Posted 2023-03-29

【中文标题】如何将底部边缘与上方视图的中心对齐 swiftui

【英文标题】：How to align bottom edge to Center of above view swiftui

【发布时间】：2021-09-29 00:48:09

【问题描述】：

我目前正在尝试将人物图像垂直中心 (/centerY) 与 SwiftUI 视图中渐变视图的底部边缘对齐。

代码：-

struct GroupDetailScreen: View 
var body: some View 
    ZStack
        VStack 
            LinearGradient(gradient: Gradient(colors: [Color.red,Color.blue]), startPoint: .top, endPoint: .bottom)
                .frame(width:UIScreen.screenWidth,height: 180, alignment: .center)
                .clipped()
            ZStack
                Image(systemName: "person.circle.fill")
                    .renderingMode(.original)
                    .resizable()
                    .frame(width: 100, height: 100)
                    .aspectRatio(contentMode: .fit)
            
         
      
   

输出

想要达到：-

有人可以向我解释如何将人物图像垂直中心 (/centerY) 与渐变视图的底部边缘对齐。我已经尝试按照上面的方法实现，但还没有结果。

任何帮助将不胜感激。

提前致谢。

【参考方案1】：

我认为有几种方法可以做到这一点。

我在这里用overlay和offset使用了这种方式。

struct GroupDetailScreen: View 
var body: some View 
    ZStack
        VStack 
            LinearGradient(gradient: Gradient(colors: [Color.red,Color.blue]), startPoint: .top, endPoint: .bottom)
                .frame(width: UIScreen.main.bounds.width, height: 180, alignment: .center)
                .clipped()
                .overlay(
                    Image(systemName: "person.circle.fill")
                        .renderingMode(.original)
                        .resizable()
                        .frame(width: 100, height: 100)
                        .aspectRatio(contentMode: .fit)
                        .offset(y: 90) // 1/2 of view height (180*(1/2)
                )
                .edgesIgnoringSafeArea(.all) // for ignore safe area
            
            Spacer()
         
      
   

---