[앱인벤터 기초] 버튼을 클릭하면 배경색이 바뀌는 앱 만들기

앱인벤터를 이용해서 간단한 앱을 만들어보도록 하겠습니다.

지금 만들 앱의 목적은 화면 가운데 놓인 버튼을 클릭하면 '안녕하세요.'라는 소리와 함께 배경색이 바뀌는 것입니다.

먼저 완성된 앱을 동영상으로 확인해봅시다.

동작영상

화면구성

스마트폰 화면 안에 버튼을 드래그해서 넣습니다.

버튼의 속성을 변경합니다.

배경색 : 회색

텍스트 : 클릭

텍스트 색상 : 흰색

컴포넌트에서 스크린을 선택한 후 속성을 변경합니다.

수평정렬 : 가운데

수직정력 : 가운데

팔레트에서 미디어를 클릭한 후 음성변환을 화면으로 드래그해서 넣어줍니다.

코딩하기

블록 화면으로 들어갑니다.

처음 시작 이벤트(상황)는 '버튼을 클릭했을 때'입니다.

버튼을 클릭해서 해당 블록을 흰색 부분으로 드래그해서 가져옵니다.

음성변환을 클릭해서 '안녕하세요' 라는 글자를 읽을 수 있도록 아래와 같이 코딩합니다.

이번에는 배경색을 바꾸는 기능을 만들어봅니다.

색상 블록을 클릭해서 '색상만들기' 블록을 가져옵니다.

스크린의 배경색을 바꾸기 위해서 '지정하기 Screen 배경색 값' 블록을 가져옵니다.

색상 만들기 블록과 연결 한 후에 위에서 만든 블록들 밑으로 붙여줍니다.

배경색을 랜덤하게(무작위) 바꾸기 위해서 수학해서 아래의 블록을 가져옵니다.

숫자의 값을 시작은 0, 끝은 255로 변경합니다.

확인하기

앱인벤터로 만든 앱을 스마트폰에 설치하기 위해 빌드를 클릭합니다.

'앱(APK용 QR 코드 제공)'을 클릭해서 QR코드를 만듭니다.

네이버 앱에서 렌즈를 클릭해서 QR코드를 찍도록 합니다. (QR코드를 인식할 수 있으면 다른 앱도 괜찮습니다. :D )

다운로드 받은 파일을 선택해서 설치합니다.

앱을 실행시켜서 완성된 모습을 확인합니다. (완성~ :D )

내맘대로코딩