# SwiftUI之明暗度brightness设置View Image Color
> brightness修饰器可以对视图进行明暗设置,我们可以从0%至100%设调节视图亮点。
# 本文价值与收获
## 看完本文后,您将能够作出下面的界面
![Jietu20200328-104035@2x.jpg](https://upload-images.jianshu.io/upload_images/41085-29c89ba74b163032.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
## 看完本文您将掌握的技能
- 了解brightness
- 使用brightness设置颜色明暗度
- 使用brightness设置照片明暗度
## brightness简介
下面显示了同一图像的两个版本。左边是原稿,右边是副本,其亮度设置为0.6
![image.png](https://upload-images.jianshu.io/upload_images/41085-5607da43a5888a5f.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
## 代码
```
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
原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。
如有侵权,请联系 cloudcommunity@tencent.com 删除。
原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。
如有侵权,请联系 cloudcommunity@tencent.com 删除。