如何在SwiftUI中将按钮“固定”在特定位置

jhkqcmku  于 5个月前  发布在  Swift
关注(0)|答案(1)|浏览(49)

我有一个电视遥控器的图像资产完成按钮,我把它上面的无形按钮,使其功能。问题是,因为无形的按钮需要在其各自的图形对应,如暂停,播放等按钮应该固定在一定的位置,无论设备的大小。我已经尝试了GeometryReader,RemoteGeo,即使是ChatGPT建议的一些UIKit修改也无济于事。有人能好心地帮助我吗?
示例按钮如下:

private func iphonePortraitButtons() -> some View {
        
        ZStack {
            VStack {
                
                // Design for Portrait Mode
                
                ////////////////DVD PAUSE BUTTON////////////////
                Button(action: { let generator = UIImpactFeedbackGenerator(style: .heavy)
                    generator.impactOccurred()
                    isDVDLogoPaused.toggle() }) {
                        Rectangle().opacity(1)
                            .foregroundColor(.green)
                    }
                    .frame(width: remoteGeo.size.width * 0.15,
                           height: remoteGeo.size.height * 0.08)
                    .position(x: remoteGeo.size.width * 0.158,
                              y: remoteGeo.size.height * 0.13)
                
                ////////////////INFO BUTTON////////////////
                Button(action: { let generator = UIImpactFeedbackGenerator(style: .heavy)
                    generator.impactOccurred()
                    showFloatingIsland.toggle() }) {
                        Rectangle().opacity(1)
                            .foregroundColor(.green)
                    }
                    .frame(width: remoteGeo.size.width * 0.16,
                           height: remoteGeo.size.height * 0.05)
                    .position(x: remoteGeo.size.width * 0.675,
                              y: remoteGeo.size.height * 0.077)
                
                //////////////////DIGITAL CLOCK BUTTON////////////////
                Button(action: { let generator = UIImpactFeedbackGenerator(style: .heavy)
                    generator.impactOccurred()
                    showDigitalClock.toggle() }) {
                        Rectangle().opacity(1)
                            .foregroundColor(.green)
                    }
                    .frame(width: remoteGeo.size.width * 0.16,
                           height: remoteGeo.size.height * 0.031)
                    .position(x: remoteGeo.size.width * 0.310,
                              y: remoteGeo.size.height * 0.095)
          
                }
               }
              }

字符串

64jmpszr

64jmpszr1#

主要问题可能是按钮包含在VStack中。尝试删除VStack,以便按钮由ZStack代替。然后在ZStack周围放置GeometryReader以给予大小。然后可以将整个视图作为覆盖应用于电视图像。
这里是一个改编的例子来展示它的工作。你在一些按钮上设置的尺寸非常小,我把它们增加了一点。

struct ContentView: View {
    
    private func buttonIcon(systemName: String) -> some View {
        Image(systemName: systemName)
            .resizable()
            .scaledToFit()
            .foregroundStyle(Color(white: 0.2, opacity: 0.2))
    }
    
    private func iphonePortraitButtons() -> some View {
        GeometryReader { proxy in
            let w = proxy.size.width
            let h = proxy.size.height
            ZStack {
                
                Button {
                    print("pause")
                } label: {
                    buttonIcon(systemName: "pause.rectangle.fill")
                        .frame(width: w * 0.16, height: h * 0.16)
                        .position(x: w * 0.158, y: h * 0.13)
                }
                
                Button {
                    print("info")
                } label: {
                    buttonIcon(systemName: "info.square.fill")
                        .frame(width: w * 0.16, height: h * 0.16)
                        .position(x: w * 0.675, y: h * 0.077)
                }
                
                Button {
                    print("clock")
                } label: {
                    buttonIcon(systemName: "clock.fill")
                        .frame(width: w * 0.16, height: h * 0.16)
                        .position(x: w * 0.310, y: h * 0.095)
                }
            }
        }
    }
    
    var body: some View {
        Image(systemName: "tortoise")
            .resizable()
            .scaledToFit()
            .foregroundStyle(.orange)
            .background(.blue.opacity(0.1))
            .overlay {
                iphonePortraitButtons()
            }
            .frame(maxWidth: .infinity, maxHeight: .infinity)
    }
}

字符串


的数据

相关问题