꾸숑의 IT 월드

앱인벤터2 '그리기 & 애니메이션' 항목에는 공, 캔버스, 이미지 스프라이트 등 3가지의 컴포넌트들이 들어 있다. 이번 강좌에서는 캔버스 위에 이미지 스프라이트를 배치해서 슈팅게임을 만들어보자. 1.먼저 디자이너 화면에 캔버스를 가져다 두고 높이와 넓이를 '부모 요소에 맞추기'를 선택해 최대로 확대한다. 2. 다음은 그 캔버스 위에 이미지 스프라이트를 3개 배치한다. 이미지 스프라이트는 개수에 제한없이 수십개라도 가져다 둘 수 있다. 3. 이미지 스프라이트에는 전투기, 미사일, 적 등을 배치할 것이므로 인터넷에서 적당한 이미지를 미리 다운받아서 준비해 둔다. 가장 하단의 이미지 스프라이트에는 전투기 그림을 불러올 것이므로 이미지 스프라이트의 이름을 'airplane' 으로 수정한다. 그리고 전투기 바로 ..

VS code에 비해 visual studio 2022가 다소 무겁기는 해도 Micro soft 사에서 정식으로 유통시키는 플랫폼이기 때문에 거의 모든 것을 가능하게 하는 강력한 기능을 제공한다. 회사에서 특별한 프로젝트를 진행하거나 다소 큰 프로그램을 제작해야 한다면 visual studio 2022가 VS code보다는 더 좋은 선택이 될 수 있다. 이번 시간에도 visual studio 2022의 텍스트 출력용과 윈도우 폼 출력용 두가지를 나누어서 설명하도록 하겠다. 1. visual studio 2022를 기동시킨 첫 화면이다. '새 프로젝트 만들기'를 선택한다. 2. 프로젝트 이름과 저장 위치를 지정하고 다음을 클릭한다. 3. '추가 정보' 항목은 변경없이 다음으로 넘어간다. 4. 편집 화면이 ..

VS code에서 C나 C++은 extension을 설치해서 간단히 실행할 수 있으나 C#은 몇가지 파일이 같이 컴파일 되기 때문에 쉽게 실행할 수 없다는 것을 알 것이다. 이번 시간에는 VS code에서 C#을 실행하는 법을 알아보자. C#은 '텍스트 출력'용을 실행하는 법과 '윈도우 폼 출력'용을 실행하는 법이 다르기 때문에 2가지를 각각 설명하겠다. 1.C#은 Microsoft 사에서 개발한 언어이기 때문에 C#을 VS code에서 실행하기 위해서는 MS사의 .Net SDK를 설치해야 한다. https://dotnet.microsoft.com/en-us/download/visual-studio-sdks에 가서 .Net 최신 버전을 설치한다. x64는 64비트용, x86은 32비트용 이므로 자신의 컴..

객체 지향 프로그램에서 가장 혼동하기 쉬운 용어 중 하나가 오버로딩과 오버라이딩일 것이다. 지금부터 두 용어의 의미와 정확한 사용예를 들어 보면서 두 용어의 차이를 이해해 보자. 1.오버로딩 오버로딩은 우리말로 다중 정의라고 번역한다. 즉 여러개의 메서드로 만들 수 있다는 의미가 된다. 좀더 자세히 설명하면 한 클래스 내에서 같은 이름의 메서드를 인수와 메서드 안의 내용, 리턴값을 다르게 하여 여러 번 정의 하는 것이다. 예를 들어 보자. ex) public class Calc { int plus(int a, int b) {

이번 시간에는 거의 모든 언어의 IDE로 불리는 Replit에 대해 소개하겠다. Replit은 50개의 언어와 78개 Templates에 대한 IDE를 제공한다. https://replit.com/ 에 들어가 보자. Replit의 메인 페이지다. 좌측 상단의 "+ Create Replit"을 클릭하거나 화면 중앙에 나오는 "+" 아이콘을 클릭한다. 팝업 창이 뜨는데 여기서 좌측 부분의 스크롤을 내려 보면 50개의 언어와 78개의 Templates이 나열된다. 아마 알고 있는 대부분의 언어가 있을 것이다. 그중 하나를 선택하고 "+Create Replit"를 클릭한다. 제목을 입력하고 "+Create Replit"를 다시 클릭한다. 필자는 파이썬을 선택했는데 간단한 프린트 문을 작성하고 상단의 "Run" ..

앱인벤터2의 그리기 & 애니메이션 항목에는 공, 캔버스, 이미지 스프라이트등 3개의 컴포넌트가 준비되어 있다. 공과 이미지 스프라이트는 캔버스 위에 배치되는 소품 정도로 이해하면 되고 가장 중요한 것은 캔버스이다. 캔버스는 그림을 그리는 이젤 정도로 생각하면 가장 이해하기 쉬울 것이다. 이제 캔버스에 그림도 그려보고 글자를 써 보는 등 캔버스를 어떻게 사용하는지 그 방법을 알아보자. 먼저 다음과 같이 디자이너 에디터를 구성한다. 화면 상단에 수평배치 레이아웃을 배치하고 그 안에 버튼 세개를 가져다 둔다. 화면 중간에는 팔레트에서 '그리기 & 애니메이션' 항목에 들어가 캔버스 하나를 끌어다 둔다. 캔버스 아래에도 수평배치 레이아웃을 하나 배치하고 그 안에 버튼 세개를 넣는다. 마지막으로 화면 하단부에는 캔..

앱인벤터2의 미디어 팔레트에는 미디어를 다루는 여러가지 컴포넌트가 있는데 이번 시간에는 비슷한 역할을 하는 '음성 인식, 음성 변환, 얀덱스 번역' 3개의 컴포넌트를 모두 모아서 하나의 앱을 만들어 보도록 하겠다. 음성 인식 컴포넌트로 사람의 음성을 인식하고, 음성 변환 컴포넌트로는 인식된 사람의 음성을 소리로 변환한다. 그리고 얀덱스 번역 컴포넌트로는 영어로 발음한 단어나 문장을 한글로 번역해서 발음하는 간단한 앱을 하나 만들어 보자. 먼저 다음과 같이 디자이너 에디터를 구성한다. 버튼 두개를 배치하고 나머지는 모두 레이블로 배치한다. 버튼 하나는 한글 음성 인식용으로 쓰고 다른 버튼 하나는 영어 음성 인식용으로 쓸 것이다. 화면을 보고 버튼의 텍스트와 레이블의 텍스트를 입력한다. 한글과 영어 두개의 ..

이번 시간에는 사람의 음성을 인식해서 모르는 영어 단어를 쉽게 찾아주는 앱을 만들어 보자. 또 얀덱스 번역 컴포넌트를 이용해 검색된 결과를 한글로 표시하고 말로 들려주는 것 까지 만들어 볼 것이다. 먼저 다음과 같은 디자이너 에디터를 구성한다. '음성 인식'과 '다시 듣기' 두개의 버튼을 준비하고 나머지는 전부 레이블을 이용해 디자이너 화면을 구성한다. 또한 보이지 않는 컴포넌트로 '음성인식', '음성변환', '얀덱스 번역'등 3개의 컴포넌트도 필요하다. 음성 인식 버튼을 클릭하면 음성 인식 컴포넌트에서 음성을 인식하고 그에 해당하는 텍스트를 가져온다. 그러면 가져온 텍스트를 '영어 단어 레이블'에 표시하고 음성변환 컴포넌트는 소리를 들려준다. '호출 얀덱스 번역1. 번역요청하기' 세부블록을 보면 'en..

앱인벤터2에는 다양한 미디어 컴포넌트가 준비되어 있어 여러가지 미디어를 다룰 수 있도록 하고 있다. 이번시간에는 녹음기로 소리를 저장하고 재생하는 방법에 대해서 알아보겠다. 먼저 다음과 같이 디자이너 에디터를 구성하자. 좌측 미디어 팔레트에 들어가서 녹음기와 소리 컴포넌트를 화면에 끌어다 두자. 이 두 컴포넌트는 보이지 않는 컴포넌트이기 때문에 화면 하단에 나타난다. 그리고 버튼 3개를 화면에 배치해서 소리를 녹음, 중지, 재생할 수 있도록 한다. 블록 에디터에 들어가서 녹음 버튼과 중지 버튼의 이벤트 블록을 채워주자. 녹음 버튼과 중지 버튼은 '녹음기'에서 소리 녹음을 시작하고 중지 하는 블록을 필요로 하기 때문에 '녹음기' 컴포넌트의 세부블록에서 '녹음기 시작하기'와 '정지' 블록을 끌어와 각각 끼워..

이번 시간에는 앱인벤터2 왕초보 강좌 19번째 시간으로 플레이어와 소리 컴포넌트의 차이에 대해서 알아보겠다. 먼저 다음과 같은 디자이너 화면을 구성한다. 플레이어와 소리 컴포넌트의 차이점을 알아보기 위해 각 컴포넌트의 재생과 중지 두개씩의 버튼을 준비한다. 수평배치 레이아웃을 두개 배치하고 그 안에 재생, 중지 두개씩의 버튼을 가져다 둔다. 속성은 알아보기 편한대로 적당히 수정한다. 먼저 플레이어 컴포넌트의 사용법에 대해서 알아보자. 플레이어 컴포넌트의 도움말을 보면 '오디오를 재생하고 전화 진동을 제어하는 멀티미디어 구성 요소. 멀티미디어 필드의 이름은 디자이너 또는 블록 편집기에서 설정할 수있는 소스 속성에 지정됩니다. 진동의 시간 길이는 밀리 초 (천분의 1 초) 단위로 블록 편집기에 지정됩니다. ..

앱인벤터2에는 인공지능을 이용할 수 있는 확장 기능이 있어 여러가지 인공지능 앱을 만들어 볼 수 있다. 이번 시간에는 앱인벤터2 인공지능 만들기 1 시간으로 여러 확장기능중 사물 인식 기능이 있는 LookExtension을 import해 보고 앱인벤터2에 적용하는 방법을 알아보자. 앱인벤터2에서 새로운 프로젝트를 하나 시작한다. '도움말'에 들어가서 '확장기능'을 선택한다. 그러면 'MIT App Inventor Extensions'페이지로 들어간다. 여기에는 앱인벤터에서 제공하는 여러가지 '확장기능'이 있다. 이 중에서 'LookExtension.aix' 파일을 클릭해 보자. 그러면 'LookExtension.aix' 파일이 사용자의 컴퓨터 다운로드 디렉토리에 다운이 될 것이다. 팔레트에서 '확장기능'..

이번 시간에는 이미지 선택 버튼의 사용법에 대해서 알아보고 작성한 앱을 직접 실행해 어떻게 적용되는지 알아보자. 먼저 다음과 같이 디자이너 에디터를 구성한다. 미디어 섹션에서 이미지 선택 버튼(imagePicker)을 드래그해 화면 상단에 배치하자. 레이블 하나는 이미지 선택버튼이 제대로 작동하는지를 알아보기 위해 텍스트를 보여 줄 것이다. 다음으로 '그리기 & 애니메이션'에서 '캔버스'를 하나 꺼내서 화면 하단부에 배치하고 높이와 너비를 '부모 요소에 맞추기'로 설정한다. 이미지 선택버튼의 이벤트 블록안에 이미지1 컴포넌트의 '지정하기 이미지1. 사진 값' 블록을 끼워넣자. 이미지 선택 버튼의 세부 블록을 보면 'imagePicker1. 선택된 항목' 블록이 있다. 이 블록을 이미지1 컴포넌트의 '지정..

지난번 파이썬 업무 자동화 2편 : 엑셀 주무르기1에 이어 엑셀 주무르기 다음편을 이어 가겠다. 5)2개의 열을 읽어 오기 열을 읽어 올때는 'clos = sheet['A:B']'를 준다. [ ]속에 읽어 오고 싶은 열의 알파벳을 적어준다. 여러개의 행을 읽어 올때와 비슷한 형식임을 알 수 있다. 6)2행 2열 셀을 읽어 올때 2행 2열의 데이터를 가져오는 방식을 보자. A2, A3, B2, B3 셀의 값을 가져오기 위해서 for 문 안에 한번더 for 문을 써서 반복문을 구성했다. 이 방식을 이용해 다차원 셀 가져오기도 할 수 있을 것이다. 7)엑셀에 텍스트 추가하기 엑셀에 텍스트를 쓰기 위해서는 openpyxl 라이브러리에서 Workbook 함수를 import한다. 'A1' 셀에 텍스트를 입력하기 위..

이번 시간에는 '파이썬 업무 자동화 2편'으로 파이썬으로 엑셀 파일에 데이터를 읽고 쓰는 여러가지 방법에 대해 알아보겠다. 파이썬으로 엑셀을 다루기 위해서는 'openpyxl'이라는 엑셀 라이브러리를 설치해야 한다. 파이썬을 설치할 때 path를 지정했으면 C:\>에서도 파이썬 라이브러리를 설치할 수 있다. 여기서 에러가 나는 사람은 파이썬이 설치되어 있는 디렉토리를 찾아 들어가야 한다. "pip install openpyxl"을 입력한다. 필자의 컴퓨터에는 이미 설치가 되어 있기 때문에 설치되어 있다는 메시지가 나왔다. 사용자 컴퓨터의 상황에 따라 다른 에러가 나올 수 있으므로 에러 내용을 잘 보고 설치해 보기 바란다. 먼저 엑셀에 위와 같은 데이터를 입력하고 이 데이터를 기초로 파이썬에서 엑셀에 데이..

이번 시간에는 미디어 섹션에 있는 '카메라'로 사진 촬영하는 법을 알아보자. 카메라로 사진을 찍기 위해서는 사진을 보이기 위한 '이미지'나 '캔버스'가 있어야 한다. 먼저 다음과 같이 디자이너 에디터를 준비하자. 팔레트의 '그리기 & 에니메이션' 파트에서 캔버스를 화면 중앙에 배치한다. 처음 캔버스를 가져가 두면 작은 크기의 캔버스가 나타난다. 속성창에 가서 캔버스의 높이와 너비를 '부모 요소에 맞추기'로 설정한다. 하단부에 버튼을 하나 가져다 두고 이름과 텍스트를 적당히 입력한다. 미디어섹션에서 카메라를 하나 드래그해서 화면 중앙에 드랍해 보자. 카메라는 보이지 않는 컴포넌트이기 때문에 스마트폰 화면에 나타나지 않고 스마트폰 하단부에 표시된다. 이제 블록 에디터에 가서 블록들을 배치해 보자. 먼저 버튼..

앱인벤터2에는 미디어섹션에 캠코더를 비롯한 카메라, 녹음기, 비디오 플레이어등 미디어에 관련된 여러가지 컴포넌트들이 준비되어 있다. 시간나는 대로 캠코더 부터 시작해 하나하나 강좌를 준비해 보도록 하겠다. 이번 시간에는 '캠코더의 사용법' 시간으로 캠코더로 동영상을 촬영하고 재생하는 것 까지 배워보도록 하자. 먼저 다음과 같이 디자이너 에디터를 준비하자. 상단에 버튼 두개 배치해서 '녹음 시작'과 '재생'이라고 글자를 입력하자. 버튼의 이름도 'start', 'replay'등으로 변경시켜 준다. 하단부에는 '비디오 플레이어'를 끌어다 두고 비디오 플레이어가 하단부 전체를 차지하도록 크기도 조정한다. 높이와 너비를 '부모 요소에 맞추기'로 설정하면 된다. '캠코더' 컴포넌트는 화면에 직접 나타나는 요소가 ..

파이썬 에디터는 여러가지가 있다. 이번에 소개할 에디터는 노트패드++이다. 필자도 노트패드++를 자주 쓰고 있지만 노트패드++가 파이썬 에디터로도 쓰일 수 있다는 것은 이번에 처음 알았다. 노트패드++를 파이썬 에디터로 쓰기 위해서는 플러그인을 하나 설치해야 한다. '플러그인 -> 플러그인 관리'로 들어간다. 'NppExec'를 선택해 주고 '설치'를 시작한다. 노트패드++를 재시작 한다는 알림창이 뜬다. 'NppExec' 플러그인을 설치하고 나면 노트패드++ 하단에 Console창이 나타난다. 이제 간단한 파이썬 프로그램을 하나 짜서 실행해 보자. ****.py로 저장한다. 플러그인 메뉴안에 들어가 보면 'NppExec' 이 추가되어 있다. '플러그인 -> NppExec -> Execute'를 클릭한다..

앱인벤터로 앱을 .여러개 만들다 보면 어느 순간 숫자 정렬에 관한 문제에 마주치게 된다. 점수를 계산한다든지, 돈을 누가 많이 내야 하는지 등등 여러가지 상황에서 숫자를 정렬해야 하는 문제에 마주치게 되는 것이다. 오름차순으로 정렬하건, 내림차순으로 정렬하건 상관없이 숫자를 정렬해야 하는 문제에 마주치게 되면 골머리를 썩히게 된다. 숫자정렬(sorting)에 관한 문제는 앱인벤터 뿐만 아니라 다른 랭귀지에서도 중요한 문제로 부각되는데 이는 정렬 알고리즘이라는 한 부분의 챕터가 마련되어 있을 정도로 중요한 파트이기 때문이다. 주요 정렬 방법론으로는 비교정렬, 제자리 정렬, 온라인 정렬등 3가지 방법론이 존재하는데 각 방법론 마다 따로 저명한 정렬 알고리즘이 존재한다. 일반 스크립트 코딩에서는 반복문이나 루..

6.설정아이콘의 사용법 앱인벤터 블록들을 보면 블록 좌측 상단에 ☸모양의 파란색 설정 아이콘이 있다. 이 아이콘은 블록의 항목을 더 추가할 수 있도록 하는 아이콘이다. 공통 블록안에 있는 각 세부 블록들은 위의 설정 아이콘을 가지고 있는 것들이 여러개 있다. 이 블록들은 필요에 따라 블록의 인수나 항목을 더 추가해 줄 수 있는 것이다. 설정 아이콘을 클릭하면 항목을 더 추가할 수 있는 도구가 열린다. 필요한 만큼 항목을 더 추가한다. 문자열 또한 얼마든지 더 추가할 수 있다. 7.블록 정리하기 앱인벤터의 단점이 코딩이 길어지다 보면 각각의 블록들이 여기저기 흩어져 있어서 화면이 산만해지기 일쑤라는 것이다. 이때 각 블록들을 보기 좋게 정리해 주는 기능이 있다. '가로로 배열하기', '세로로 배열하기', ..

앱인벤터는 노코드로 작업하는 여러 코딩 방식 중에서 가장 쉽게 앱을 만들어 구글 플레이 스토어에 출시까지 할 수 있는 플랫폼이다. 현재 중고등학교 뿐 만 아니라 대학교에서도 앱인벤터 열풍이 대단한 것으로 알고 있다. 오늘은 앱인벤터를 사용하면 부딪히게 되는 여러가지 사소하지만 꼭 알아야 하는 코딩팁에 대해서 알아보겠다. 1.세부 블록 여러개 한번에 삭제하기 이벤트 블록안에 많은 수의 블록들이 들어 있다. 이중 몇개만 제외하고 나머지 전부를 지워야 하는 경우에 어떻게 할까? 몇개 되지 않을 때는 하나씩 선택해서 delete키를 눌러 지우면 된다. 그러나 그 숫자가 많다면 시간을 좀 많이 투자해야 할 것이다. 이럴때 많은 수의 블록을 한번에 지우는 방법이 있다. 함수에서 함수 만들기 블록을 하나 꺼내서 배치..

"인생은 짧다. 파이썬을 쓰세요."라는 말이 있다. 그만큼 파이썬이 쉽고 많은 수고를 줄여 준다는 말일 것이다. 이번 시간에는 파이썬으로 폴더를 쉽게 생성, 제거하고 그 안의 파일까지 지우는 방법에 대해서 알아보겠다. 다른 랭귀지로 이런 프로그램을 만든다면 아마 10여줄의 코드를 작성해야 되겠지만 파이썬에서는 단 2줄이면 된다. 1. 폴더 생성 아직 필자가 만들고 싶은 폴더가 없는 드라이브 사진이다. 이 드라이브에 "testFolder"라는 폴더를 만들어 볼 것이다. 정말 단 2줄이면 된다. OS에서 makedirs라는 라이브러리를 import한다. 여기서 주의할 점은 makedirs라는 것이다. makedir이 아니므로 s를 꼭 붙이자. s를 붙이지 않으면 에러가 발생한다. testFolder가 생성되..

1. 2007년 애플의 아이폰 등장 2007년 스티브 잡스가 아이폰을 들고 새로운 혁신의 탄생을 선언하고 난 후 지난 15년동안 스마트폰은 놀라운 발전을 거듭해 오고 있다. 애플은 IOS 운영체제를 발표하면서 objective-C 로 만든 아이폰용 앱을 출시 할 수 있는 앱스토어를 만들었고 그 후 1년여 뒤 구글도 자바를 기반으로 하는 안드로이드 운영체계를 발표하면서 안드로이드용 앱을 판매할 수 있는 구글 플레이를 만들었다. 그후 수많은 기업들이 이 앱시장에 뛰어들었지만 10년이 훌쩍 지난 지금 아직도 살아남아 있는 곳은 안드로이드와 IOS 둘 뿐이라고 해도 과언이 아니다. 애플과 구글은 각자의 앱 생태계에 맞는 새로운 언어를 만들기 위해 노력해 왔다. 애플은 초창기 objective-C에서 스위프트로 ..

웹뷰어는 앱인벤터로 인터넷을 연결할 수 있게 해 주는 컴포넌트이다. 코딩을 어떻게 하느냐에 따라 앱을 켜자마자 인터넷에 연결되게 할 수 도 있고 버튼을 클릭하면 연결되게 할 수도 있다. 이번 강좌에서는 버튼을 누르면 해당하는 인터넷 사이트에 연결되게 하는 앱을 만들어 보자. 사용자 인터페이스에서 웹뷰어 컴포넌트를 끌어내 화면중앙에 가져다 놓는다. 그리고 하단에 수평배치 레이아웃을 하나 가져다 두고 그 안에 버튼과 레이블을 배치한다. 버튼에는 연결하기 원하는 홈페이지의 이름을 적어준다. 앱을 켜자 마자 인터넷에 연결되게 하려면 컴포넌트창의 웹뷰어1의 속성 중 '홈 URL'에 해당 인터넷의 URL을 적어주면 된다. 앱이 시동될 때 바로 인터넷에 연결되게 하고 싶으면 위의 첫 블록처럼 '언제 Screen1. ..

이번 시간은 앱인벤터2 왕초보 강좌 14번째 시간으로 시간 선택버튼(TimePicker)의 사용법에 대해서 알아보겠다. 시간 선택 버튼을 클릭하고 원하는 시간을 셋팅하면 개발자가 원하는 부분에 그 시간이 표시되는 앱을 만들어 보자. 다음 그림과 같이 디자이너 에디터 화면을 구성한다. 사용자 인터페이스에서 '날짜 선택 버튼'을 끌어다 뷰어 창의 핸드폰 화면 중앙에 놓는다. 그리고 '시간 선택 버튼' 아래에다 레이아웃 항목안에 있는 수평배치 블록을 세개 끌어다 놓는다. 그리고 수평배치 블록 안에 레이블을 끼워 넣어서 위와 같은 배치를 만든다. 레이블들의 이름을 보면 '시_레이블'과 '분_레이블'이 있다. 검은선 위아래의 시, 분 레이블의 이름을 1, 2로 구분 했다. 수평 배치 레이아웃과 수직 배치 레이아웃..

스위치는 말그대로 전기를 켜고 꺼듯이 On과 Off 의 두가지 상태를 나타내는 것이다. 이 두가지의 상태에 따라 각각의 용도와 내용을 설정하고 이용할 수 있다. 우리가 스위치를 가장 많이 보는 것이 계약서의 동의를 구하는 칸일 것이다. 처음에는 Off 상태에 있다가 동의 한다는 표시로 스위치를 클릭하면 On 상태가 되면서 녹색으로 색깔이 변하는 것을 많이 보았을 것이다. 이번 시간에는 스위치의 사용법에 대해 자세히 알아보자. 먼저 다음 그림과 같은 디자이너 화면을 구성하자. 이번 앱은 우리가 많이 보는 계약서의 동의를 요구하는 상황을 가정해 보고 스위치의 상태를 하단에 글자로 나타낼 것이다. 사용자 인터페이스에서 스위치를 드래그 드랍방식으로 스마트폰 중앙에 배치한다. 레이블들을 위아래에 두어서 스위치의 ..