Question

这是关于用颜色填充背景。

我正在构建this project的SwiftUI版本。这是一个选项卡式应用程序（测试工具）。

This is my Working Project

我要做的第一件事是设置选项卡。我希望学到很多东西，碰壁很多。

第一堵墙是我用可怕的绿色背景渐变填充应用程序背景。

这是我水平拉伸的条纹形式。

使用IB，这不是问题。

使用SwiftUI，我需要弄清楚。

这是我到目前为止的代码：

import SwiftUI

struct RVS_SpinnerSwiftUI_Tabbed_Test_Harness_ContentView: View {
    @State private var selection = 0

    var body: some View {
        TabbedView(selection: $selection, content: {
            VStack {
                Text("TEST 0")
                    .background(Color.clear)
                }
                .tabItemLabel(Text("Simple Center"))
                .tag(0)
                .background(Image("background-gradient")
                        .scaledToFill()
//                        .scaledToFit()
            )
            VStack {
                Text("TEST 1")
                    .background(Color.clear)
                }
                .tabItemLabel(Text("Bottom Right"))
                .tag(1)
                .background(Color.clear)
            VStack {
                Text("TEST 2")
                    .background(Color.clear)
                }
                .tabItemLabel(Text("Rotator"))
                .tag(2)
            VStack {
                Text("TEST 3")
                    .background(Color.clear)
                }
                .tabItemLabel(Text("Quadrants"))
                .tag(3)
                .background(Color.clear)
        })
        .padding()
    }
}

#if DEBUG
struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        RVS_SpinnerSwiftUI_Tabbed_Test_Harness_ContentView()
    }
}
#endif

问题出在第一个标签中的.background(Image("background-gradient"))上。我正在使用它来原型化操作。一旦弄清一切，我将使这项工作更加明智。

Here's the file in GH.

它可能会随着时间而改变，因此我了解人们是否希望我对链接进行核对，但是它确实允许人们（就目前而言）看到它。

我有兴趣弄清楚如何水平拉伸背景图像以填充标签。

Answer 1

答案是...

请给信封？

.resizable()！

您确实使用.background()方法，但是使Image()的大小可调整，如下所示：

var body: some View {
    TabbedView(selection: $selection, content: {
        VStack {
            Text("TEST 0")
                .background(Color.clear)
            }
            .tabItemLabel(Text("Simple Center"))
            .tag(0)
        VStack {
            Text("TEST 1")
                .background(Color.clear)
            }
            .tabItemLabel(Text("Bottom Right"))
            .tag(1)
            .background(Color.clear)
        VStack {
            Text("TEST 2")
                .background(Color.clear)
            }
            .tabItemLabel(Text("Rotator"))
            .tag(2)
        VStack {
            Text("TEST 3")
                .background(Color.clear)
            }
            .tabItemLabel(Text("Quadrants"))
            .tag(3)
            .background(Color.clear)
    })
    .background(
        Image("background-gradient")
            .resizable()
            .scaledToFill()
    )
    .padding()
}

那会舒展它。

现在，我需要弄清楚如何使TabbedView清除背景。

SwiftUI：拉伸背景图像以填充

1 个答案: