앱인벤터 강좌 - 캔버스 이용하여 그림그리기

앱인벤터 강좌 캔버스 - 그림그리기


앱인벤터 이번 시간에는 캔버스를 이용하여 스마트폰 화면에 그림을 그려 보도록 하겠습니다.



앱인벤터 캔버스 - 그림그리기



화면구성

▲ 팔레트에서 [그리기&애니메이션]에 들어 있는 캔버스를 뷰어 화면에 옮겨 놓습니다.



▲ 캔버스 속성에서 높이와 너비를 부모에 맞추기를 선택하여 캔버스가 화면에 꽉 차게 합니다.





블록설정하기

▲ 블록으로 이동한 뒤 [캔버스1]을 클릭하여 위 블록을 가져와 배치를 합니다.



▲ 캔버스에서 우리가 할 일은 선을 그리는 일이기 때문에 [호출 캔버스1. 선그리기]블록을 가져옵니다.




▲ 블럭을 위 그림 처럼 두개를 맞춰 줍니다.



▲ 이전X 위에 마우스를 올려 놓으면 위 그림 처럼 [가져오기 이전 X]와 [지정하기 이전X]값이 나타납니다.

 [가져오기 이전 X]을 클릭하여 X1 값에 넣어 줍니다.



▲ [이전Y]에 마우스를 올려 놓고 [가져오기 이전Y] 값을 가져옵니다. 



▲ 위 코드는 스마트폰에서 처음 화면에 X, Y의 좌표 값을 구합니다.



▲ X2, Y2 값도 같은 방법으로 가져 옵니다.



▲ 캔버스에 선을 그리는 코드가 완성 되었습니다. ^^


댓글(0)

Designed by JB FACTORY