내일배움캠프 7기 Day18 TIL (3)

Daisy Kim·2023년 8월 2일
0

UIKit 컴포넌트 요소

  • UIScrollView

    사용자가 스크롤을 사용하여 뷰 내의 컨텐츠를 볼 수 있게 해주며 다중제스처와 가로 및 세로 스크롤, 확대 및 축소를 지원한다.
    또한 UIScrollViewDelegate 프로토콜을 구현할 수 있다.

예시

class ViewController: UIViewController, UIScrollViewDelegate{

var scrollView: UIScrollView!
var imageView: UIImageView!

override func viewDidLoad() {
	super.viewDidLoad()
    
    // 스크롤뷰 생성
    scrollView = UIScrollView(frame: CGRect(origin: CGPoint(x:값, y:값), size: CGSize(width: view.bounds.width, height: 값)))
    scrollView.delegate = self
    
    // 이미지뷰 생성
    let image = UIImage(systemName: "folder.fill")
    imageView = UIImageView(image: image)
    imageView.contentMode = .scaleAspectFit
    imageView.frame = CGRect(origin: CGPoint.zero, size: CGSize(width:값, height:값)
    
    // 이미지뷰를 스크롤뷰에 추가
    scrollView.addSubview(imageView)
    
    // 스크롤뷰 설정
    scrollView.contentSize = CGSize(width:view.bounds.width * 2, height: 값 * 2)
    scrollView.minimumZoomScale = 0.5 등의 값
    scrollView.maximumZoomScale = 2 등 원하는 값으로 설정
    
    // 뷰에 스크롤뷰 추가
    view.addSubview(scrollView)
	}
// UIScrollViewDelegate 메서드 구현
func viewForZooming(in scrollView: UIScrollView) -> UIView? {
	return imageView
    }
}

UIPickerView

선택목록에서 갑슬 선택할 수 있는 컴포넌트로
여러개의 열(Column)으로 구성되며, 각 열에는 여러 행(row)이 포함된다.

[특징]

  • UIPickerViewDataSource 프로토콜을 채택하여 데이터 소스 를 구현
  • UIPickerViewDelegate 프로토콜을 채택, 델리게이트 메서드 를 구현
  • didSelectRow 메서드를 통해 선택한 값 을 가져올 수 있음
예시

class ViewController: UIViewController, UIPickerViewDataSource, UIPickerViewDelegate {

	let pickerView = UIPickerView()
    let data = ["항목1", "항목2", "항목3", ... etc]
    override func viewDidLoad() {
    	super.viewDidLoad()
        pickerView.frame = CGRect(x: 값, y: 값, width: 값, height: 값)
        self.view.addSubview(pickerView)
        
        // 피커뷰에 들어가는 데이터소스와 델리게이트 설정
        pickerView.dataSource = self
        pickerView.delegate = self
        }
    
    // 데이터 소스 메서드
    func pickerView(_ pickerView: UIPickerView, numberOfRowsInComponent component: Int) -> Int {
    	return date.count
    }
    
    // 여긴 왜 이렇게 쓰는걸까?
    func numberOfComponent(in pickerView: UIPickerView) -> Int {
    	return 1
    }
    
    // 델리게이트 메서드 
    func pickerView(_ pickerView: UIPickerView, titleForRow row: Int, forComponent component: Int) -> String? {
    	return data[row]
    }
    func pickerView(_ pickerView: UIPickerView, didSelectRow row: Int, inComponent component: Int) {
    	let selectedValue = data[row]
        // 선택된 값을 사용
        print("선택,", selectedValue)
    }
}

UITableView

다양한 데이터를 리스트 형식으로 표시하는 UIScrollView의 서브클래스

[특징]

  • 여러개의 섹션을 가질 수 있고 각 섹션은 여러 행을 또 가질 수 있다.
  • 행을 재사용 가능 ⇒ 메모리 사용량을 줄일 수 있음
  • 행을 선택하거나 삭제할 수 있다.
예시

class ViewController: UIViewController, UITableViewDelegate, UITableViewDataSource {

	let data = ["사과", "바나나", "오렌지", "포도", "자두"]
    var tavleView: UITableView!
    override func viewDidLoad() {
    	super.viewDidLoad()
        tableView = UITableView(frame: view.bounds, style: .plain)
        tableView.dataSource = self
        tableView.delegate = self
        
        view.addSubview(tableView)
    }
    
    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    	let cell = UITableViewCell(style: .default, reuseIdentifier: "Cell")
        cell.textLabel?.text = data[indexPath.row]
        return cell
    }
    func tableView(_ taleView: UITableView, numberOfRowsInSection section: Int) -> Int {
    	return data.count
    }
    func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath {
    	print("선택", data[indexPath.row])
    }
}

UICollectionView

profile
Technology proderit homini

0개의 댓글