Review of Work with View Controllers (2) - Food Tracker
Create a Gesture Recognizer
Image view๋ control ์ด ์๋๋๋ค.
๊ทธ๋ ๊ธฐ ๋๋ฌธ์ button ์ด๋ slider์ ๊ฐ์ด ์ฌ์ฉ์์ input์ ๋ฐ์ํ๋๋ก ์ค๊ณ๋์ง ์์์ต๋๋ค.
๋ฐ๋ผ์ ๋ฐ๋ก Control-drag ์ ํตํด์ action method๋ฅผ ๋ฃ์ ์ ์์ต๋๋ค.
์ด์ ๊ธ์ ๋ง์ง๋ง ๋ถ๋ถ ( `Connet the Image View to Code` )์ ์ด ๋ด์ฉ์ ๋ค๋ฃจ์์ต๋๋ค.
View๋ฅผ control์ฒ๋ผ ๋์ํ๊ฒ ํ๋ ๋ฐฉ๋ฒ์, ํด๋น View์ gesture recognizer๋ฅผ ์ถ๊ฐํ๋ ๊ฒ์ ๋๋ค.
Gesture recognizer ๋ view์ ๋ถ์ด๋ ๊ฐ์ฒด๋ก, control๊ณผ ๊ฐ์ด ์ฌ์ฉ์์ input์ ๋ฐ์ํ๋๋ก ๋ง๋ค ์ ์์ต๋๋ค.
๊ฐ๊ฐ์ Gesture recognizer ๋ ๊ฐ์์ ์์ํ๋ ๋์์๋ง ๋ฐ์ํฉ๋๋ค. ( ๋์์ ์: swipe, pinch, rotation )
์ฆ, ํ๋์ Gesture recognizer ์๋ ํ๋์ ๋์์๋ง ๋ฐ์ํ๊ฒ ๋งคํ๋์ด ์์ต๋๋ค.
" Gesture recognizer has its assigned gesture."
์ ์ฌ์ง์ ์ค๋ฅธ์ชฝ Doument Outline ์์,
!!! ์ ๋ Gesture recognizer๋ฅผ Image view์ ์ถ๊ฐํ์๊ธฐ ๋๋ฌธ์ Image view ์๋ ๊ณ์ธต์ ์ถ๊ฐ๋ ๊ฒ์ด๋ผ๊ณ ์์ํ์์ง๋ง,
Content View์ ๋์ผํ ๊ณ์ธต์ ์ถ๊ฐ๋์๋ค๋ ๊ฒ์ ํ์ธํ์์ต๋๋ค.!!!
์ฒ์์๋ ์๋ชป ์ถ๊ฐ๋ ์ค ์๊ณ ํค๋งค์์ง๋ง, Gesture Recognizer์ ์ฐ๊ฒฐ๋ view๋ฅผ ํ์ธํ๋ ๋ฐฉ๋ฒ์ ์ฐพ์ ํด๊ฒฐํ๊ฒ ๋์์ต๋๋ค.
Connect the Gesture Recognizer to Code
action์ ๋ง๋๋ ๊ณผ์ ๊ณผ ์ ์ฌํ๊ธฐ ๋๋ฌธ์ ์๋ตํ์์ต๋๋ค.
์ฐจ์ด์ ์ Scene ๋ด์ view์์ Control-drag ํ์ง ์๊ณ , Scene Dock์ Gesture recognizer์์ Control-drag ํ๋ค๋ ์ ์ ๋๋ค.
ํน์ Document Outline์์ Control-drag ํฉ๋๋ค. ์ด ๋ถ๋ถ์ controls์ action์ ์ฐ๊ฒฐํ๋ ๊ฒ๊ณผ ๊ฐ์ต๋๋ค.
Create an Image Picker to Respond to User Taps
๊ตฌํ ๋ชฉํ
1. ์ฌ์ฉ์๊ฐ Image view๋ฅผ Tap ํ์ ๋, ์นด๋ฉ๋ผ๋ก ์๋ก์ด ์ฌ์ง์ ์ฐ๊ฑฐ๋, ์จ๋ฒ์์ ์ฌ์ง์ ํ๋ ์ ํํ ์ ์๋ค.
2. ์ ํํ ์ฌ์ง์ Meal Scene์ Image view์์ ๋์ด๋ค.
์ด๋ฒ ๋จ๋ฝ์์๋ ์์ ๋ ๋จ๊ณ๋ฅผ ์์๋๋ก ํด๊ฒฐํ๋ ๊ณผ์ ์ ๋ฆฌ๋ทฐํ์์ต๋๋ค.
1. ์ฌ์ฉ์๊ฐ Image view๋ฅผ Tap ํ์ ๋, ์นด๋ฉ๋ผ๋ก ์๋ก์ด ์ฌ์ง์ ์ฐ๊ฑฐ๋ ์จ๋ฒ์์ ์ฌ์ง์ ํ๋ ์ ํํ ์ ์๋ค.
์ฐ์ ์ฌ์ฉ์์ Input (Tap)์ ์ธ์ํ๊ฒ ํ๊ธฐ ์ํ์ฌ ์ด์ ๋จ๋ฝ์์ Gesture recognizer๋ฅผ ์ถ๊ฐํ๊ณ , action์ ์์ฑํด ์ฐ๊ฒฐํ์์ต๋๋ค.
์จ๋ฒ์์ ์ฌ์ง์ ํ๋ ์ ํํ ์ ์๊ฒ ๊ตฌํํ๋ ๊ฒ์ UIImagePickerController๋ฅผ ์ด์ฉํฉ๋๋ค.
" An image picker controller manages the user interface for taking pictures and for choosing saved images to use in your app."
UIImagePickerController์์ ๊ณ ๋ฅธ ๊ฒฐ๊ณผ๋ฅผ Meal Scene์ View controller์๊ฒ ์ ๋ฌํ๊ธฐ ์ํด ์ฐธ์กฐ๊ฐ ํ์ํ๋ฐ, ๋ง์นจ UIImagePickerController๋ delegate ํ๋กํ ์ฝ์ด ์กด์ฌํฉ๋๋ค.
๊ทธ๋ฆฌ๊ณ ๋ฐ๋์ delegate์ ์ค์ ํด์ผ ํ๋ค๊ณ ๊ฐ์ด๋๋ผ์ธ์ ์ ์ํ๊ณ ์์ต๋๋ค.
" To use an image picker controller, you must provide a delegate that conforms to the UIImagePickerControllerDelegate protocol. "
๋ฐ๋ผ์ delegate ํ๋กํ ์ฝ์ ์ฑ์ฉํ๋ ๊ฐ์ฒด๋ View controller๊ฐ ๋ ๊ฒ์ ๋๋ค.
๊ทธ๋์ ์์ ์์ ๋ค์ ๋ฐ๋ผ action method์ ๊ตฌํํ์์ต๋๋ค.
@IBAction func selectingImageFromPhotoLibrary(_ sender: UITapGestureRecognizer) {
// Hide the keyboard while typing in the textfield when user taps the image view
/* 1 */
nameTextField.resignFirstResponder()
/* 2 */
let imagePickerController = UIImagePickerController()
/* 3 */
imagePickerController.sourceType = .photoLibrary
/* 4 */
imagePickerController.delegate = self
present(imagePickerController, animated: true, completion: nil)
}
/* 1 */
์ฌ์ฉ์๊ฐ TextField๋ฅผ ์์ฑ์ค์ image view ๋ฅผ ํญํ์์ ๋, Text Field ๋ฅผ first responder์์ ํด์ ํ๋ ์ฝ๋์ ๋๋ค.
/* 2*/
UIImagePickerController ์ธ์คํด์ค๋ฅผ ์์ฑํฉ๋๋ค.
์ด ์ธ์คํด์ค๋ ํํ ์์ ์๋ง ํ์ํ๋ฏ๋ก, ๊ตณ์ด ๋ค๋ฅธ ์์ ์ ์์ฑํ์ฌ ์ฐธ์กฐ๋ฅผ ๊ฐ์ง๊ณ ์์ ํ์๋ ์์ต๋๋ค.
ํด๋น ๋ฉ์๋๊ฐ ํธ์ถ๋๊ณ delgate method ํธ์ถ ๋ฐ ์คํ์ด ์ข ๋ฃ๋๋ฉด, ARC์ ์ํด ์๋์ผ๋ก ๋ฉ๋ชจ๋ฆฌ ํด์ ๋ ๊ฒ์ ๋๋ค.
/* 3 */
์ฌ์ฉ์์๊ฒ photoLibrary๋ฅผ ๋ณด์ฌ์ฃผ๋ ์ฝ๋์ ๋๋ค.
/* 4 */
delegate๋ฅผ View Controller๋ก ์ค์ ํฉ๋๋ค.
ImagePIckerController๋ฅผ ํ๋ฉด์ ๋์ฐ๊ธฐ ์ํด present(_, animated:, completion:) ๋ฉ์๋๋ฅผ ํธ์ถํฉ๋๋ค.
๊ทธ๋ฐ๋ฐ View Controller๊ฐ delegate ์ด ๋๊ธฐ ์ํด์๋ ํ์ํ ํ๋กํ ์ฝ์ ์ฑํํ์ฌ์ผ ํฉ๋๋ค.
์๋ ์ฝ๋๋ ํ๋กํ ์ฝ์ ์ฑํํ๋ ์ฝ๋์ ๋๋ค.
extension ViewController: UIImagePickerControllerDelegate,UINavigationControllerDelegate {
/* 1 */
func imagePickerControllerDidCancel(_ picker: UIImagePickerController) {
dismiss(animated:true, completion: nil)
}
/* 2 */
func imagePickerController(_ picker: UIImagePickerController, didFinishPickingMediaWithInfo info: [UIImagePickerController.InfoKey : Any]) {
guard let selectedImage = info[UIImagePickerController.InfoKey.originalImage] as? UIImage else {
fatalError()
}
photoImageView.image = selectedImage
dismiss(animated: true, completion: nil)
}
}
/* 1 */
์ด๋ค ์์ ์ ํธ์ถ๋๋ ๋ฉ์๋ ์ธ์ง๋ Apple Developer Documentation์ ํตํด ํ์ธํด์ผ ํฉ๋๋ค.
๋ค๋ง ๋ฉ์๋๋ช ์ค DidCancel์ด๋ผ๋ ๋ฌธ๊ตฌ๊ฐ ์ฌ์ฉ์๊ฐ `cancel` ๋ฒํผ์ ๋๋ฅธ ์งํ์ ํธ์ถ๋ ๊ฒ์ ์ ์ถํ ์ ์์ต๋๋ค.
/* 2 */
์ฌ์ฉ์๊ฐ ์ด๋ฏธ์ง๋ฅผ ์ ํํ์ ๋ ํธ์ถ๋๋ ๋ฉ์๋์ ๋๋ค.
parameter `info`์ ์ ๋ณด๊ฐ ๋์ ๋๋ฆฌ ํ์ ์ผ๋ก ๋ฐํ๋ฉ๋๋ค.
๋ฐฉ์ด ์ฝ๋๋ก. originalImage๋ฅผ key๋ก ๋ฃ์ด ๋์จ value๋ฅผ UIImage๋ก ์บ์คํ ํ์ฌ ์ ์ฅํ๊ณ , ๊ทธ๊ฒ์ ImageView.image ์์ฑ์ ๋ฃ์ด ์ค๋๋ค.
์ดํ ์คํํด๋ณด๋ฉด ์ ์ ๊ฒฝ์ฐ ์ ์์ ์ผ๋ก ๋์ํ์ง ๋ง ๋ง, Documentaion์์๋ ์ด๋๋ก ์คํํ๋ฉด ์ผ๋ถ๋ฌ ์๋ฌ๊ฐ ๋จ๊ฒ ์ค๊ณํ ๊ฒ ๊ฐ์์ต๋๋ค.
์ด ๋ด์ฉ์ ์ ์ด ๋ณด๊ฒ ์ต๋๋ค. (์ดํ๋ Documentation์์ ๋์ค๋ ์ํฉ์
๋๋ค.)
์ ๊ฐ ์๋ฎฌ๋ ์ดํฐ๋ก๋ง ์คํํด์ ๋ฌธ์ ์์ด ์คํ๋ ๊ฒ ๊ฐ์ต๋๋ค.
์คํํ์ฌ Image view๋ฅผ ํญ ํ๋ฉด, ์ฑ์ด SIGABORT signal๊ณผ ํจ๊ป ์ข ๋ฃ๋ฉ๋๋ค.
์ด๊ฒ์ ์ฑ์ ๋ฐ๋ก ์ข ๋ฃํด์ผ ํ ๋งํผ ์ฌ๊ฐํ ์๋ฌ๊ฐ ์๋ค๋ ๊ฒ์ ์๋ฏธํฉ๋๋ค.
์ด ๋ฌธ์ ๋ image picker๋ฅผ ํ๋ฉด์ present ํ๋ ค๊ณ ํ ๋ ๋ฐ์ํ ๊ฒ์ ๋๋ค.
์์คํ ์ ๋ฐ๋์ Photo Library์ ์ ๊ทผํ๊ธฐ ์ ์ ์ฌ์ฉ์์๊ฒ ํ๊ฐ๋ฅผ ๋ฐ์์ผ ํฉ๋๋ค.
iOS 10 ์ด์๋ถํฐ, photo library usage description์ ๋ฐ๋์ ์์ฑํ์ฌ์ผ ํ๊ณ , ์ด๋ฐ ํ๊ฐ ๋ฌธ๊ตฌ๋ Info.plist ์์ ์ถ๊ฐํฉ๋๋ค.
๋!
๋ค์ ๊ธ: