안드로이드스터디 7

  • 6,252 views
Uploaded on

 

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
No Downloads

Views

Total Views
6,252
On Slideshare
0
From Embeds
0
Number of Embeds
0

Actions

Shares
Downloads
69
Comments
0
Likes
2

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. 0. 그래픽과 애니메이션
    • 이번 장에서는 안드로이드 응용프로그램에서 그래픽과 애니메이션을 그리고 움직이는 방법에 대해 이야기 한다 .
    • 커스텀 View 클래스를 만든 뒤 Canvas 와 Paint 를 이용하여 도형 , 텍스트 , 애니메이션을 화면에 그리는 방법을 주로 이야기한다 .
    • - 안드로이드는 PNG 나 JPG 같은 그래픽 이미지와 텍스트 , 그리고 기본 도형들을 화면에 그리는 수단을 제공함
    • 그려진 도형들은 다양한 색상과 스타일 , 그래디언트를 적용할 수 있다 .
    • 표준적인 이미지 변환 기능들을 적용해서 표시물의 형태와 모습을 변환하는 것도 가능
    • 표시물들을 시간에 따라 움직이고 변형함으로써 애니메이션을 구현할 수 도 있다 .
    • Canvas 란 ?
    • Android.graphics.Canvas
    • Canvas 는 화면의 직사각형 영역에 이미지 , 텍스트 , 도형을 그리는 메서드들을 제공 .
    • Canvas 가 나타내는 화면 공간의 크기는 Canvas 를 담은 컨테이너 뷰에 의해 결정된다 .
    • 구체적인 크기는 getHeight(), getWidth() 메서드로 알아낼 수 있다 .
    • Ex)
  • 2. 0. 그래픽과 애니메이션
    • Paint 란 ?
    • Android.graphics.Paint
    • 안드로이드에서 Paint 가 단지 색상 값만 담고 있는것은 아니고 Paint 클래스는 스타일과 복합 색 및 랜더링 정보를 캡슐화 함 .
    • 그러한 정보는 그래픽이나 도형 , 특정한 글꼴 (Typeface) 이 지정된 텍스트에 적용할 수 있다 .
    • 색상설정
    • Paint 객체의 현재 색상을 설정하는 데 쓰임 .
    • 정수로 표현된 색상 값을 받음 (android.graphics.Color 클래스에 정의되어 있음 )
    • 안티앨리어싱 설정
    • 그래픽 ( 도형 또는 글꼴 ) 이 화면에 좀 더 매끄럽게 나타나도록 하는 기술 .
    • 표시물에 안티앨리어싱이 적용되는지의 여부는 그 표시물을 그리는 데 쓰이는 Paint 설정의 의해 결정
    • 스타일 설정
    • Paint 의 스타일은 표시물 내부를 색으로 채우는 방식을 결정함 .
    • 아래 예의 방식은 STROKE 로 설정하게 되면 표시물의 외곽선만 나타나고 색이 채워지지 않는다 (default 타입 )
  • 3. 1. 화면에 그래픽 등록 1-0. 화면에 그래픽을 등록해보자 화면에 뭔가를 그리려면 유효한 Canvas 가 있어야 하므로 보통은 으용프로그램을 위한 커스텀 뷰 (View 파생클래스 ) 를 만들고 그 뷰의 onDraw() 메서드를 구현함으로써 유효한 Canvas 를 얻는다 . ViewWithRedDot 이라는 간단한 View 하위 클래스를 만들어서 onDraw() 메서드로 뷰의 모습을 결정해보자 . - Activity 클래스의 onCreate() 에서 이 뷰를 활동의 화면으로 설정 - 등록 < 결과화면 >
  • 4. 1. 화면에 그래픽 등록
    • 그래디언트 설정
    • 그래디언트는 여러 색들이 매끄럽게 변화된 모습을 보여준다 .
    • 안드로이드에서 제공되는 그래디언트 표현 클래스 Android.graphics.shader 에서 파생된 LinearGradient, RadialGradient, SweepGradient
    • 그래디언트는 적어도 두 개 이상의 색을 지정해줘야 함 ( 시작과 끝 ). 배열에 담긴 셋 이상의 색상들을 사용하는 것도 있다 . 반복 설정도 가능 .
    • 선형 그래디언트를 위한 LinearGradient
    • 색이 직선을 따라 변하는 것을 선형 그래디언트라고 함 .
    • -> LinearGradient 객체를 인수로 해서 Paint 의 setshader() 메서드를 호출하고 그 Paint 로 Cavas 에 표시물을 그리면 됨 .
    • 2. 방사상 그래디언트를 위한 RadialGradient
    • 색이 한 점에서 시작해서 사방으로 변해 가는 것을 방사상 (radial) 그래디언트라고 함 .
    • -> RadialGradient 객체를 인수로 해서 Paint 의 setShader() 메서드를 호출하고 그 Paint 로 Cavas 에 표시물을 그리면 됨 .
    • 3. 쓸기 그래디언트를 위한 SweepGradient
    • 한 점에 고정된 막대를 원형으로 쓸 듯이 움직이면서 색상을 변하게 하는 것을 쓸기 (Sweep) 그래디언트라고 함 .
    • -> SweepGradiant 객체를 인수로 해서 Paint 의 setShader() 메서드를 호출하고 그 Paint 로 Canvas 에 표시물을 그리면 됨 .
  • 5. 1. 화면에 그래픽 등록 1-1. LinearGradient 위쪽 원이 선형 그래디언트가 적용된 것이다 . ( 빨간 색에서 검은 색 , 반사 적용됨 ) 등록 < 결과화면 >
  • 6. 1. 화면에 그래픽 등록 1-2. RadialGradient 작은 원이 방사상 그래디언트가 적용된 것이다 . ( 녹색에서 검은색으로 ) 등록 < 결과화면 >
  • 7. 1. 화면에 그래픽 등록 1-3. SweepGradient 아래쪽 원이 쓸기 그래디언트가 적용된 것이다 . ( 빨강 , 노랑 , 녹색 , 파랑 , 주황으로 변한다 ) 등록 < 결과화면 >
  • 8. 2. 비트맵 이미지 다루기 Android.graphics 패키지에는 비트맵 이미지들에 관련된 수많은 편의 수단들이 들어있다 . 비트맵을 다루는데 있어 핵심적인 클래스는 android.graphics.Bitmap 이다 . 그리고 객체 Factory 관리를 위한 BitmapFactory 클래스가 있다 . BitmapFactory 는 여러가지 이미지 포맷을 decode 해서 Bitmpa 으로 변환하는 함수들로 되어 있는데 그 이름들은 decodeXXX 로 되어 있어서 쉽게 원하는 기능의 함수들을 찾을 수 있다 . 1. Canvas 에 비트맵 이미지 그리기 BitmapFactory.decodeResource() – Resource 폴더에 저장된 그림파일을 Bitmap 으로 만들어 리턴해준다 . 객체명 .drawBitmap() – 캔버스 객체에 해당 Bitmap 객체를 그려준다 . 2. 비트맵 이미지의 확대 , 축소 Bitmap.createScaledBitmap( 객체명 , 크기 , 크기 , 옵션 ) – 비트맵 이미지의 확대 축소 + 비트맵 이미지의 종횡 비를 유지하고 싶다면 getWidth() 와 getHeight 로 너비 , 높이를 얻고 그에 따른 비례비율을 조절해야 함 . 3. 변환 행렬을 이용한 비트맵 변환 Matrix 를 클래스를 이용하여 Bitmap 객체를 다양한 방식으로 변환 할 수 있다 . MirrorMatrix.preScale(x 축 , y 축 ) – 반사되는 이미지 축 객체명 .preRotate( 각도크기 ) – 이미지 회전 4. 메모리 해제 다 사용한 Bitmap 객체는 recycle() 메서드를 호출해서 비트맵이 사용하던 메모리를 해제해 주는 것이 좋다 . 객체명 .recycle();
  • 9. 2. 비트맵 이미지 다루기 2-1. Canvas 에 비트맵 이미지 그리기 캔버스에 비트맵 이미지를 그리는 기본적인 방법은 View 의 onDraw() 메서드 안에서 여러 drawBitmap() 메서드들 중 하나를 사용하는 것 . < 결과화면 >
  • 10. 2. 비트맵 이미지 다루기 2-2. 비트맵 이미지의 확대 , 축소 이미지를 실제 크기보다 더 크게 또는 작게 그려야 할 때도 있다 . 그런 경우에는 createScaledBitmap() 메서드를 사용하면 됨 메서드 안에 들어가는 값은 ( 객체명 , x 축 확대크기 , y 축 확대크기 , 비트맵 or 안티앨리언싱 모드 ) < 결과화면 >
  • 11. 2. 비트맵 이미지 다루기 3. 변환 행렬을 이용한 비트맵 변환 Matrix 를 클래스를 이용하여 Bitmap 객체를 다양한 방식으로 변환 할 수 있다 . 다음은 createBitmap() 메서드에 적절한 반사 (mirror) 변환 행렬을 적용해서 , 원본 비트맵 ( 앞에서 생상한 pic) 의 좌우가 뒤집힌 Bitmap 객체를 생성 및 반사와 함께 회전하는 객체를 설정하는 예이다 . < 결과화면 >
  • 12. 3. 도형 다루기 직사각형이나 원 같은 기본 도형들을 직접 정의해서 캔버스에 그리는 것도 가능하다 . ShapeDrawable 클래스와 Shape 의 여러 파생 클래스들을 이용하면 되는데 , XML 자원 파일에서 PaintDrawable 표시물을 정의해 도형을 만들 수도 있지만 , 어느 정도 복잡한 도형들은 코드에서 직접 정의하는 것이 일반적이다 . 1. 도형 표시물을 XML 자원으로 정의하기 (1) 원 , 혹은 직사각형 같은 기본 도형들을 사용하기 위해서는 /res/drawable/ 디렉터리에 XML 자원 파일을 생성하여 만들어야 한다 . (2) 다음은 이 도형자원을 코드에 적재한다 . (3) 마지막으로 그것을 main.xml 혹은 사용하고자 하는 xml 파일의 ImageView 위젯에 표시한다 . 2. 도형 표시물을 코드에서 직접 정의하기 도형 표시물을 코드에서 정의하려면 특정 도형 클래스 (android.graphics.drawable.shapes 에 다양한 도형클래스가 있음 ) 의 인스턴스를 인수로 해서 ShapeDrawable 객체를 생성해야 한다 . (1) 코드에 ShapeDrawable 객체 생성한 뒤 옵션을 셋팅한다 ( 색깔 등 ) (2) ImageView 에 설정하면 된다 .
  • 13. 3. 도형 다루기 3-1. 도형 표시물을 XML 자원으로 정의하기 생성 < 코드 > <main.xml> <Green_rect.xml> < 결과화면 >
  • 14. 3. 도형 다루기
    • 3-2. 도형 표시물을 코드에서 직접 정의하기
    • Android.graphics.drawable.shapes 패키지가 제공하는 도형들로는 다음과 같은 것들이 있다 .
    • 직사각형 및 정사각형
    • 모서리가 둥근 직사각형
    • 원 및 타원
    • 원호와 직선들
    • 그 외의 경로 기반 무정형 도형들
    • 위 도형들은 표시물 자원으로서 ImageView 위젯 안에 표시 할 수도 있고 ,
    • Canvas 의 여러 메서드들을 이용해서 화면에 직접 그릴 수 있음 .
  • 15. 3. 도형 다루기 3-2. 도형 표시물을 코드에서 직접 정의하기 3-2-1. 직사각형 및 정사각형 < 결과화면 >
  • 16. 3. 도형 다루기 3-2. 도형 표시물을 코드에서 직접 정의하기 3-2-2. 동근 모서리 직사각형 그리기 < 결과화면 >
  • 17. 3. 도형 다루기 3-2. 도형 표시물을 코드에서 직접 정의하기 3-2-3. 내부가 비어 있는 동근 모서리 직사각형 그리기 < 결과화면 >
  • 18. 3. 도형 다루기 3-2. 도형 표시물을 코드에서 직접 정의하기 3-2-4. 타원과 원 그리기 OvalShape 자체에는 크기 속성들이 없다 . 타원의 크기는 OvalShape 가 담긴 컨테이너 ( 현재는 ShapeDrawable) 에 의해 결정됨 색상 등의 일부 속성들은 ShapeDrawable 의 Paint 객체를 얻어 그 Paint 객체의 메서드로 설정해야 한다 . < 결과화면 >
  • 19. 3. 도형 다루기 3-2. 도형 표시물을 코드에서 직접 정의하기 3-2-5. 원호 그리기 팩맨이나 파이 그래프 같은 원호 (arc) 도형은 ArcShpae 객체를 인수로 주어서 생상한 ShapeDrawable 에 해당한다 . ArcShape 의 생성자는 원호의 시작각도를 결정하는 매개변수 startAngle 과 반지름 선분이 쓸고가는 각도를 결정하는 매개변수 sweepAnagle 을 받는다 . Startangle 은 세시방향 ( 양의 X 축 ) 이 기준이다 . sweepAngle 이 양수이면 시계방향 음수이면 반시계방향으로 만들어진다 . 0 과 360 으로 설정하면 원이 된다 . < 결과화면 >
  • 20. 3. 도형 다루기 3-2. 도형 표시물을 코드에서 직접 정의하기 3-2-6. 경로 도형 그리기 이상의 기본 도형들에 해당하지 않는 비정형 도형을 만들고 싶다면 일련의 직선 , 곡선 선분들로 도형의 외곽선을 직접 정의해야 한다 . 그러한 도형을 만드는 데 사용할 수 있는 것이 “경로”를 나타내는 android.graphics.Path 이다 . < 결과화면 >