SwiftUI学习之路:View的修饰符-foregroundStyle

foregroundStyle

用于设置一个View的前景样式

声明方式:

func foregroundStyle<S>(_ style: S) -> some View where S : ShapeStyle

func foregroundStyle<S1, S2>(_ primary: S1, _ secondary: S2) -> some View where S1 : ShapeStyle, S2 : ShapeStyle

func foregroundStyle<S1, S2, S3>(_ primary: S1, _ secondary: S2, _ tertiary: S3) -> some View where S1 : ShapeStyle, S2 : ShapeStyle, S3 : ShapeStyle

参数

方法的参数都是ShapeStyle,差别只是在数量上,
ShapeStyle为填充前景元素时使用的颜色或图案
可以使用Colorimage(_:sourceRect:scale:),或渐变类型之一,例如 linearGradient(colors:startPoint:endPoint:)。 也可以使用预设样式,例如.primary
三种方法中最常用的是第一个,如:

Image(systemName: "triangle.fill")
	.foregroundStyle(.teal)

可以得到一个颜色为teal的实心triangle
在这里插入图片描述
而下面两种声明方法则用于View嵌套中,即为子View提供了.primary .secondary .tertiary的预设样式(没有单独声明style的前提下会使用.primary作为样式),如

HStack {
    Image(systemName: "triangle.fill")
    Image(systemName: "triangle.fill")
        .foregroundStyle(.secondary)
    Image(systemName: "triangle.fill")
        .foregroundStyle(.tertiary)
}
.foregroundStyle(.blue, .green, .red)

可以得到三个颜色分别为blue, green, red的实心triangle
在这里插入图片描述

有趣的是,如果你在父View中只指定了一个样式,你仍然可以在子View中使用.secondary .tertiary

HStack {
    Image(systemName: "triangle.fill")
    Image(systemName: "triangle.fill")
    	.foregroundStyle(.secondary)
    Image(systemName: "triangle.fill")
        .foregroundStyle(.tertiary)
}
.foregroundStyle(.blue)

在这里插入图片描述

也可以指定样式为渐变样式,如

Text("Gradient Text")
   .foregroundStyle(
       .linearGradient(
        colors: [.red, .blue],
            startPoint: .top,
            endPoint: .bottom
        )
    )

可得到一个从上到下由红色渐变到蓝色的文字效果。
在这里插入图片描述

Tip:如果要使用样式填充单个 Shape 实例,请改用更高效的 fill(style:) 形状修饰符

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值