[앱 인벤터2] 갤러리 사진을 선택하기 (미디어-이미지선택)

 

[앱 인벤터2] 갤러리 사진을 선택하기 (이미지선택)

카카오톡이나 네이버 밴드을 보면 자신의 사진을 프로필 사진을 변경할 수 있죠.

앱 인벤터에서도 이 기능을 만들어 보겠습니다.

 

우리는 프로필 사진을 설정할 때, 카메라 기능을 이용하여 사진을 찍기도 하고, 

자신의 폰속에 갤러리라는 장소에 저장된 사진을 사용하기도 합니다.

 

자 우리는 앞에서 카메라를 이용해서 이미지를 변경해 보는 것을 만들어보았죠.

이번시간에는 나의 장치(폰, 태블릿)에 저장된(갤러리) 사진 이미지를 불러와서 

프로필로 변경하는 기능을 만들어 보도록 할께요.

 

목차   학습 목표 학습 내용 기본 알아두기 따라해 보기 디자이너 화면 작업 블록 화면 작업 결과 화면 Quiz

 

학습 목표

1. 나의 앱에서 프로필 사진을 변경하는 기능을 만들수 있다.

 

학습 내용

1. 이미지 선택 요소를 사용해서 갤러리 사진을 열 수 있다.

2. 갤러리에 선택된 사진을 프로필 사진으로 변경할 수 있다.

 

이번 시간에 학습할 구성요소

이미지 선택(ImagePicker)

 

기본 알아두기

 

이미지 선택(ImagePicker) 요소는 무엇인가?

(1) 팔레트-미디어에 위치하고 있음.

(2) 이미지 선택을 누르면 이미지 갤러리가 나타나고 사용자는 이미지(사진 포함)을 선택할 수 있습니다.

(3) 이미지를 선택 후, SD카드에 저장됩니다.

 

이번 시간에 배울 블록들

(1) ‘호출 이미지_선택1.열기’ : 갤러리을 화면에 보여줍니다.

(2) ‘언제 이미지_선택1.터치다운’ : 해당 버튼이 선택되면 실행됩니다.

(3) ‘언제 이미지_선택1.선택 후’  : 갤러리에서 이미지를 선택하면 실행됩니다.

(4) ‘이미지_선택1.선택된 항목’   : 선택된 항목이 저장된 위치를 가르킵니다.

(그림 이미지_선택1 블록)

따라해 보기

준비

새 프로젝트를 생성합니다.

한국어로 작업할 경우, 메뉴 위쪽에 언어를 한국어로 설정합니다.

 

실습 단계

1. 디자이너 화면에서 뷰어로 구성요소를 가져옵니다.

2. 블록 화면에서 관련 기능 블록을 가져와 카메라 기능을 이용할 수 있도록 합니다.

3. 위에 작성한 내용에 대해 결과를 확인해 봅니다.

 

디자이너 화면 작업

추가할 구성요소

캔버스 : 갤러리에서 선택한 사진을 배경이미지로 화면에 표시합니다.

이미지_선택 : 갤러리에서 사진을 선택할 수 있도록 갤러리 화면을 여는 기능을 갖습니다.

레이블1 : 선택된 이미지가 저장된 위치를 보여줍니다.

 

뷰어 화면 및 구성요소

(1) 레이블1을 선택하고 레이블의 너비를 화면에 꽉 차게 설정해 줍니다.

(그림2. 디자이너 화면 작업)

블록 화면 작업

(1) 이미지_선택 버튼을 누르면 ‘호출 이미지_선택1.열기’블록을 이용하여 갤러리 화면을 열 수 있습니다.

(2) 갤러리에서 원하는 사진을 선택하면 ‘언제 이미지_선택1.선택후’이벤트 블록이 실행됩니다.

‘캔버스1.배경이미지’지정을 통해 선택된 사진이 화면이 보이게 되고,

‘레이블1.텍스트’ 지정에 ‘이미지_선택1.선택된 항목’을 결합을 통해 선택된 이미지의 저장 위치가 레이블에 표시됩니다.

(그림3. 이미지갤러리 열기)

결과 확인

 

장치와의 연결 – WiFi 이용

(가) 메뉴의 연결을 선택 후, AI 컴패니언 선택

(나) QR 코드가 보이면, 폰 또는 태블릿의 MIT AI2 Companion 앱을 실행

(다) SCAN QR Code를 선택 후, 화면에 QR CODE를 읽는다. 이후, 자동으로 연결된다.

(그림4. 장치와 실제 작업 연결하기)

결과 확인

(가) 프로필사진 변경 을 선택한다.

(나) 갤러리가 열리면 원하는 이미지를 선택한다.

(다) 선택된 사진이 표시되는 것을 확인한다.

(그림5. 장치에서 실행 화면)

Quiz

 

(1) 갤러리에 있는 이미지를 선택 가능하도록 하는 요소는 무엇일까요?

(2) ‘이미지_선택1.선택된 항목’이 가르키는 것은 이미지 파일명이다.(O, X)

 

정답은 위의 내용에 있습니다. 혹시 잘 대답할 수 없다면 다시 한번 복습을 부탁을 드립니다.

 

하나님이 세상을 이처럼 사랑하사 독생자를 주셨으니 이는 그를 믿는 자마다 멸망하지 않고 영생을 얻게 하려 하심이라(요3:16)