본문 바로가기

UIKIT

UIImageView를 customImageView 생성

import UIKit

class CustomImageView: UIImageView {

    enum ImageType {
        case system(String, pointSize: CGFloat)
        case user(UIImage)
    }
    
    private var imageType: ImageType? {
        didSet {
            updateImageAppearance()
        }
    }
    
    override init(frame: CGRect) {
        super.init(frame: frame)
        
        configureImageViewStyle()
    }
    
    required init?(coder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }
    
    private func configureImageViewStyle() {
        
        self.layer.borderWidth = 3
        self.layer.borderColor = UIColor.black.cgColor
        self.backgroundColor = .white
        self.layer.cornerRadius = 50
        self.clipsToBounds = true
    }
    
    func setImageType(_ type: ImageType) {
        self.imageType = type
    }
    
    
    private func updateImageAppearance() {
        
        switch imageType {
        case .system(let systemName, let pointSize):
            let config = UIImage.SymbolConfiguration(pointSize: pointSize)
            self.image = UIImage(systemName: systemName, withConfiguration: config)
            self.tintColor = .black
            self.contentMode = .center
        case .user(let userImage):
            self.image = userImage
            self.contentMode = .scaleAspectFill
        case .none:
            self.image = nil
        }
    }
    
}

 

CustomImageView 클래스

 이 클래스는 UIImageView를 커스터마이즈한 것으로, 시스템 이미지 또는 사용자 이미지를 동적으로 설정하고, 설정된 이미지의 타입에 따라 contentMode와 스타일을 자동으로 업데이트합니다.

 

 

enum ImageType

enum ImageType {
    case system(String, pointSize: CGFloat)
    case user(UIImage)
}

 

  • ImageType: 이미지를 시스템 이미지 또는 사용자 이미지구분하기 위해 사용하는 열거형.
    • .system(String, pointSize: CGFloat):
      • 시스템 이미지의 이름(String)과 크기를 나타내는 pointSize(CGFloat)를 저장.
      • 시스템 이미지는 SF Symbols를 사용합니다.
    • .user(UIImage):
      • 사용자 이미지(UIImage)를 저장.

 

imageType 프로퍼티

private var imageType: ImageType? {
    didSet {
        updateImageAppearance()
    }
}

 

  • imageType:
    • 현재 CustomImageView가 표시할 이미지의 타입을 나타냅니다.
    • didSet 프로퍼티 감시자:
      • imageType이 변경될 때마다 updateImageAppearance() 메서드를 호출하여 이미지의 외형을 업데이트합니다.

프로퍼티 감시자의 역할:

  • didSet프로퍼티 값이 변경된 직후 호출됩니다.
  • 여기서는 imageType 값이 변경될 때 자동으로 updateImageAppearance()를 호출하여 이미지와 스타일을 갱신합니다.

 

init 초기화 메서드

override init(frame: CGRect) {
    super.init(frame: frame)
    configureImageViewStyle()
}
  • init(frame:):
    • CustomImageView의 인스턴스를 초기화할 때 기본 스타일을 설정합니다.
    • 내부에서 configureImageViewStyle() 호출.

 

configureImageViewStyle 메서드

private func configureImageViewStyle() {
    self.layer.borderWidth = 3
    self.layer.borderColor = UIColor.black.cgColor
    self.backgroundColor = .white
    self.layer.cornerRadius = 50
    self.clipsToBounds = true
}
  • CustomImageView의 기본 스타일을 설정하는 메서드.
    • 테두리 두께와 색상, 배경색, 둥근 모서리, 클립 설정을 적용.

 

setImageType(_:) 메서드

func setImageType(_ type: ImageType) {
    self.imageType = type
}

 

  • imageType 값을 설정하는 공개 메서드.
  • imageType 값이 변경되면 자동으로 didSet가 호출되어 이미지와 스타일이 업데이트됩니다.

 

updateImageAppearance 메서드

private func updateImageAppearance() {
    switch imageType {
    case .system(let systemName, let pointSize):
        let config = UIImage.SymbolConfiguration(pointSize: pointSize)
        self.image = UIImage(systemName: systemName, withConfiguration: config)
        self.tintColor = .black
        self.contentMode = .center
    case .user(let userImage):
        self.image = userImage
        self.contentMode = .scaleAspectFill
    case .none:
        self.image = nil
    }
}

 

 

  • imageType 값에 따라 이미지를 설정하고 스타일을 조정하는 메서드.
  • 동작 흐름:
    1. .system 케이스:
      • 시스템 이미지와 크기(pointSize)를 설정.
      • UIImage.SymbolConfiguration을 사용하여 이미지 크기를 조정.
      • contentMode는 .center로 설정.
    2. .user 케이스:
      • 사용자 이미지를 설정.
      • contentMode는 .scaleAspectFill로 설정.
    3. .none 케이스:
      • 이미지를 제거.

 

let customImageView = CustomImageView(frame: CGRect(x: 0, y: 0, width: 100, height: 100))
customImageView.setImageType(.system("camera", pointSize: 25))


let selectedImage = UIImage(named: "userProfileImage")
customImageView.setImageType(.user(selectedImage!))