코드베이스로 UIImageView 구현하기

2023. 10. 8. 12:36·UIKit
<실습용 사진>



<UIImageView>
  • 이미지를 표시하는데 사용
  • 로컬 이미지 또는 원격 이미지를 표시하는 데 사용
[Method & Property]
  • image: 이미지 뷰에 표시되는 이미지를 설정하거나 가져온다.
  • contentMode: 이미지의 표시 방식을 설정한다. (뷰 내에서 자동으로 어떻게 조정되는지에 대한 설정)
  • alpha: 이미지 뷰의 투명도를 설정한다.
등… 프로퍼티 및 메서드 추가로 공부해보기!
//
//  UIImageViewTest.swift
//  UIKit-Study
//
//  Created by Kyungsoo Lee on 2023/09/30.
//

import UIKit

class UIImageViewTest: UIViewController {
    //MARK: - UIImageView
    private lazy var uiImageView: UIImageView = {
        let imageView = UIImageView()
        imageView.image = UIImage(named: "INHA-UMC-5th")
        imageView.contentMode = .scaleAspectFit
        imageView.alpha = 0.5
        imageView.translatesAutoresizingMaskIntoConstraints = false
        
        return imageView
    }()

    // MARK: - viewDidLoad
    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view.
        
        self.view.backgroundColor = .systemGray
        
        // 뷰 추가(아직 layout 설정 안된 상태)
        self.view.addSubview(uiImageView)
        
        setLayout()
    }

    // MARK: - UIImageView 제약 조건
    private func setUIImageViewLayout() {
        let uiImageViewConstraint = [
            // 다른 컴포넌트의 상대적인 위치로 제약조건을 설정할 수도 있다.
            uiImageView.centerXAnchor.constraint(equalTo: view.centerXAnchor),
            uiImageView.centerYAnchor.constraint(equalTo: view.centerYAnchor),
            uiImageView.widthAnchor.constraint(equalToConstant: 200), // 너비 제약 조건 추가
            uiImageView.heightAnchor.constraint(equalToConstant: 200) // 높이 제약 조건 추가
        ]
        NSLayoutConstraint.activate(uiImageViewConstraint)
    }

    // MARK: - 전체 제약조건 설정
    // 컴포넌트들의 레이아웃을 설정한다
    private func setLayout() {
        // 프레임 기반의 레이아웃을 비활성화 하여 오토 레이아웃을 기반으로 설정할 수 있도록 한다.
        
        // UIImageView 제약조건 설정
        setUIImageViewLayout()
    }
}

// UIKit으로 짠 화면을 SwiftUI로 바로 볼 수 있게 해주는 코드
import SwiftUI

@available(iOS 13.0.0, *)
struct UIImageViewTestControllerPreview: PreviewProvider {
    static var previews: some View {
        UIImageViewTest().toPreview()
    }
}

'UIKit' 카테고리의 다른 글

코드베이스로 UICollectionView 구현하기  (0) 2023.10.10
코드베이스로 UITableView 구현하기  (1) 2023.10.09
코드베이스로 UITextView 구현하기  (0) 2023.10.07
코드베이스로 UITextField 구현하기  (1) 2023.10.06
코드베이스로 UIButton 구현하기  (1) 2023.10.05
'UIKit' 카테고리의 다른 글
  • 코드베이스로 UICollectionView 구현하기
  • 코드베이스로 UITableView 구현하기
  • 코드베이스로 UITextView 구현하기
  • 코드베이스로 UITextField 구현하기
리버🐦‍🔥
리버🐦‍🔥
개발새발 개발일기
  • 리버🐦‍🔥
    개발도 개발새발
    리버🐦‍🔥
  • 전체
    오늘
    어제
    • 분류 전체보기
      • 백준 알고리즘
        • Python
        • Java
      • 프로그래머스 알고리즘
        • Python
        • Swift
        • Java
      • 코드트리 알고리즘
        • Python
      • Spring boot
        • 스프링 부트 3 백엔드 개발자 되기(자바편)
      • SwiftUI
      • UIKit
      • Programming Language
        • Swift
        • Java
      • 공부해야될 것
        • iOS
  • 블로그 메뉴

    • 홈
    • 태그
    • 방명록
  • 링크

  • 공지사항

  • 인기 글

  • 태그

    데이터베이스
    Java
    ci/cd
    스위프트
    uikit
    스프링 부트
    깊이 우선 탐색
    프로그래머스
    Code-based
    ios
    파이썬
    코드베이스
    Baekjoon
    문자열
    Swift
    큐
    스프링 부트 3
    UITextView
    너비 우선 탐색
    스프링 부트 3 백앤드 개발자 되기 : 자바편
    애너테이션
    구현
    그래프
    백앤드 개발자
    Python
    백준
    스프링 부트 3 백엔드 개발자 되기 : 자바편
    programmers
    자바
    그리디 알고리즘
  • 최근 댓글

  • 최근 글

  • hELLO· Designed By정상우.v4.10.1
리버🐦‍🔥
코드베이스로 UIImageView 구현하기
상단으로

티스토리툴바