SlideShare a Scribd company logo
1 of 41
JAVA, Android 스터디
2015.06.09
김희준
1
2
참조 프로젝트 : SampleRelativeLayout
다운로드 : easyspub.com
실행화면
①
③
②
④
⑤
⑥
0. 지난주 복습
3
참조 프로젝트 : SampleRelativeLayout
다운로드 : easyspub.com
Activity_main.xml에서 버튼 3개 생성(리니어 레이아웃)
①
0. 지난주 복습
4
참조 프로젝트 : SampleRelativeLayout
다운로드 : easyspub.com
Nomal.xml 소스
새로운 텍스트뷰 1개 생성
Layout_alignparentTop
설정으로 텍스트뷰가
상단에 위치하게 됨
Layout_marginTop 설정
으로 20dp떨어진 상단에
텍스트뷰 생성
④
0. 지난주 복습
5
참조 프로젝트 : SampleLayout
다운로드 : easyspub.com
실행화면
①
②
③
0. 지난주 복습
6
참조 프로젝트 : SampleLayout
다운로드 : easyspub.com
테이블 레이아웃에선
TableRow태그를 이용
열을 추가
하나의 열에 여러가지
뷰가 들어갈 수 있음
이름과 나이를 보여
주는 텍스트 뷰를 생성
Table_layout.xml 소스
2개의 텍스트뷰를 추가하는 부분
①
②
0. 지난주 복습
7
참조 프로젝트 : SampleScrollView
다운로드 : easyspub.com
실행화면
0. 지난주 복습
8
참조 프로젝트 : SampleLayout
다운로드 : easyspub.com
HorizontalScrollView는
수평 스크롤을 위한 뷰
그 안에 있는 Scrollview는
수직 스크롤을 위한 뷰
수평 스크롤 뷰 안에
이미지 뷰가 생성 되
이미지가 화면보다
클 경우 스크롤이
가능해짐
Activity_main.xml 소스
스크롤바 생성/설정을 위한 부분
0. 지난주 복습
9
참조 프로젝트 : SampleFrameLayout
다운로드 : easyspub.com0. 지난주 복습
10
참조 프로젝트 : SampleFrameLayout
다운로드 : easyspub.com
프레임 레이아웃 내에
이미지 뷰를 2개 생성
실제로 보이는 것은 1개의
뷰이고 이는 visibility를
통해 설정 가능
0. 지난주 복습
11
참조 교재 : Do it! 안드로이드 앱 프로그래밍
1. 텍스트 뷰(TextView)
- 화면을 구성할 때 가장 많이 사용
- 주요 속성 : text, textColor, textSize,
textSyle, typeface(기본문자 표시),
singleLine(한줄 표시)
2. 버튼(Button)
- 위젯에서 발생하는 이벤트 처리에 유용
- 체크박스, 라디오 버튼도 버튼의 속성을 가짐
- ImageButton태그로 버튼에 이미지 추가 가능
- 관련 메소드 : public boolean isChecked()
public void setChecked(boolean checked)
public void toggle() 등
0. 지난주 복습
12
참조 교재 : Do it! 안드로이드 앱 프로그래밍
3. 에디트텍스트
- 사용자의 입력을 받기에 용이, 복/붙 등 기본기능 지원
- 포커스가 설정되면 키패드가 화면에 나타남
- hint속성을 이용하면 안내글이 출력됨
4. 이미지뷰
- 이미지를 화면에 보여주기에 유용
- 주요 속성 : src(이미지 설정), maxWidTh/Height(최대크기설정)
- tint(반투명 색상 적용), scaleType(확대/축소 비율)
0. 지난주 복습
13
참조 교재 : Do it! 안드로이드 앱 프로그래밍
ㅁ 자바에서는 Graphics라는 클래스가 존재
- 하위 클래스 : Canvas, Paint, Bitmap, Drawable 등
- Canvas : 뷰의 표면에 직접 그릴 수 있게 만들어주는
객체와 이를 위한 메소드 정의
- Paint : 그래픽 그리기를 위해 필요한 색상 등의 속성을 담음
- Bitmap : 픽셀로 구성된 이미지로 메모상에 그래픽을 그림
- Drawable : 사각형, 이미지 등의 그래픽 요소가 객체로 정의
ㅁ 그래픽 그리기 순서
- 1단계 : 새로운 클래스를 만들고 뷰를 상속 받기
- 2단계 : 페인트 객체를 초기화하고 필요한 속성 설정
- 3단계 : onDraw() 메소드 내에 사각형을 그리는 메소드 호출
- 4단계 : onTouch() 메소드 내에 터치 이벤트를 처리하는 코드 작성
- 5단계 : 새로만든 뷰를 메인 액티비티에 추가
1. 그래픽
14
참조 교재 : Do it! 안드로이드 앱 프로그래밍1. 그래픽
1단계 : 새로운 클래스를 만들고 뷰를 상속 받기
CustomView를 MainActivity가 있는 폴더에 만듬
새로운 CustomView 클래스에서 View클래스를
정의, Context 객체 하나를 파라미터로 전달받는
생성자로 정의
페인트 객체에는 그래픽을 그리기 위해 필요한
속성을 가짐, 선언된 페인트 객체의 속성 중
색상을 빨간색으로 설정
2단계 : 페인트 객체를 초기화하고 필요한 속성 설정
15
참조 교재 : Do it! 안드로이드 앱 프로그래밍1. 그래픽
3단계 : onDraw() 메소드 내에 사각형을 그리는 메소드 호출
onDraw 메소드는 뷰가 화면에 디스플레이
될 때 자동으로 호출되며, 따라서 해당
메소드 안에 캔버스 객체에 있는 메소드중
자신이 그리기 원하는 것을 골라서 그림
16
참조 교재 : Do it! 안드로이드 앱 프로그래밍1. 그래픽
4단계 : onTouch() 메소드 내에 터치 이벤트를 처리하는 코드 작성
onTouch()는 터치 이벤트를 처리하
는 일반적인 방법을 제공하며, 현재
보이는 코드는 터치한 횟수와, 터치
한 곳의 X,Y좌표를 토스트 메시지로
보여주게 하는 부분
17
참조 교재 : Do it! 안드로이드 앱 프로그래밍1. 그래픽
5단계 : 새로만든 뷰를 메인 액티비티에 추가
MainActivity의 코드, 새로 만든 Custom
View클래스를 new연산자를 사용해
메인 액티비티에 추가
18
1. 그래픽
참조 프로젝트 : SampleCustomView
다운로드 : easyspub.com
실행화면
19
2. 그래픽 그리기
참조 프로젝트 : SampleCustomViewStyle
다운로드 : easyspub.com
실행화면
20
2. 그래픽 그리기
참조 프로젝트 : SampleCustomViewStyle
다운로드 : easyspub.com
첫번째 사각형을 그림
채우기 색상은 빨간색으로 설정
ㅁ 사각형 그리기
21
2. 그래픽 그리기
참조 프로젝트 : SampleCustomViewStyle
다운로드 : easyspub.com
첫번째 사각형의 테두리 설정
초록색으로 사각형의 테두리 그림
ㅁ 사각형 그리기
22
2. 그래픽 그리기
참조 프로젝트 : SampleCustomViewStyle
다운로드 : easyspub.com
두번째 사각형을 그림
채우기 색상은 파란색으로 설정
ㅁ 사각형 그리기
23
2. 그래픽 그리기
참조 프로젝트 : SampleCustomViewStyle
다운로드 : easyspub.com
첫번째 사각형의 테두리 설정
초록색으로 사각형의 테두리 그림
DashPathEffect로 점선 테두리 설정
ㅁ 사각형 그리기
24
2. 그래픽 그리기
참조 프로젝트 : SampleCustomViewStyle
다운로드 : easyspub.com
ㅁ 원 그리기
첫번째 원 그리기
Canvas객체의 drawCircle메소드를
이용해 원을 그립니다.
두번째 원 그리기
Canvas객체의 drawCircle메소드를
이용해 원을 그립니다.
setAntiAlias속성값을 Ture로 줄경우
원이 부드럽게 그려집니다.
25
2. 그래픽 그리기
참조 프로젝트 : SampleCustomViewStyle
다운로드 : easyspub.com
첫번재 텍스트
Stroke스타일로 설정
두번재 텍스트
Fill스타일로 설정
ClipRect는 그리기 가 일어나는 영역
을 설정하는 메소드
26
3. 페인트 보드 만들기
참조 프로젝트 : PaintBoard
다운로드 : easyspub.com
실행화면
버전1 버전2 버전3
27
3. 페인트 보드 만들기
ㅁ 버전 1
소스코드가 너무 길어 그리는 부분만 분석
X, Y좌표를 구하는 변수 선언
참조 프로젝트 : PaintBoard
다운로드 : easyspub.com
28
3. 페인트 보드 만들기
ㅁ 버전 1
소스코드가 너무 길어 그리는 부분만 분석
터치한 후 뗄 때 좌표 초기화
참조 프로젝트 : PaintBoard
다운로드 : easyspub.com
29
3. 페인트 보드 만들기
ㅁ 버전 1
소스코드가 너무 길어 그리는 부분만 분석
터치할 때 눌린 좌표를 기준으로
선을 그림
참조 프로젝트 : PaintBoard
다운로드 : easyspub.com
30
3. 페인트 보드 만들기
터치 한 상태에서 움직일 경우
계속해서 선을 그림
ㅁ 버전 1
참조 프로젝트 : PaintBoard
다운로드 : easyspub.com
31
3. 페인트 보드 만들기
Invlidate메소드로 화면을 다시 그림
ㅁ 버전 1
참조 프로젝트 : PaintBoard
다운로드 : easyspub.com
PaintBoard.java 코드
32
3. 페인트 보드 만들기
ㅁ 버전 2(색상)
새로 정의한 객체에 리스너 설정
참조 프로젝트 : PaintBoard
다운로드 : easyspub.com
GoodPaintActivity.java 코드
33
3. 페인트 보드 만들기
ㅁ 버전 2(색상)
ColorPaletteDialog 대화상자 띄우기
GoodPaintActivity.java 코드
참조 프로젝트 : PaintBoard
다운로드 : easyspub.com
34
3. 페인트 보드 만들기
참조 프로젝트 : PaintBoard
다운로드 : easyspub.com
ㅁ 버전 2(색상)
ColorPaletteDialog 클래스 코드
레이아웃의 grid객체 참조
35
3. 페인트 보드 만들기
참조 프로젝트 : PaintBoard
다운로드 : easyspub.com
ㅁ 버전 2(색상)
ColorPaletteDialog 클래스 코드
객체에 대한 속성 설정
36
3. 페인트 보드 만들기
참조 프로젝트 : SampleCustomView
다운로드 : easyspub.com
ㅁ 버전 2(색상)
21개의 색상 지정
ColordataAdapter의 코드
7X3 의 그리드 레이아웃
37
3. 페인트 보드 만들기
참조 프로젝트 : SampleCustomView
다운로드 : easyspub.com
ㅁ 버전 2(색상)
색상값을 정수형 배열로 저장
38
3. 페인트 보드 만들기
참조 프로젝트 : SampleCustomView
다운로드 : easyspub.com
ㅁ 버전 2(색상)
getView메소드 안에서 각 아이템을
버튼으로 만든 후 저장
39
4. 과제
참조 프로젝트 : SampleCustomView
다운로드 : easyspub.com
1. 색상선택 부분 복습
2. 펜 굵기/지우개 부분 스터디 후 발표(다음시간)
3. 버전2와 버전 3의 다른점 찾기 + 버전3에서 추가된 내용 발표
Q & A
40
Thank you!!
41

More Related Content

Similar to Java, android 스터티8

센차 터치2 시작하기 | Devon 2012
센차 터치2 시작하기 | Devon 2012센차 터치2 시작하기 | Devon 2012
센차 터치2 시작하기 | Devon 2012Daum DNA
 
양재혁 포트폴리오 입니다.
양재혁 포트폴리오 입니다.양재혁 포트폴리오 입니다.
양재혁 포트폴리오 입니다.Jeahurk Yang
 
Project Anarchy(Vision Engine)으로 게임 툴 만들기! part1
Project Anarchy(Vision Engine)으로 게임 툴 만들기! part1Project Anarchy(Vision Engine)으로 게임 툴 만들기! part1
Project Anarchy(Vision Engine)으로 게임 툴 만들기! part1진상 문
 
안드로이드스터디 7
안드로이드스터디 7안드로이드스터디 7
안드로이드스터디 7jangpd007
 
1.Create Project Sunshine - 시온고등학교 안드로이드 스터디
1.Create Project Sunshine - 시온고등학교 안드로이드 스터디1.Create Project Sunshine - 시온고등학교 안드로이드 스터디
1.Create Project Sunshine - 시온고등학교 안드로이드 스터디Youngbin Han
 
안드로이드스터디 1
안드로이드스터디 1안드로이드스터디 1
안드로이드스터디 1jangpd007
 
Matplotlib 기초 이해하기_20160730
Matplotlib 기초 이해하기_20160730Matplotlib 기초 이해하기_20160730
Matplotlib 기초 이해하기_20160730Yong Joon Moon
 
Sencha touch2-sdk-tools-window
Sencha touch2-sdk-tools-windowSencha touch2-sdk-tools-window
Sencha touch2-sdk-tools-windowByoung Do Ahn
 
[NEXT] Android 개발 경험 프로젝트 5일차 (Actionbar, SideNavigation)
[NEXT] Android 개발 경험 프로젝트 5일차 (Actionbar, SideNavigation)[NEXT] Android 개발 경험 프로젝트 5일차 (Actionbar, SideNavigation)
[NEXT] Android 개발 경험 프로젝트 5일차 (Actionbar, SideNavigation)YoungSu Son
 
[QGIS] 수치지도를 이용한 DEM 생성과 지형분석
[QGIS] 수치지도를 이용한 DEM 생성과 지형분석[QGIS] 수치지도를 이용한 DEM 생성과 지형분석
[QGIS] 수치지도를 이용한 DEM 생성과 지형분석MinPa Lee
 
6th.lecture.personal.assignment.guideline
6th.lecture.personal.assignment.guideline6th.lecture.personal.assignment.guideline
6th.lecture.personal.assignment.guidelineJeongeun Kwon
 
Java, android 스터티7
Java, android 스터티7Java, android 스터티7
Java, android 스터티7Heejun Kim
 
Make a shooting game using unity
Make a shooting game using unityMake a shooting game using unity
Make a shooting game using unityHyunwoo Kim
 
JavaScript Profiling With The Chrome Developer Tools_SYS4U I&C
JavaScript Profiling With The Chrome Developer Tools_SYS4U I&CJavaScript Profiling With The Chrome Developer Tools_SYS4U I&C
JavaScript Profiling With The Chrome Developer Tools_SYS4U I&Csys4u
 
예제를 통해 쉽게_살펴보는_뷰제이에스
예제를 통해 쉽게_살펴보는_뷰제이에스예제를 통해 쉽게_살펴보는_뷰제이에스
예제를 통해 쉽게_살펴보는_뷰제이에스Dexter Jung
 
Sencha touch2-sdk-tools-mac
Sencha touch2-sdk-tools-macSencha touch2-sdk-tools-mac
Sencha touch2-sdk-tools-macByoung Do Ahn
 
코히런트 Gt(coherent gt) 통합 및 간단한 사용법
코히런트 Gt(coherent gt) 통합 및 간단한 사용법코히런트 Gt(coherent gt) 통합 및 간단한 사용법
코히런트 Gt(coherent gt) 통합 및 간단한 사용법Kiyoung Moon
 

Similar to Java, android 스터티8 (20)

센차 터치2 시작하기 | Devon 2012
센차 터치2 시작하기 | Devon 2012센차 터치2 시작하기 | Devon 2012
센차 터치2 시작하기 | Devon 2012
 
양재혁 포트폴리오 입니다.
양재혁 포트폴리오 입니다.양재혁 포트폴리오 입니다.
양재혁 포트폴리오 입니다.
 
Project Anarchy(Vision Engine)으로 게임 툴 만들기! part1
Project Anarchy(Vision Engine)으로 게임 툴 만들기! part1Project Anarchy(Vision Engine)으로 게임 툴 만들기! part1
Project Anarchy(Vision Engine)으로 게임 툴 만들기! part1
 
안드로이드스터디 7
안드로이드스터디 7안드로이드스터디 7
안드로이드스터디 7
 
1.Create Project Sunshine - 시온고등학교 안드로이드 스터디
1.Create Project Sunshine - 시온고등학교 안드로이드 스터디1.Create Project Sunshine - 시온고등학교 안드로이드 스터디
1.Create Project Sunshine - 시온고등학교 안드로이드 스터디
 
안드로이드스터디 1
안드로이드스터디 1안드로이드스터디 1
안드로이드스터디 1
 
Matplotlib 기초 이해하기_20160730
Matplotlib 기초 이해하기_20160730Matplotlib 기초 이해하기_20160730
Matplotlib 기초 이해하기_20160730
 
Sencha touch2-sdk-tools-window
Sencha touch2-sdk-tools-windowSencha touch2-sdk-tools-window
Sencha touch2-sdk-tools-window
 
[NEXT] Android 개발 경험 프로젝트 5일차 (Actionbar, SideNavigation)
[NEXT] Android 개발 경험 프로젝트 5일차 (Actionbar, SideNavigation)[NEXT] Android 개발 경험 프로젝트 5일차 (Actionbar, SideNavigation)
[NEXT] Android 개발 경험 프로젝트 5일차 (Actionbar, SideNavigation)
 
[QGIS] 수치지도를 이용한 DEM 생성과 지형분석
[QGIS] 수치지도를 이용한 DEM 생성과 지형분석[QGIS] 수치지도를 이용한 DEM 생성과 지형분석
[QGIS] 수치지도를 이용한 DEM 생성과 지형분석
 
6th.lecture.personal.assignment.guideline
6th.lecture.personal.assignment.guideline6th.lecture.personal.assignment.guideline
6th.lecture.personal.assignment.guideline
 
Java, android 스터티7
Java, android 스터티7Java, android 스터티7
Java, android 스터티7
 
Make a shooting game using unity
Make a shooting game using unityMake a shooting game using unity
Make a shooting game using unity
 
Designing Apps for Motorla Xoom Tablet
Designing Apps for Motorla Xoom TabletDesigning Apps for Motorla Xoom Tablet
Designing Apps for Motorla Xoom Tablet
 
JavaScript Profiling With The Chrome Developer Tools_SYS4U I&C
JavaScript Profiling With The Chrome Developer Tools_SYS4U I&CJavaScript Profiling With The Chrome Developer Tools_SYS4U I&C
JavaScript Profiling With The Chrome Developer Tools_SYS4U I&C
 
Php report
Php reportPhp report
Php report
 
8장 editor
8장 editor8장 editor
8장 editor
 
예제를 통해 쉽게_살펴보는_뷰제이에스
예제를 통해 쉽게_살펴보는_뷰제이에스예제를 통해 쉽게_살펴보는_뷰제이에스
예제를 통해 쉽게_살펴보는_뷰제이에스
 
Sencha touch2-sdk-tools-mac
Sencha touch2-sdk-tools-macSencha touch2-sdk-tools-mac
Sencha touch2-sdk-tools-mac
 
코히런트 Gt(coherent gt) 통합 및 간단한 사용법
코히런트 Gt(coherent gt) 통합 및 간단한 사용법코히런트 Gt(coherent gt) 통합 및 간단한 사용법
코히런트 Gt(coherent gt) 통합 및 간단한 사용법
 

More from Heejun Kim

Java, android 스터티6
Java, android 스터티6Java, android 스터티6
Java, android 스터티6Heejun Kim
 
Java, android 스터티5
Java, android 스터티5Java, android 스터티5
Java, android 스터티5Heejun Kim
 
SSM 참고자료
SSM 참고자료SSM 참고자료
SSM 참고자료Heejun Kim
 
Java, android 스터티4
Java, android 스터티4Java, android 스터티4
Java, android 스터티4Heejun Kim
 
Java, android 스터티4
Java, android 스터티4Java, android 스터티4
Java, android 스터티4Heejun Kim
 
Java, android 스터티2
Java, android 스터티2Java, android 스터티2
Java, android 스터티2Heejun Kim
 

More from Heejun Kim (6)

Java, android 스터티6
Java, android 스터티6Java, android 스터티6
Java, android 스터티6
 
Java, android 스터티5
Java, android 스터티5Java, android 스터티5
Java, android 스터티5
 
SSM 참고자료
SSM 참고자료SSM 참고자료
SSM 참고자료
 
Java, android 스터티4
Java, android 스터티4Java, android 스터티4
Java, android 스터티4
 
Java, android 스터티4
Java, android 스터티4Java, android 스터티4
Java, android 스터티4
 
Java, android 스터티2
Java, android 스터티2Java, android 스터티2
Java, android 스터티2
 

Java, android 스터티8

  • 2. 2 참조 프로젝트 : SampleRelativeLayout 다운로드 : easyspub.com 실행화면 ① ③ ② ④ ⑤ ⑥ 0. 지난주 복습
  • 3. 3 참조 프로젝트 : SampleRelativeLayout 다운로드 : easyspub.com Activity_main.xml에서 버튼 3개 생성(리니어 레이아웃) ① 0. 지난주 복습
  • 4. 4 참조 프로젝트 : SampleRelativeLayout 다운로드 : easyspub.com Nomal.xml 소스 새로운 텍스트뷰 1개 생성 Layout_alignparentTop 설정으로 텍스트뷰가 상단에 위치하게 됨 Layout_marginTop 설정 으로 20dp떨어진 상단에 텍스트뷰 생성 ④ 0. 지난주 복습
  • 5. 5 참조 프로젝트 : SampleLayout 다운로드 : easyspub.com 실행화면 ① ② ③ 0. 지난주 복습
  • 6. 6 참조 프로젝트 : SampleLayout 다운로드 : easyspub.com 테이블 레이아웃에선 TableRow태그를 이용 열을 추가 하나의 열에 여러가지 뷰가 들어갈 수 있음 이름과 나이를 보여 주는 텍스트 뷰를 생성 Table_layout.xml 소스 2개의 텍스트뷰를 추가하는 부분 ① ② 0. 지난주 복습
  • 7. 7 참조 프로젝트 : SampleScrollView 다운로드 : easyspub.com 실행화면 0. 지난주 복습
  • 8. 8 참조 프로젝트 : SampleLayout 다운로드 : easyspub.com HorizontalScrollView는 수평 스크롤을 위한 뷰 그 안에 있는 Scrollview는 수직 스크롤을 위한 뷰 수평 스크롤 뷰 안에 이미지 뷰가 생성 되 이미지가 화면보다 클 경우 스크롤이 가능해짐 Activity_main.xml 소스 스크롤바 생성/설정을 위한 부분 0. 지난주 복습
  • 9. 9 참조 프로젝트 : SampleFrameLayout 다운로드 : easyspub.com0. 지난주 복습
  • 10. 10 참조 프로젝트 : SampleFrameLayout 다운로드 : easyspub.com 프레임 레이아웃 내에 이미지 뷰를 2개 생성 실제로 보이는 것은 1개의 뷰이고 이는 visibility를 통해 설정 가능 0. 지난주 복습
  • 11. 11 참조 교재 : Do it! 안드로이드 앱 프로그래밍 1. 텍스트 뷰(TextView) - 화면을 구성할 때 가장 많이 사용 - 주요 속성 : text, textColor, textSize, textSyle, typeface(기본문자 표시), singleLine(한줄 표시) 2. 버튼(Button) - 위젯에서 발생하는 이벤트 처리에 유용 - 체크박스, 라디오 버튼도 버튼의 속성을 가짐 - ImageButton태그로 버튼에 이미지 추가 가능 - 관련 메소드 : public boolean isChecked() public void setChecked(boolean checked) public void toggle() 등 0. 지난주 복습
  • 12. 12 참조 교재 : Do it! 안드로이드 앱 프로그래밍 3. 에디트텍스트 - 사용자의 입력을 받기에 용이, 복/붙 등 기본기능 지원 - 포커스가 설정되면 키패드가 화면에 나타남 - hint속성을 이용하면 안내글이 출력됨 4. 이미지뷰 - 이미지를 화면에 보여주기에 유용 - 주요 속성 : src(이미지 설정), maxWidTh/Height(최대크기설정) - tint(반투명 색상 적용), scaleType(확대/축소 비율) 0. 지난주 복습
  • 13. 13 참조 교재 : Do it! 안드로이드 앱 프로그래밍 ㅁ 자바에서는 Graphics라는 클래스가 존재 - 하위 클래스 : Canvas, Paint, Bitmap, Drawable 등 - Canvas : 뷰의 표면에 직접 그릴 수 있게 만들어주는 객체와 이를 위한 메소드 정의 - Paint : 그래픽 그리기를 위해 필요한 색상 등의 속성을 담음 - Bitmap : 픽셀로 구성된 이미지로 메모상에 그래픽을 그림 - Drawable : 사각형, 이미지 등의 그래픽 요소가 객체로 정의 ㅁ 그래픽 그리기 순서 - 1단계 : 새로운 클래스를 만들고 뷰를 상속 받기 - 2단계 : 페인트 객체를 초기화하고 필요한 속성 설정 - 3단계 : onDraw() 메소드 내에 사각형을 그리는 메소드 호출 - 4단계 : onTouch() 메소드 내에 터치 이벤트를 처리하는 코드 작성 - 5단계 : 새로만든 뷰를 메인 액티비티에 추가 1. 그래픽
  • 14. 14 참조 교재 : Do it! 안드로이드 앱 프로그래밍1. 그래픽 1단계 : 새로운 클래스를 만들고 뷰를 상속 받기 CustomView를 MainActivity가 있는 폴더에 만듬 새로운 CustomView 클래스에서 View클래스를 정의, Context 객체 하나를 파라미터로 전달받는 생성자로 정의 페인트 객체에는 그래픽을 그리기 위해 필요한 속성을 가짐, 선언된 페인트 객체의 속성 중 색상을 빨간색으로 설정 2단계 : 페인트 객체를 초기화하고 필요한 속성 설정
  • 15. 15 참조 교재 : Do it! 안드로이드 앱 프로그래밍1. 그래픽 3단계 : onDraw() 메소드 내에 사각형을 그리는 메소드 호출 onDraw 메소드는 뷰가 화면에 디스플레이 될 때 자동으로 호출되며, 따라서 해당 메소드 안에 캔버스 객체에 있는 메소드중 자신이 그리기 원하는 것을 골라서 그림
  • 16. 16 참조 교재 : Do it! 안드로이드 앱 프로그래밍1. 그래픽 4단계 : onTouch() 메소드 내에 터치 이벤트를 처리하는 코드 작성 onTouch()는 터치 이벤트를 처리하 는 일반적인 방법을 제공하며, 현재 보이는 코드는 터치한 횟수와, 터치 한 곳의 X,Y좌표를 토스트 메시지로 보여주게 하는 부분
  • 17. 17 참조 교재 : Do it! 안드로이드 앱 프로그래밍1. 그래픽 5단계 : 새로만든 뷰를 메인 액티비티에 추가 MainActivity의 코드, 새로 만든 Custom View클래스를 new연산자를 사용해 메인 액티비티에 추가
  • 18. 18 1. 그래픽 참조 프로젝트 : SampleCustomView 다운로드 : easyspub.com 실행화면
  • 19. 19 2. 그래픽 그리기 참조 프로젝트 : SampleCustomViewStyle 다운로드 : easyspub.com 실행화면
  • 20. 20 2. 그래픽 그리기 참조 프로젝트 : SampleCustomViewStyle 다운로드 : easyspub.com 첫번째 사각형을 그림 채우기 색상은 빨간색으로 설정 ㅁ 사각형 그리기
  • 21. 21 2. 그래픽 그리기 참조 프로젝트 : SampleCustomViewStyle 다운로드 : easyspub.com 첫번째 사각형의 테두리 설정 초록색으로 사각형의 테두리 그림 ㅁ 사각형 그리기
  • 22. 22 2. 그래픽 그리기 참조 프로젝트 : SampleCustomViewStyle 다운로드 : easyspub.com 두번째 사각형을 그림 채우기 색상은 파란색으로 설정 ㅁ 사각형 그리기
  • 23. 23 2. 그래픽 그리기 참조 프로젝트 : SampleCustomViewStyle 다운로드 : easyspub.com 첫번째 사각형의 테두리 설정 초록색으로 사각형의 테두리 그림 DashPathEffect로 점선 테두리 설정 ㅁ 사각형 그리기
  • 24. 24 2. 그래픽 그리기 참조 프로젝트 : SampleCustomViewStyle 다운로드 : easyspub.com ㅁ 원 그리기 첫번째 원 그리기 Canvas객체의 drawCircle메소드를 이용해 원을 그립니다. 두번째 원 그리기 Canvas객체의 drawCircle메소드를 이용해 원을 그립니다. setAntiAlias속성값을 Ture로 줄경우 원이 부드럽게 그려집니다.
  • 25. 25 2. 그래픽 그리기 참조 프로젝트 : SampleCustomViewStyle 다운로드 : easyspub.com 첫번재 텍스트 Stroke스타일로 설정 두번재 텍스트 Fill스타일로 설정 ClipRect는 그리기 가 일어나는 영역 을 설정하는 메소드
  • 26. 26 3. 페인트 보드 만들기 참조 프로젝트 : PaintBoard 다운로드 : easyspub.com 실행화면 버전1 버전2 버전3
  • 27. 27 3. 페인트 보드 만들기 ㅁ 버전 1 소스코드가 너무 길어 그리는 부분만 분석 X, Y좌표를 구하는 변수 선언 참조 프로젝트 : PaintBoard 다운로드 : easyspub.com
  • 28. 28 3. 페인트 보드 만들기 ㅁ 버전 1 소스코드가 너무 길어 그리는 부분만 분석 터치한 후 뗄 때 좌표 초기화 참조 프로젝트 : PaintBoard 다운로드 : easyspub.com
  • 29. 29 3. 페인트 보드 만들기 ㅁ 버전 1 소스코드가 너무 길어 그리는 부분만 분석 터치할 때 눌린 좌표를 기준으로 선을 그림 참조 프로젝트 : PaintBoard 다운로드 : easyspub.com
  • 30. 30 3. 페인트 보드 만들기 터치 한 상태에서 움직일 경우 계속해서 선을 그림 ㅁ 버전 1 참조 프로젝트 : PaintBoard 다운로드 : easyspub.com
  • 31. 31 3. 페인트 보드 만들기 Invlidate메소드로 화면을 다시 그림 ㅁ 버전 1 참조 프로젝트 : PaintBoard 다운로드 : easyspub.com PaintBoard.java 코드
  • 32. 32 3. 페인트 보드 만들기 ㅁ 버전 2(색상) 새로 정의한 객체에 리스너 설정 참조 프로젝트 : PaintBoard 다운로드 : easyspub.com GoodPaintActivity.java 코드
  • 33. 33 3. 페인트 보드 만들기 ㅁ 버전 2(색상) ColorPaletteDialog 대화상자 띄우기 GoodPaintActivity.java 코드 참조 프로젝트 : PaintBoard 다운로드 : easyspub.com
  • 34. 34 3. 페인트 보드 만들기 참조 프로젝트 : PaintBoard 다운로드 : easyspub.com ㅁ 버전 2(색상) ColorPaletteDialog 클래스 코드 레이아웃의 grid객체 참조
  • 35. 35 3. 페인트 보드 만들기 참조 프로젝트 : PaintBoard 다운로드 : easyspub.com ㅁ 버전 2(색상) ColorPaletteDialog 클래스 코드 객체에 대한 속성 설정
  • 36. 36 3. 페인트 보드 만들기 참조 프로젝트 : SampleCustomView 다운로드 : easyspub.com ㅁ 버전 2(색상) 21개의 색상 지정 ColordataAdapter의 코드 7X3 의 그리드 레이아웃
  • 37. 37 3. 페인트 보드 만들기 참조 프로젝트 : SampleCustomView 다운로드 : easyspub.com ㅁ 버전 2(색상) 색상값을 정수형 배열로 저장
  • 38. 38 3. 페인트 보드 만들기 참조 프로젝트 : SampleCustomView 다운로드 : easyspub.com ㅁ 버전 2(색상) getView메소드 안에서 각 아이템을 버튼으로 만든 후 저장
  • 39. 39 4. 과제 참조 프로젝트 : SampleCustomView 다운로드 : easyspub.com 1. 색상선택 부분 복습 2. 펜 굵기/지우개 부분 스터디 후 발표(다음시간) 3. 버전2와 버전 3의 다른점 찾기 + 버전3에서 추가된 내용 발표