如何在swiftui中將影像（加號）放在自定義框架的右上角？-有解無憂

我試圖在一個非常特定的位置（在標題文本的右側）在一個緊湊的框架中加上一個加號，但我似乎不能這樣做

你知道我該怎么做嗎？

var body: some View {
    VStack {
        HStack {
            Image(systemName: "plus")
            VStack(alignment: .leading, spacing: 15) {
                Text("This Month's Goal")
                    .bold()
                    .frame(width: 300, height: 10, alignment: .center)
                Text("100 out of 2000")
                    .frame(width: 300, height: 10, alignment: .center)

                //replace percent with percent and code percent to move with data
                ProgressBarView(width: 300, height: 30, percent: 50, color1: Color(#colorLiteral(red: 0.01413772535, green: 0.2225477993, blue: 0.9861308932, alpha: 1)), color2: Color(#colorLiteral(red: 0.5605781674, green: 0.9172690511, blue: 0.8047055602, alpha: 1)))
            }
            Spacer()
        }
        .padding()
    }
    .background(Color.white)
    .frame(width: 350, height: 120, alignment: .center)
    .cornerRadius(25.0)
}

這就是它現在的樣子，在同一幀的圓圈中的某個地方是理想的。

如何在swiftui中將影像（加號）放在自定義框架的右上角？

uj5u.com熱心網友回復：

struct TestView: View {
    var body: some View {
        VStack {
            HStack {
                Image(systemName: "plus")
                VStack(alignment: .leading, spacing: 15) {
                    ZStack(alignment: .trailing) {
                        VStack {
                            Text("This Month's Goal")
                                .bold()
                                .frame(width: 300, height: 10, alignment: .center)
                            Text("100 out of 2000")
                                .frame(width: 300, height: 10, alignment: .center)
                        }

                        Button(
                            action: { },
                            label: { Image(systemName: "plus.circle") }
                        )
                    }

                    //replace percent with percent and code percent to move with data
                    ProgressBarView(width: 300, height: 30, percent: 50, color1: Color(#colorLiteral(red: 0.01413772535, green: 0.2225477993, blue: 0.9861308932, alpha: 1)), color2: Color(#colorLiteral(red: 0.5605781674, green: 0.9172690511, blue: 0.8047055602, alpha: 1)))
                }
                Spacer()
            }
            .padding()
        }
        .background(Color.white)
        .frame(width: 350, height: 120, alignment: .center)
        .cornerRadius(25.0)
    }
}

結果：

如何在swiftui中將影像（加號）放在自定義框架的右上角？

順便說一句，如果您將完成欄（藍綠色覆寫）的寬度計算為 asheight (width - height) * percent / 100而不是 as ，您的進度條可能看起來更好width * percent / 100。

轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/409205.html

標籤：

上一篇：如何對MassTransit的重試功能進行單元測驗

下一篇：Kotlin中的兩行代碼有什么區別？