디자인 하기!

디자인을 시작하겠습니다. 설명이 안된 부분은 2강을 참고하세요. 절대 귀찮아서 그런거 아닌거 알죠? 저희 굉장히 성실합니다!! 아시죠??ㅋㅋ 제일 먼저 화면 구역을 나누는 것부터 시작해 봅시다.

우선 [Section1], [Section2] Layout의 폭을 모두 화면에 꽉 채우기 위해 아래 그림과 같이 [Width]를 [Fill parent](전부 채운다)로 설정합니다.(아래 사진은 아직 Fill parent가 적용되지 않은 사진입니다.)

이제 구체적으로 크기(비율)를 지정하기 위해 [Blocks] 버튼을 클릭하여 블록 배치 화면으로 건너 갑시다. ① 화면 좌측의 Blocks 구역에 [Screen1]을 클릭하고 [when Screen1.Inicialize] 블록을 드래그하여 빈 공간에 갖다 둡니다. (처음 화면이 켜질 때 구성요소의 크기를 조정하는 명령을 내려 크기를 지정할 수 있습니다.)
② [Section1]의 높이(height)를 지정하기 위해 [Section1]의 [set Section1.Height to] 블록을 드래그하여 연결합니다.
③④⑤⑥Section1의 높이는 화면높이(Screen1.Height)의 1/8임을 나타냅니다.

정리된 화면을 한번 보시죠. 정리된 화면을 보시면서 이해해 보시고요, 정 모르시겠다면 3편 디자인, 속성다루기를 다시 보시거나, 댓글로 질문을 남겨 주세요.
그리고 방금했던 방법과 같이 [Section2], [Delete], [Naver], [Google], [Daum], [Nate] 에도 같은 원리를 적용하여 높이 및 길이를 지정해 보세요.

Properties 설정하기

이제 여러 구성요소의 특성(Properties)을 아래 표와 같이 바꿉니다.

Screen 위치	이름	사용목적	Properties
Screen1	Screen1		Scrollable : 체크해제 BackgroundColor : None BackgroundImage : background.png Icon : icon.png Title : 빈칸
	SearchTextBox	검색어 입력	BackgroundColor : None Hint : 검색어를 입력하세요
	Delete	검색어 지움	BackgroundColor : None Image : btn_delete.png Text : 빈칸
	Naver	네이버에서 검색 명령	BackgroundColor : None Image : btn_naver.png Text : 빈칸
	Google	구글에서 검색 명령	BackgroundColor : None Image : btn_google.png Text : 빈칸
	Daum	다음에서 검색 명령	BackgroundColor : None Image : btn_daum.png Text : 빈칸
	Nate	네이트에서 검색 명령	BackgroundColor : None Image : btn_nate.png Text : 빈칸
	WebViewer1	웹페이지 출력	Visible : hidden

완성? 확인해 보기

이제 Build하여 앱을 확인해 봅시다! (Connect는 디자인 요소가 제대로 반영이 안 될 수 있어요)
오! 화면은 제대로 뜨는데! 검색어를 입력하고 버튼을 눌러도...도대체 검색 결과가 나오지를 않아요.ㅜㅜ
문제가 도대체 무엇인가요???ㅜㅜ 아래에서 확인해 봅시다.

아래 사진과 같이 검색어를 입력하고 검색 버튼을 아무리 눌러도 검색결과가 뜨지 않는! 초유의 사태를 확인하실 수 있습니다ㄷㄷㄷ 하지만 걱정하지 마세요! 뜻이 있다면 길이 있는 법! 지금까지 해왔던 것을 잘 생각하며 한발씩 나가봅시다.

웹뷰어(WebViewer)를 숨겼다가 검색 실행시 보여주기

WebViewer의 특성(Properties) 중 Visible을 hidden으로 지정해 두었습니다. 이는 WebViewer를 숨겨(hidden) 배경화면을(background) 보이기 위해서 입니다.
하지만 WebViewer를 숨겨두면 검색결과를 볼 수 없겠죠? 이는 검색을 실행했을 때 숨겨두었던 WebViewer를 다시 보여주게 하면 되겠습니다.

완성 및 요약

이제 끝~!! 오늘도 수고하셨습니다! 오늘 만든 앱 잘 쓰세요~~ 그리고 질문은 댓글로!! 피드백도 댓글로! 아니면 페이스북 페이지로!