로그인 바로가기 하위 메뉴 바로가기 본문 바로가기
난이도
심화

안드로이드 앱 프로그래밍

임시 이미지 정재곤
http://www.boostcourse.org/mo316/notice/2603
좋아요 1436 수강생 20099
아래의 글은 BOOSTER 서포터즈로 활동했던 bmj0***님이
작성한 부스트코스 후기입니다.
여러분들의 성원에 더 노력하는 부스트코스가 되겠습니다.
감사합니다.
******************************************
1)링크: https://blog.naver.com/bmj0178/221818756913
2)작성날짜: 20/02/21
<본문작성>

오늘의 강의 https://www.edwith.org/boostcourse-android/lecture/17054/

[LECTURE] 1) 나인패치 이미지 : edwith

들어가기 전에 뷰의 배경으로 이미지를 설정할 때 이해해야 하는 내용으로 나인패치 이미지라는 것이 있습니다. 나인패치 이미지가 어떤 것인지 살펴봅시다.     학습 목표 나인패치 이... - 부스트코스

www.edwith.org

[LECTURE] 2) 비트맵 버튼 만들기 : edwith

들어가기 전에 안드로이드의 SDK에는 다양한 위젯들이 들어 있습니다. 대표적인 것으로 버튼이나 텍스트뷰를 들 수 있죠. 그런데 버튼의 모양을 조금 바꾸고 싶어도 버튼에서 사용할 수... - 부스트코스

www.edwith.org


1) 나인패치 이미지


나인패치 이미지란?

- 이미지가 뷰의 배경으로 설정될 때 뷰의 크기에 자동으로 맞춰지는데, 이러한 경우 이미지의 일부분이 깨져보일 수 있다.

- 이를 방지하기 위해

원래 이미지보다 한 픽셀씩 크게 만들고 가장자리 픽셀에는 늘어날 수 있는지, 늘어나면 안 되는지를 색상으로 구분하여 넣어진 이미지

- 나인패치 이미지를 구분하기 위하여 이미지 파일 이름에 .9 라는 글자를 붙여준다.

나인패치 이미지(아래의 button_image_02.9)

-파일명 마지막에 .9를 붙인다.

-가장자리 픽셀은 늘어나면 안되므로 검은색 선으로 표시되어있지 않고, 그 외 모서리 부분은 늘어나도 되므로 검은색으로 표시되어 있다.

나인패치 이미지("button_image_02") vs. 이미지("button_image_01")

- 같은 모양의 두개의 이미지를 가로 길이를 300dp 로 늘렸을 때

<ImageView android:layout_width="300dp" android:background="@drawable/button_image_01"/><ImageView android:layout_width="300dp" android:background="@drawable/button_image_02"

- 결과 : 이미지는 가장자리가 깨졌지만, 나인패치 이미지는 깨지지 않았다.

2) 비트맵 버튼 만들기

● 버튼의 배경에 이미지를 설정하고 그 버튼이 눌렸을 때 배경 이미지를 다르게 보여주고 싶다면 버튼을 상속해서 새로운 버튼을 만들 수 있다.

● 4개의 파일 (※xml->화면, java->기능)

(4)BitmapButton.java

**project>java>org.techtown.button(프로젝트가 생성된 파일)>오른쪽클릭해서 new>java class

> superclass 로 AppCompatButton 을 상속

1. 생성자 만들기 (필수 생성자 2개)

오른쪽클릭>generate>constructor>AppCompatBuuton(context:Context), ~(~,attrs:AttributeSet)

- init(context) 추가

public BitmapButton(Context context) { super(context); init(context); } public BitmapButton(Context context, AttributeSet attrs) { super(context, attrs); init(context); }

2. init() 함수 만들기

- context 객체 받음

- background를 normal 로 지정

- setTextSize를 textSize 변수로 지정

- 컬러 지정

private void init(Context context) { setBackgroundResource(R.drawable.title_bitmap_button_normal); float textSize = getResources().getDimension(R.dimen.text_size); // text_size를 가져오기 위해 xml파일 생성해야 함 setTextSize(textSize); setTextColor(Color.WHITE); }

3. 이미지 터치시 다른 이미지로 변하는 버튼을 구현하기 위하여 onTouchEvent 설정

@Override public boolean onTouchEvent(MotionEvent event) { int action = event.getAction(); // 이벤트의 현재상황을 받는다. switch(action){ case MotionEvent.ACTION_DOWN: // action_down일 시 clicked 이미지 setBackgroundResource(R.drawable.title_bitmap_button_clicked); break; case MotionEvent.ACTION_UP: // action_up일 시 normal 이미지 setBackgroundResource(R.drawable.title_bitmap_button_normal); break; } invalidate(); //화면을 다시 그리게 됨 return true; }

(2)dimens.xml

- text_size의 크기 설정

<resources> <dimen name="text_size">16dp</dimen> </resources>

(3)activity_main.xml

- button tag를 bitmapbutton으로 해주고 패키지 이름까지 넣어준다.

<org.techtown.button.BitmapButton/>
*********************************************