如何將影像塑造成圓形

我正在取消 UiKit 影像選擇器并嘗試為用戶設定 Profil Pic。一切正常，影像顯示出來。但我試圖把它變成一個圓圈。我嘗試使用帶有圓圈的clipShape，但它不起作用。我按照教程“我的影像 1：SwiftUI 中的照片選擇器和相機”進行操作

struct ProfileView: View {

@EnvironmentObject var appUser: User
@EnvironmentObject var appInfo: AppInformation

var body: some View {
    
    ZStack {
Rectangle()
            .frame(width: 400, height: 720)
    .cornerRadius(50)
    .foregroundColor(.gray)
    .overlay(
        
    HStack {
        
        if let image = appUser.profilBild {
    Image(uiImage: image)
            .resizable()
            .frame(width: 100, height: 100)
            .scaledToFill()
            .clipShape(RoundedRectangle(cornerRadius: 15))
            .overlay(Circle().stroke(Color.orange, lineWidth: 10))
            .onTapGesture {
                appInfo.source = .library
                appInfo.showPicker = true
            }
            .padding(20)
            .shadow(radius: 10)
            .overlay(
                ZStack{
                    Rectangle()
                        .frame(width: 20, height: 20)
                        .offset(x: 35, y: -35)
                        .foregroundColor(.white)
                Image(systemName: "plus.circle.fill")
                    .resizable()
                    .frame(width: 30, height: 30)
                    .offset(x: 35, y: -35)
                    .foregroundColor(.blue)
                    .shadow(radius: 10)
                }
            )
        }
        else {
    Image(systemName: "person.circle")
            .resizable()
            .frame(width: 100, height: 100)
            .onTapGesture {
                appInfo.source = .library
                appInfo.showPicker = true
            }
            .padding(20)
            .shadow(radius: 10)
            .overlay(
                ZStack{
                    Rectangle()
                        .frame(width: 20, height: 20)
                        .offset(x: 35, y: -35)
                        .foregroundColor(.white)
                Image(systemName: "plus.circle.fill")
                    .resizable()
                    .frame(width: 30, height: 30)
                    .offset(x: 35, y: -35)
                    .foregroundColor(.blue)
                    .shadow(radius: 10)
                }
            )
        }
        
            VStack {
                Text(appUser.username)
                .font(.largeTitle)
                .frame(width: 240 ,alignment: .leading)
                .offset(x: -10, y: -25)
                .lineLimit(1)
                
                Text(appUser.name)
                .frame(width: 220, alignment: .leading)
                .offset(x: -15,y: -20)
                .lineLimit(1)
            }
            
        }
        .frame(width: 400, height: 720, alignment: .topLeading)
    )
    .padding()
        
        ZStack {
    Rectangle()
            .foregroundColor(.secondary)
            .frame(width: 380, height: 510)
            .cornerRadius(45)
        }
        .frame(width: 400, height: 700, alignment: .bottom)
        .padding()
        
    }
    .sheet(isPresented: $appInfo.showPicker) {
        ImagePicker(sourceType: appInfo.source == .library ? .photoLibrary : .camera, selectedImage: $appUser.profilBild)
    }
    .frame(maxWidth: .infinity, maxHeight: .infinity, alignment: .top)
    }
}

uj5u.com熱心網友回復：

你快到了:)

您唯一的錯誤是您放置修飾符的順序。訂單事項！！

將scaledToFill()和clipShape()放在框架修飾符之前。

像這樣：

.resizable()
.scaledToFill()
.clipShape(Circle())
.frame(width: size, height: size)

標籤：IOS 迅速 代码 迅捷

上一篇：快速閱讀plist并處理錯誤

下一篇：如何在Swiftui中顯示來自ObservableObject的資料