SwiftUI 设置图像边界

Posted 2023-02-24

【中文标题】SwiftUI 设置图像边界

【英文标题】：SwiftUI Set Image Boundary

【发布时间】：2020-09-28 07:41:10

【问题描述】：

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

【问题讨论】：

不清楚你在问什么。

我正在尝试设置我的 ımage 右边界，正如您在标签栏个人资料图片中看到的那样。我想让边界像左边一样，我的意思是更接近图片。

那么您是否要创建一个带有等距图像的标签栏（上图）？

没错，还想确保图像帧边界不与其他帧相交。

您需要 edit 将所有相关代码作为文本包含在内，使用正确的代码格式 - 而不是屏幕截图 - 以 minimal reproducible example 的形式提出问题主题。

【参考方案1】：

您应该使用内置的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)
        
    

结果：

---

自定义版本（极不推荐）：

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)
        
    

【讨论】：

我知道 tabview 但 tabview 的问题是它不允许创建超过 5 个 tabbar 。这就是我创建自定义标签栏的原因。因为我必须显示 6 个 tabbar。但苹果不推荐，让你用 tabview 创建超过 5 个。

@Begbie 如果这是极限，那就坚持极限。 6 个标签可能是可用性的噩梦。尝试更改标签的用途。我无法阅读您原始图像中的语言，但是像“主页”、“个人资料”、“设置”之类的东西将是最好的方法。例如，在配置文件中，您可能有不同的选项，不一定是他们自己的选项卡。不要重新制作标签视图，这对用户来说将是不必要的痛苦和问题。

我知道。我同意你的观点，它对用户来说也不是一个好的用户体验，但问题是我工作的公司已经做了这个设计，他们希望我这样做。所以基本上我别无选择:(

@Begbie 作为开发者，你应该质疑设计师为什么选择这个——他们可能不知道默认TabView 的限制。他们会想要一个好的应用程序——你也想制作好的应用程序。只需向设计师提问，例如说该应用程序不适合 Apple 的 Human Interface Guidelines。还请将它们链接到here 并阅读“避免标签过多”部分。 Apple 也很有可能因此拒绝该应用程序，因此这应该是他们的首要任务。

@Begbie 在开发过程中调整设计总是会发生在任何公司 - 并确保这是正确的，所以它不会被拒绝。没关系，设计师可能不知道这些功能，但只需将我上面发送的链接发送给他们，这样他们就可以阅读并下次更加小心。