5.1_创建和配置UIImageView

创建和配置UIImageView，让你的应用界面更加生动有趣！🎉 UIImageView 是 UIKit 中用于显示图像的视图。你可以加载本地图片，也可以从网络获取图片，并将其显示在你的应用中。

创建 UIImageView

首先，你需要创建一个 UIImageView 的实例。你可以通过代码直接创建，并设置其 frame，也就是它在屏幕上的位置和大小。

let imageView = UIImageView(frame: CGRect(x: 20, y: 100, width: 200, height: 150))

这段代码创建了一个 UIImageView，它的左上角坐标是 (20, 100)，宽度是 200，高度是 150。 记得将这个 imageView 添加到你的视图中，这样它才能显示出来。

view.addSubview(imageView)

加载和显示图片

接下来，你需要加载一张图片并将其显示在 UIImageView 中。你可以从本地加载图片，也可以从网络加载。

1. 从本地加载图片

   如果你的图片已经添加到你的项目中，你可以使用 UIImage(named:) 方法来加载它。

   imageView.image = UIImage(named: "myImage")

   确保 "myImage" 是你项目中的图片资源的名字。

2. 从网络加载图片

   从网络加载图片稍微复杂一些，你需要使用 URLSession 来下载图片数据，然后将其转换为 UIImage。

   let imageUrl = URL(string: "https://example.com/image.jpg")!
   let task = URLSession.shared.dataTask(with: imageUrl) { (data, response, error) in
       if let data = data, let image = UIImage(data: data) {
           DispatchQueue.main.async {
               imageView.image = image
           }
       }
   }
   task.resume()

   这段代码首先创建一个 URL 对象，然后使用 URLSession 下载图片数据。下载完成后，将数据转换为 UIImage，并在主线程中更新 UIImageView 的 image 属性。 确保在主线程中更新 UI，避免出现线程问题。

UIImageView 的配置

UIImageView 有很多属性可以配置，让你可以更好地控制图片的显示效果。

• contentMode: 这个属性决定了图片在 UIImageView 中的显示方式。常用的值包括：

  • scaleToFill: 图片会缩放以填充整个 UIImageView，可能会变形。
  • aspectFit: 图片会按比例缩放，直到完全显示在 UIImageView 中，可能会留白。
  • aspectFill: 图片会按比例缩放，直到填充整个 UIImageView，可能会裁剪。

  imageView.contentMode = .scaleAspectFit

• clipsToBounds: 这个属性决定了是否裁剪超出 UIImageView 边界的内容。

  imageView.clipsToBounds = true

• tintColor: 这个属性可以改变图片的颜色，但只有当图片的 renderingMode 设置为 .alwaysTemplate 时才有效。

  imageView.image = imageView.image?.withRenderingMode(.alwaysTemplate)
  imageView.tintColor = .red

示例：创建一个圆角图片

你可以结合 clipsToBounds 和 layer 的 cornerRadius 属性，创建一个圆角图片。

imageView.clipsToBounds = true
imageView.layer.cornerRadius = 20 // 设置圆角半径

这段代码将 UIImageView 的 clipsToBounds 设置为 true，并将 layer 的 cornerRadius 设置为 20，从而创建一个圆角图片。

UIImageView 的动画

你还可以使用 UIImageView 来显示动画。你需要创建一个 UIImage 数组，每个 UIImage 代表动画的一帧，然后将这个数组赋值给 UIImageView 的 animationImages 属性。

var images: [UIImage] = []
for i in 1...3 {
    if let image = UIImage(named: "frame\(i)") {
        images.append(image)
    }
}

imageView.animationImages = images
imageView.animationDuration = 1.0 // 动画持续时间
imageView.animationRepeatCount = 0 // 0 表示无限循环
imageView.startAnimating()

这段代码首先创建一个 UIImage 数组，然后将这个数组赋值给 UIImageView 的 animationImages 属性。设置动画的持续时间和重复次数，然后调用 startAnimating() 方法开始动画。

通过以上步骤，你可以轻松地创建和配置 UIImageView，让你的应用界面更加丰富多彩！ 🚀