PhotosUI PhotosPicker

PhotosUI

PhotosPicker

PhotosUI가 제공하는 PhotosPicker는 유저의 앨범에 접근 가능하게 함.
예를들어, 어떤 영역(사진이 들어갈)을 클릭하면 갤러리가 열리고, 그 사진을 클리하면 뷰의 이미지가 선택한 이미지로 변경하도록 구현해보자

import PhotosUI
...
@State var selectedItem: PhotosPickerItem? // PhotosPicker로 선택한 아이템 (Optional)
@State var postImage: Image? // Optional
var body: some View {
	PhotosPicker(selection: $selectedItem) { // 이 영역에 존재하는 View는 클릭시 앨범에 접근 가능, 선택시 selection에 상태 저장
    	Image("보여줄이미지")
    }
    .onChange(of: selectedItem) { oldValue, newValue in
		print("이전값", oldValue)
		print("이후값", newValue)
    }
}

기본적으로 위와 같이 사용. PhotosPicker로 감싼 영역에 대해 앨범에 접근 가능하며, 앨범에서 선택한 사진에 대한 저장소는 @State로 selectedItem이라고 선언했으며, selection이라는 프로퍼티에 바인딩.
이후 선택한 사진에 대한 로직은 onChange로 컨트롤이 가능.

이후 사진 저장 및 이미지 표기, nill 값처리, 비동기 Task처리 등

동적으로 보여줄 이미지 State를 만들고, 해당 이미지 State를 수정할 함수를 생성한다 (onChange에서 실행예정)

@State var postImage: Image?
    
    func convertImage(item: PhotosPickerItem?) async{
        guard let item = item else {return}
        guard let data = try? await item.loadTransferable(type: Data.self) else {return}
        guard let uiImage = UIImage(data: data) else {return}
        
        postImage = Image(uiImage: uiImage)
    }

위 함수를 PhotosPicker의 onChange로직에 newValue를 인자로 받으면 postImage는 동적으로 변할것.

최종적으로 UI에 변경된 이미지를 보여주며 nill값을 처리

PhotosPicker(selection: $selectedItem) {
	if let image = self.postImage {
    	image
        	.resizable()
            ...등등 모디파이어
    } else {
    	Image(systemName: "기본값 이미지")
    }
}