常用的一些页面效果，做下记录
- 文字渐入渐出的效果
// 创建文本视图
let label = UILabel(frame: CGRect(x: 0, y: 0, width: 200, height: 150))
label.text = "这是一段示例文字\n这是一段示例文字\n这是一段示例文字\n这是一段示例文字\n这是一段示例文字\n这是一段示例文字\n这是一段示例文字\n这是一段示例文字\n这是一段示例文字\n"
label.textColor = .black
label.numberOfLines = 0
label.font = UIFont.systemFont(ofSize: 16)
self.view.addSubview(label)
// 创建渐变蒙版图层
let gradientMaskLayer = CAGradientLayer()
gradientMaskLayer.frame = label.bounds
// 设置渐变颜色，这里从透明到白色再到透明，实现上下渐变消失效果
gradientMaskLayer.colors = [UIColor.clear.cgColor, UIColor.white.cgColor, UIColor.white.cgColor, UIColor.clear.cgColor]
// 对应颜色的位置分布，调整可改变渐变区域范围
gradientMaskLayer.locations = [0.0, 0.3, 0.7, 1.0]
// 设置渐变方向为垂直方向（从上到下）
gradientMaskLayer.startPoint = CGPoint(x: 0.5, y: 0)
gradientMaskLayer.endPoint = CGPoint(x: 0.5, y: 1)
// 将渐变蒙版图层应用到文字视图上
label.layer.mask = gradientMaskLayer
- 静态图片作为背景的模糊效果
let context = CIContext(options: nil)
guard let image = try result.get().image.scaled(toHeight: screenHeight) else {return}
let ciImage = CIImage(cgImage: image.cgImage!)
let filter = CIFilter(name: "CIGaussianBlur")
filter?.setValue(ciImage, forKey: kCIInputImageKey)
filter?.setValue(75.0, forKey: kCIInputRadiusKey)
let result = filter?.value(forKey: kCIOutputImageKey) as! CIImage
let cgImage = context.createCGImage(result, from: result.extent)
let blurredImage = UIImage(cgImage: cgImage!)
// 将处理后的图片设置为背景
imageView.image = blurredImage
- 剪裁图片的窗口
// 添加遮罩层
let maskLayer = CAShapeLayer()
let path = UIBezierPath(rect: view.bounds)
let cropPath = UIBezierPath(rect: .init(x: 0, y: 0, width: 100, height: 100))
path.append(cropPath.reversing())
maskLayer.path = path.cgPath
maskLayer.fillColor = UIColor(hex: 0x000000, alpha: 0.3).cgColor
self.view.layer.addSublayer(maskLayer)
- 提取image的主要颜色
func dominantColor(from image: UIImage, darkenBy factor: CGFloat = 0.2) -> UIColor? {
// 缩小图片尺寸以加快处理速度
let scaleFactor: CGFloat = 20.0
let thumbSize = CGSize(width: image.size.width / scaleFactor, height: image.size.height / scaleFactor)
// 创建上下文
guard let cgImage = image.cgImage,
let colorSpace = CGColorSpace(name: CGColorSpace.sRGB),
let context = CGContext(data: nil,
width: Int(thumbSize.width),
height: Int(thumbSize.height),
bitsPerComponent: 8,
bytesPerRow: Int(thumbSize.width) * 4,
space: colorSpace,
bitmapInfo: CGImageAlphaInfo.premultipliedLast.rawValue) else {
return nil
}
// 在上下文中绘制缩小后的图像
context.draw(cgImage, in: CGRect(origin: .zero, size: thumbSize))
// 获取像素数据
guard let data = context.data else { return nil }
let pixelData = data.bindMemory(to: UInt8.self, capacity: Int(thumbSize.width * thumbSize.height * 4))
// 使用字典统计颜色出现频率
var colorFrequency: [UIColor: Int] = [:]
for x in 0..<Int(thumbSize.width) {
for y in 0..<Int(thumbSize.height) {
let offset = 4 * (y * Int(thumbSize.width) + x)
let red = pixelData[offset]
let green = pixelData[offset + 1]
let blue = pixelData[offset + 2]
let alpha = pixelData[offset + 3]
// 过滤透明像素
guard alpha > 0 else { continue }
// 创建颜色对象
let color = UIColor(
red: CGFloat(red) / 255.0,
green: CGFloat(green) / 255.0,
blue: CGFloat(blue) / 255.0,
alpha: CGFloat(alpha) / 255.0
)
// 统计颜色频率
colorFrequency[color, default: 0] += 1
}
}
// 找到出现次数最多的颜色
guard let dominantColor = colorFrequency.max(by: { $0.value < $1.value })?.key else { return nil }
// 调整颜色亮度
return darkenedColor(dominantColor, by: factor)
}
