首页 > 解决方案 > SwiftUI 设置图像边界

问题描述

我想在不移动图像或文本的情况下设置我的右图像框架边界,就像左边界一样。我怎样才能做到这一点。我尝试了几种方法,但找不到解决方案。

在此处输入图像描述

标签: swiftswiftui

解决方案


您应该使用内置的TabView. 它为您提供了所有功能,并且已经考虑到了可访问性。

这是一个示例(您可以为文本和图像更改它):

struct ContentView: View {
    
    @State private var selection: Int = 1

    var body: some View {
        TabView(selection: $selection) {
            Text("Tab Content 1")
                .tabItem {
                    Label("1", systemImage: "1.square")
                }
                .tag(1)
            
            Text("Tab Content 2")
                .tabItem {
                    Label("2", systemImage: "2.square")
                }
                .tag(2)
            
            Text("Tab Content 3")
                .tabItem {
                    Label("3", systemImage: "3.square")
                }
                .tag(3)
        }
    }
}

结果:

TabView 以 3 个单独的部分为例


自定义版本(非常不推荐):

struct ContentView: View {

    var body: some View {
        VStack {
            Spacer()
            
            Text("Main Content")
            
            Spacer()
            
            HStack {
                VStack {
                    Button {
                        //
                    } label: {
                        Label("1", systemImage: "1.square")
                    }
                }.frame(maxWidth: .infinity)
                
                VStack {
                    Button {
                        //
                    } label: {
                        Label("2", systemImage: "2.square")
                    }
                }.frame(maxWidth: .infinity)
                
                VStack {
                    Button {
                        //
                    } label: {
                        Label("3", systemImage: "3.square")
                    }
                }.frame(maxWidth: .infinity)
            }.frame(height: 50)
        }
    }
}

推荐阅读