Android自定义控件之自定义Text,画出米字格-FenGKun

/**
 * 带米字的TextView
 * 
 * @author FenGKun
 *
 */

创建WordText类继承TextView，这里会利用画笔来进行描绘，自定义一个样式，用作背景

并在布局文件中调用

public class WordText extends TextView {
	
	<span style="color:#ff6666;">/** 画笔 */
	private Paint paint = new Paint();  // 定义画笔</span>
	
	public WordText(Context context) {
		super(context);
		init(null);
	}
	
	public WordText(Context context, AttributeSet attrs) {
		super(context, attrs);
		init(attrs);
	}
	
	public WordText(Context context, AttributeSet attrs, int defStyle) {
		super(context, attrs, defStyle);
		init(attrs);
	}
	
	private void init(AttributeSet attrs) {
		// 初始化画笔
		<span style="color:#ff6666;">paint.setAntiAlias(true);
		paint.setStyle(Paint.Style.STROKE);  // STROKE不填充，FILL填充，.FILL_AND_STROKE设置线条的样式,把空心线填满
		PathEffect effects = new DashPathEffect(new float[]{5, 5, 5, 5}, 1);
		paint.setPathEffect(effects);</span>
		
		// 根据用户配置的参数设置米字的颜色
		if (attrs != null) {
			TypedArray typedArray = getContext().obtainStyledAttributes(attrs, R.styleable.WordText);
            
           <span style="color:#ff6666;"> <span style="white-space:pre">	</span>// 获取米字背景颜色，并设置到UI
            <span style="white-space:pre">	</span>int iDottedLineColor = typedArray.getColor(R.styleable.WordText_DottedLineColor, Color.RED);
            <span style="white-space:pre">	</span>paint.setColor(iDottedLineColor);</span>
            
            <span style="white-space:pre">	</span>boolean isKaiTi = typedArray.getBoolean(R.styleable.WordText_IsKaiTi, false);
            <span style="white-space:pre">	</span>// 设置字体为楷体
            <span style="white-space:pre">	</span>if (isKaiTi) {
                setTypeface(MyApplication.m_tfSTKaiTi);
            <span style="white-space:pre">	</span>}
            
			typedArray.recycle();
		}
		else {
			paint.setColor(Color.RED);
		}
	}
	
	<span style="white-space:pre">	</span>@Override
	<span style="white-space:pre">	</span>protected void onDraw(Canvas canvas) {
		<span style="color:#ff6666;">// 字大小与控件高的比例计算出字体的大小（单位像素）
        <span style="white-space:pre">	</span>setTextSize(TypedValue.COMPLEX_UNIT_PX, getHeight() * 0.67f);</span>
		
		// 左上至右下线
		drawDottedLine(0, 0, getWidth(), getHeight(), canvas);
		// 纵向线
		drawDottedLine(getWidth() / 2, 0, getWidth() / 2, getHeight(), canvas);
		// 右上至坐下
		drawDottedLine(getWidth(), 0, 0, getHeight(), canvas);
		// 水平线
		drawDottedLine(0, getHeight() / 2, getWidth(), getHeight() / 2, canvas);
		
		super.onDraw(canvas);
	}
	
	<span style="white-space:pre">	</span><span style="color:#ff6666;">/**
	<span style="white-space:pre">	</span> * 画虚线
	<span style="white-space:pre">	</span> */</span>
	<span style="white-space:pre">	</span>private void drawDottedLine(int startX, int startY, int endX, int endY, Canvas canvas) {
		Path path = new Path();
		path.moveTo(startX, startY);
		path.lineTo(endX, endY);
		canvas.drawPath(path, paint);
	}
	
}

自定义样式

<?xml version="1.0" encoding="utf-8"?>
<!-- 白色边框 -->
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle" >
    <!-- 填充颜色 -->
    <solid android:color="#00FFFFFF" />
    <!-- 边框：破折线的宽度为dashWith，破折线之间的空隙的宽度为dashGap，当dashGap=0dp时，为实线 -->
    <stroke android:dashWidth="4dp" android:dashGap="0dp" android:width="1dp" android:color="#fff" />
    <!-- 虚线的高度 -->
    <size android:height="1dp" />
</shape>

布局文件中调用

<?xml version="1.0" encoding="utf-8"?>
<!-- 字：学习 -->
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
   <span style="color:#ff6666;"> xmlns:mc="http://schemas.android.com/apk/res/com.miisi.nc.magicchinese"</span>
    android:id="@+id/parent"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:background="#232187" >
<span style="white-space:pre">			</span><!-- 带米线背景的字 -->
	                    <<span style="color:#ff6666;">com.miisi.nc.magicchinese.view.WordText</span> android:id="@+id/tvWord"
	                        android:layout_width="0dp"
	                        android:layout_height="match_parent"
	                        android:layout_weight="223"
	                       <span style="color:#ff6666;"> mc:DottedLineColor="#FFF"
	                        mc:IsKaiTi="true"</span>
	                        android:text="日"
	                        android:textSize="120dp"
	                        android:textColor="#fff"
	                        android:gravity="center"
	                        android:background="@drawable/bg_style_frame_white_no_solid"
	                        />
</RelativeLayout>