swift clipShape提供不需要的填充

vfh0ocws  于 2023-09-30  发布在  Swift
关注(0)|答案(1)|浏览(118)

我想添加圆角到我的看法,同时有意见停留在底部的看法。这里有一张照片来帮助我可怜的解释。

我希望视野的底部仍然与底部齐平。我尝试了很多不同的方法,即使我只圆顶部的角落,我仍然得到了底部的填充。我已经研究了safeAreaInset,似乎不能让它为我工作。下面是我的视图的代码。

var body: some View {
        ZStack {
            ScrollView {
                HStack {
                    Button(action: {
                        showNewScreen.toggle()
                    }, label: {
                        Image(systemName: "xmark")
                            .foregroundStyle(Color.white)
                            .padding(.leading)
                    })
                    Spacer()
                    
                    Button(action: { showingSheet.toggle() }, label: {
                        Image(systemName: "camera")
                            .foregroundStyle(Color.white)
                            .padding(.trailing)
                    })
                }
                .padding(.top)
                
                VStack {
                    TextField("Type something here...", text: $visionModel.textFieldText)
                        .padding(.leading)
                        .frame(height: 55)
                        .background(Color.white)
                        .foregroundColor(Color.black)
                        .cornerRadius(10)
                    Spacer()
                    
                    VStack {
                        Text("Which section are you adding to?")
                            .bold()
                        
                        Picker("Which section", selection: $selected) {
                            Text(SegmentSelected.task.rawValue).tag(SegmentSelected.task)
                            
                            Text(SegmentSelected.textSectionOne.rawValue).tag(SegmentSelected.textSectionOne)
                            
                            Text(SegmentSelected.textSectionTwo.rawValue).tag(SegmentSelected.textSectionTwo)
                        }
                        .background(Color.white.opacity(0.5))
                        .cornerRadius(6)
                        .pickerStyle(.segmented)
                        
                    }
                    //MARK: Add a pop up alert to tell user we have successfully added a new item
                    
                    if selected == .task {
                        VStack() {
                            DatePicker("", selection: $timeSelected, displayedComponents: .hourAndMinute)
                                .labelsHidden()
                        }
                    }
                    
                    
                    Button(action: saveButtonPressed, label: {
                        Text("Save".uppercased())
                            .foregroundColor(.white)
                            .font(.headline)
                            .frame(height: 55)
                            .frame(maxWidth: .infinity)
                            .background(Color.white.opacity(0.2))
                            .cornerRadius(10)
                        
                    })
                    .alert(isPresented: $showingAlert, content: getAlert)
                }
                .padding(14)
                .sheet(isPresented: $showingSheet) {
                    VisionView()
                        .task {
                            await visionModel.requestDataScannerAccessStatus()
                        }
                }
            }
        }
        .background(Color.blue)
        .clipShape(RoundedRectangle(cornerRadius: 25, style: .continuous))
    }

如有任何帮助,我们将不胜感激!

rkttyhzu

rkttyhzu1#

当背景有圆角时,需要显式应用.ignoresSafeArea来忽略底部的安全区域。
然后,要在没有圆角屏幕的设备(如iPhone 8)上隐藏底部的圆角,您可以在设置背景的修改器周围使用正填充、负填充和y偏移的组合。
就像这样:

var body: some View {
    ZStack {
        VStack {
            Text("Top")
            Spacer()
            Text("Lots of content here")
            Spacer()
            Text("Bottom")
        }
        .frame(maxWidth: .infinity, maxHeight: .infinity)
    }
    .padding(.bottom, 25)
    .background(
        Color.blue
            .cornerRadius(25)
            .ignoresSafeArea(edges: .bottom)
    )
    .padding(.top, -25)
    .offset(y: 25)
}

相关问题