SwiftUI之明暗度brightness设置View Image Color

# SwiftUI之明暗度brightness设置View Image Color

> brightness修饰器可以对视图进行明暗设置，我们可以从0％至100％设调节视图亮点。

# 本文价值与收获

## 看完本文后，您将能够作出下面的界面


## 看完本文您将掌握的技能

- 了解brightness

- 使用brightness设置颜色明暗度

- 使用brightness设置照片明暗度

## brightness简介

下面显示了同一图像的两个版本。左边是原稿，右边是副本，其亮度设置为0.6


## 代码

```

struct Brightness_Intro: View {

var body: some View {

VStack(spacing: 20) {

Text("Brightness").font(.largeTitle)

Text("Introduction").font(.title).foregroundColor(.gray)

Text("您可以使用“亮度”修改器更改颜色，图像或视图，使它们更亮。有效值为0（无效果）至1（完整效果）。")

.frame(maxWidth: .infinity)

.font(.title).padding()

.background(Color.pink)

.layoutPriority(1)

.foregroundColor(.white)

HStack {

Color.black

.frame(width: 50, height: 50)

.brightness(0)

.overlay(Text("0%").foregroundColor(.white))

Color.black

.frame(width: 50, height: 50)

.brightness(0.2)

.overlay(Text("20%").foregroundColor(.white))

Color.black

.frame(width: 50, height: 50)

.brightness(0.4)

.overlay(Text("40%").foregroundColor(.white))

Color.black

.frame(width: 50, height: 50)

.brightness(0.6)

.overlay(Text("60%"))

Color.black

.frame(width: 50, height: 50)

.brightness(0.8)

.overlay(Text("80%"))

Color.black

.frame(width: 50, height: 50)

.brightness(1)

.overlay(Text("100%"))

}

HStack {

Color.red

.frame(width: 50, height: 50)

.brightness(0)

.overlay(Text("0%"))

Color.red

.frame(width: 50, height: 50)

.brightness(0.2)

.overlay(Text("20%"))

Color.red

.frame(width: 50, height: 50)

.brightness(0.4)

.overlay(Text("40%"))

Color.red

.frame(width: 50, height: 50)

.brightness(0.6)

.overlay(Text("60%"))

Color.red

.frame(width: 50, height: 50)

.brightness(0.8)

.overlay(Text("80%"))

Color.red

.frame(width: 50, height: 50)

.brightness(1)

.overlay(Text("100%"))

}

HStack {

Color.purple

.frame(width: 50, height: 50)

.brightness(0)

.overlay(Text("0%"))

Color.purple

.frame(width: 50, height: 50)

.brightness(0.2)

.overlay(Text("20%"))

Color.purple

.frame(width: 50, height: 50)

.brightness(0.4)

.overlay(Text("40%"))

Color.purple

.frame(width: 50, height: 50)

.brightness(0.6)

.overlay(Text("60%"))

Color.purple

.frame(width: 50, height: 50)

.brightness(0.8)

.overlay(Text("80%"))

Color.purple

.frame(width: 50, height: 50)

.brightness(1)

.overlay(Text("100%"))

}

HStack {

Color.blue

.frame(width: 50, height: 50)

.brightness(0)

.overlay(Text("0%"))

Color.blue

.frame(width: 50, height: 50)

.brightness(0.2)

.overlay(Text("20%"))

Color.blue

.frame(width: 50, height: 50)

.brightness(0.4)

.overlay(Text("40%"))

Color.blue

.frame(width: 50, height: 50)

.brightness(0.6)

.overlay(Text("60%"))

Color.blue

.frame(width: 50, height: 50)

.brightness(0.8)

.overlay(Text("80%"))

Color.blue

.frame(width: 50, height: 50)

.brightness(1)

.overlay(Text("100%"))

}

HStack {

Color.orange

.frame(width: 50, height: 50)

.brightness(0)

.overlay(Text("0%"))

Color.orange

.frame(width: 50, height: 50)

.brightness(0.2)

.overlay(Text("20%"))

Color.orange

.frame(width: 50, height: 50)

.brightness(0.4)

.overlay(Text("40%"))

Color.orange

.frame(width: 50, height: 50)

.brightness(0.6)

.overlay(Text("60%"))

Color.orange

.frame(width: 50, height: 50)

.brightness(0.8)

.overlay(Text("80%"))

Color.orange

.frame(width: 50, height: 50)

.brightness(1)

.overlay(Text("100%"))

}

HStack {

Image("sunset")

.brightness(0.25)

.overlay(Text("25%"))

Image("sunset")

.brightness(0.5)

.overlay(Text("50%"))

Image("sunset")

.brightness(0.75)

.overlay(Text("75%"))

}

}

}

}

```

## 技术交流

QQ:3365059189

SwiftUI技术交流QQ群:518696470

- 请关注我的专栏icloudend, [SwiftUI教程与源码](https://www.jianshu.com/c/7b3e3b671970)

https://www.jianshu.com/c/7b3e3b671970