SwiftUI -在中创建带有小数点可填充前景颜色的星星评定视图

hi3rlvi2  于 2022-12-10  发布在  Swift
关注(0)|答案(1)|浏览(221)

我正在尝试使用SwiftUI开发一个星星视图。我最多有5颗星,棘手的是我需要填充4.7颗星。所以最后一颗星应该只填充其前景色的70%。
下面是我到目前为止完成的代码
第一个
如何可以填补只有70%的星星视图。我不能使用。覆盖,因为我需要支持iOS 14。
Sample view

fquxozlt

fquxozlt1#

您可以使用.mask()修改器,它将使用给定的视图创建视图的遮罩。以下是您可以实现的单个星星:

struct StarView: View {
    var fillValue: Double
    
    var body: some View {
        GeometryReader { geometry in
            ZStack(alignment: .leading) {
                Rectangle()
                Rectangle()
                    .fill(Color.orange)
                    .frame(width: geometry.size.width * fillValue)
            }
        }
        .mask(
            Image(systemName: "star.fill")
                .resizable()
        )
        .aspectRatio(1, contentMode: .fit)
    }
}

以下是fillValue设置为0.7时的结果:

然后,您可以将它们堆叠到HStack中,并进行快速计算,以了解最后一颗星星的填充值,从而使您的五星评级组件。
确保使用.mask()而不是.mask { },因为最后一个需要使用iOS 15.0。

相关问题