在 SwiftUI 中更改 ProgressView 的大小（高度）

Question

我在 SwiftUI 中创建了一个 ProgressView（使用 Xcode）并进行了一些编辑，但还没有想出如何改变它的高度。

struct ProgressBar: View {
    var body: some View {
        VStack {
            ProgressView("Progres:", value: 50, total: 100)
        }.foregroundColor(Color(UIColor.systemBlue))
        .scaleEffect(1, anchor: .center)
        .accentColor(Color(UIColor.systemGreen))
    }
}

Answer 1

据我所知，没有直接的方法可以更改高度，但您可以使用 .scaleEffect 修饰符。确保为 x 比例指定 1，以便只增加高度。

struct ContentView: View {
    var body: some View {
        ProgressBar()
        .padding([.leading, .trailing], 10)
    }
}

struct ProgressBar: View {
    var body: some View {
        VStack {
            ProgressView(value: 50, total: 100)
            .accentColor(Color.green)
            .scaleEffect(x: 1, y: 4, anchor: .center)
        }
    }
}

结果：

这样做的一个缺点是您不能传入标签，因为它也会被拉伸。

ProgressView("Progress:", value: 50, total: 100)

要解决此问题，只需在 ProgressView.

上方创建您自己的 Text

struct ProgressBar: View {
    var body: some View {
        VStack(alignment: .leading) {
            Text("Progress:")
            .foregroundColor(Color.blue)
            
            ProgressView(value: 50, total: 100)
            .accentColor(Color.green)
            .scaleEffect(x: 1, y: 4, anchor: .center)
        }
    }
}

Answer 2

我需要一些半径更圆的东西，并且不将 ProgressView 隐藏在另一个视图中，所以这是我的看法（通过使用比例效应扩展@aheze 的答案）

struct MyProgressViewStyle: ProgressViewStyle {
  var myColor: Color

  func makeBody(configuration: Configuration) -> some View {
      ProgressView(configuration)
          .accentColor(myColor)
          .frame(height: 8.0) // Manipulate height, y scale effect and corner radius to achieve your needed results
          .scaleEffect(x: 1, y: 2, anchor: .center)
          .clipShape(RoundedRectangle(cornerRadius: 6))
          .padding(.horizontal)
  }
}
// Here's how to use it inside a View
ProgressView(value: currentProgress, total: totalProgress)
            .progressViewStyle(MyProgressViewStyle(myColor: Color.green))

在 SwiftUI 中更改 ProgressView 的大小（高度）

Change size (height) of ProgressView in SwiftUI

xcode

uiprogressview

ios

swift

swiftui