Stroke TextView 만들기

TextView 에 Stroke 효과 를 주기 위해 TextView 를 상속한 Custom TextView 를 만들었다.

캡처한 이미지

1. stroke 효과 주는 방법

참고: http://stackoverflow.com/questions/1723846/how-do-you-draw-text-with-a-border-on-a-mapview-in-android

설명:
먼저 위 사이트에서 Paint 에 stroke 값을 주는 방법을 알수 있었다.
다음 TextView 의 Paint 를 얻는 방법을 알아냈다.
 - TextView 에는 getPaint() 함수가 있다.
이제 TextView 의 onDraw 함수를 override 하고 Paint 에 stroke 스타일을 적용하여 한번 그림을 그리고 Paint 에 style 을 돌려놓고 그림을 다시 그리면 stroke 효과를 줄 수 있다.

예제:

	
@Override
protected void onDraw(Canvas canvas) {

	ColorStateList states = getTextColors(); // text color 값 저장

	// stroke 그리기
	getPaint().setStyle(Style.STROKE);
	getPaint().setStrokeWidth(2.0f);
	setTextColor(strokeColor);
	super.onDraw(canvas);

	// stroke 위에 그리기
	getPaint().setStyle(Style.FILL);
	setTextColor(states);
	super.onDraw(canvas);
}

2. Stroke TextView 사용

참고:
custom attribute: http://blog.pocketjourney.com/2008/05/02/android-tutorial-42-passing-custom-variables-via-xml-resource-files/


순서:
1) TextView 를 상속한 CustomTextView 라는 storke 효과를 주는 클래스를 만들었다.
2) xml 에서 stroke 속성값을 줄 수 있게 res/values/attrs.xml 파일에 속성값을 추가해 줬다.
3) layout xml 파일에서 CustomtextView 를 사용했다.

코드:
1) CustomTextView.java

package com.tj.test;

import android.content.Context;
import android.content.res.ColorStateList;
import android.content.res.TypedArray;
import android.graphics.Canvas;
import android.graphics.Paint.Style;
import android.util.AttributeSet;
import android.widget.TextView;

public class CustomTextView extends TextView {
	
	private boolean stroke = false;
	private float strokeWidth = 0.0f;
	private int strokeColor;

	public CustomTextView(Context context, AttributeSet attrs, int defStyle) {
		super(context, attrs, defStyle);
		
		initView(context, attrs);
	}

	public CustomTextView(Context context, AttributeSet attrs) {
		super(context, attrs);
		
		initView(context, attrs);
	}

	public CustomTextView(Context context) {
		super(context);
	}
	
	private void initView(Context context, AttributeSet attrs) {
		TypedArray a = context.obtainStyledAttributes(attrs, R.styleable.CustomTextView);
		stroke = a.getBoolean(R.styleable.CustomTextView_textStroke, false);
		strokeWidth = a.getFloat(R.styleable.CustomTextView_textStrokeWidth, 0.0f);
		strokeColor = a.getColor(R.styleable.CustomTextView_textStrokeColor, 0xffffffff);		
	}

	@Override
	protected void onDraw(Canvas canvas) {
		
		if (stroke) {
			ColorStateList states = getTextColors();
			getPaint().setStyle(Style.STROKE);
			getPaint().setStrokeWidth(strokeWidth);
			setTextColor(strokeColor);	
			super.onDraw(canvas);
			
			getPaint().setStyle(Style.FILL);
			setTextColor(states);
		}
		
		super.onDraw(canvas);
	}
}

2) res/values/attrs.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
	<declare-styleable name="CustomTextView">
		<attr format="boolean" name="textStroke"/>
		<attr format="float" name="textStrokeWidth"/>
		<attr format="color" name="textStrokeColor"/>
	</declare-styleable> 
</resources>

3) layout 에 적용

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
	xmlns:android="http://schemas.android.com/apk/res/android"
	xmlns:tj="http://schemas.android.com/apk/res/com.tj.test"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    >
<com.tj.test.CustomTextView
 	android:id="@+id/CustomTextView"
   	android:layout_width="fill_parent"
   	android:layout_height="wrap_content"
   	android:text="Hello World"
   	android:textColor="#ffffffff"
   	android:singleLine="true"
   	tj:textStroke="true"
   	tj:textStrokeWidth="7.0"
   	tj:textStrokeColor="#ffff0000"
   	>
   	</com.tj.test.CustomTextView>
</LinearLayout>