CustomView #1 CustomView란? 그리고 만들어보기

뷰는 안드로이드에서 기본이 되는 근간이라고 할 수가 있다. 안드로이드는 뷰를 통해서 화면에 데이터를 표현한다.

뷰의 예는 TextView, ImageView, Button 등을 예로 들수가 있다.

이런 여러 뷰들이 있는데. CustomView는 무엇이며 왜 만들어서 사용하는 것인가?

CustomView란?

커스텀 뷰는 말 그대로 개발자가 필요에 의해서 새롭게 만든 뷰를 의미한다. 예로 들자면 캐릭터가 그려진 TextView,

여러 이미지가 겹쳐진 View, 증권 시장에 데이터를 표현하고자 하는 뷰등이다.

커스텀 뷰를 제작하는 이유는 기존에 안드로이드가 지원하는 뷰만으로는 개발자가 의도한대로 데이터를 표현하기 어려울 경우가 있기 때문에 사용한다. 도저히 증권시장에서 사용하는 그래프등은 절대로 안드로이드에서 지원하는 기존의 뷰만으로는 무리가 있는게 분명할 것이다.

커스텀 뷰의 KeyPoint

1. 생성자는 3개를 만든다.

2. onDraw 함수를 통해서 그래픽을 그린다.

3. onMeasure 함수를 통해서 뷰의 크기를 결정한다.

4. 커스텀 속성을 attrs파일을 통해서 정의한다.

1. 생성자는 3개로 만든다.

public MyView(Context context) { super(context); this.context = context; init(null); } public MyView(Context context, @Nullable AttributeSet attrs) { super(context, attrs); this.context= context; init(attrs); } public MyView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) { super(context, attrs, defStyleAttr); this.context= context; init(attrs); }

생성자는 무조건 3개로 오버라이딩을 해야된다. 자바코드로만 커스텀뷰를 사용한다면 생성자를 1개 만들어도 상관이 없는데. 보통은 xml파일을 통해서 커스텀뷰를 사용한다. 그런데 xml파일로 커스텀뷰를 만들경우 어떤 생성자를 사용할지 모르기 때문에 생성자를 3개씩 만들어서 안드로이드가 어떤 생성자를 참조해야되는지 명확하게 할 필요가 있다.

2. onDraw 함수를 통해서 그래픽을 그린다.

@Override protected void onDraw(Canvas canvas) { }

onDraw함수를 오버라이딩해서 커스텀뷰의 표현을 꾸밀 수가 있다. 여기 매개변수에 canvas 변수가 있는데 이 객체를 통해 그래픽을 그릴 수가 있다. 

3. onMeasure 함수를 통해서 뷰의 크기를 결정한다.

@Override protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) { }

onMeasure 함수를 통해서 xml에서 설정한 모드 및 크기를 받아서 멋스러운 커스텀 뷰를 만들 수가 있다. 자칫 뷰의 크기를 자바 코드에서 결정을 해주지 않는다면 xml에서 wrap_content, match_parent , 100dp 처럼 지정해도 절대로 원하는 크기대로 표현할 수가 없다.

4. 커스텀 속성을 attrs파일을 통해서 정의한다.

우리는 xml에서 뷰의 속성을 정의한다. 크기에 대한 속성으론 android:layout_width , android:layout_height 등을 예로 들수가 있겠다. 커스텀 뷰에도 우리가 넣고자 하는 커스텀 속성을 추가 할 수가 있다. 커스텀 속성이란 즉 xml 파일에서 새로운 뷰의 속성을 의미한다.

커스텀 속성을 정의하기 위해 attrs.xml 파일을 만들고 커스텀 속성에 대한 정의를 해준 뒤 자바코드에서 값을 받아내면 된다.

<resources> <declare-styleable name="MyView"> <attr name="customTextColor" format="color"/> </declare-styleable> </resources>

attr.xml

if(attrs != null){ TypedArray a = context.obtainStyledAttributes(attrs, R.styleable.MyView); textColor = a.getColor(R.styleable.MyView_customTextColor, Color.RED); }

커스텀 속성을 값으로 받는 자바코드