用view绘制六边形能力值自定义控件

项目中需要用到六边形的显示来个人的能力值，笔者简单的写了一个控件。

主要类的实现代码如下

这个类没有写绘制画笔颜色的set方法，都是在XML里面配置使用

 package keyword.hexagon;

import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Paint.FontMetrics;
import android.graphics.Path;
import android.graphics.Point;
import android.util.AttributeSet;
import android.view.View;

public class SixangleView extends View {

	private float[] params = new float[6];

	private Point[][] points;

	private Point[] pointsabilty = new Point[6];

	private int color1 = Color.rgb(51, 205, 207);

	private Paint paint, paint1, paint2, painttxt;

	private int radius = 250;
	
	private int textsize = 40;

	private static final double  Pai = 3.1415926;
	CharSequence[] str ;

	public SixangleView(Context context, AttributeSet attrs) {
		super(context, attrs);
		init(context,attrs);
		// TODO Auto-generated constructor stub
	}
	
	 
	private void init(Context mContext, AttributeSet attrs) {
		
		TypedArray a = mContext.obtainStyledAttributes(attrs,R.styleable.SixangleView);
		
		points = new Point[5][6];
		paint = new Paint();
		paint.setAntiAlias(true);
        paint.setColor(color1);

		paint1 = new Paint();
		paint1.setStyle(Paint.Style.FILL);
		paint1.setAntiAlias(true);


		paint2 = new Paint();
		paint2.setStyle(Paint.Style.FILL);
		paint2.setAntiAlias(true);
		for (int i = 0; i < 6; i++) {
			pointsabilty[i] = new Point();
		}
		painttxt = new Paint();
		painttxt.setAntiAlias(true);
		painttxt.setColor(Color.WHITE);
		
		painttxt.setTextSize(a.getDimension(R.styleable.SixangleView_txtSize, textsize));
        paint.setColor(a.getColor(R.styleable.SixangleView_sixangle_edgecolor,color1));
        paint1.setColor(a.getColor(R.styleable.SixangleView_sixangle_fillcolor,Color.argb(60, 51, 205, 207)));
        paint2.setColor(a.getColor(R.styleable.SixangleView_sixangle_secondfillcolor,Color.argb(180, 255, 126, 39)));


        str= a.getTextArray(R.styleable.SixangleView_sixangle_strarray);
<pre name="code" class="java"> SixangleView sixangleView =(SixangleView)findViewById(R.id.sixangleview);
        sixangleView.setData("8","4","7","7","3","8");

在attrs自定义属性

<?xml version="1.0" encoding="utf-8"?>
<resources>
     <declare-styleable name="SixangleView">
        <!--文字的大小 --!>
        <attr name="txtSize" format="dimension" />
        <!--绘制线条的颜色 --!>
        <attr name="sixangle_edgecolor" format="color" />
        <!--第一层填充的颜色 --!>
        <attr name="sixangle_fillcolor" format="color" />
         <!--第二层填充的颜色 --!>
        <attr name="sixangle_secondfillcolor" format="color" />
         <!--能力值的数组字符串 --!>
        <attr name="sixangle_strarray" format="reference" />
    </declare-styleable>
</resources>

XML布局中使用

注意:填充的颜色值要设置好透明度，不然没有图中的效果，透明度可以看我demo中给出的透明度，当然根据项目需求设置

<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:sixangle="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:padding="16dp"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/background_material_dark"
    tools:context=".MainActivity">

    <keyword.hexagon.SixangleView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/sixangleview"
        sixangle:sixangle_edgecolor="@android:color/holo_blue_dark"
        sixangle:sixangle_fillcolor="@color/sixangle_fillcolor"
        sixangle:sixangle_secondfillcolor="@color/sixangle_secondfillcolor"
        sixangle:sixangle_strarray="@array/points"
        />

</RelativeLayout>

接着就是Activity初始化你的数据

 SixangleView sixangleView =(SixangleView)findViewById(R.id.sixangleview);
        sixangleView.setData("8","4","7","7","3","8");

填充的能力值最大是10，顺序根据你String写的str的数据的顺序。

<?xml version="1.0" encoding="utf-8"?>
<resources>

    <string name="app_name">Hexagon</string>
    <string name="hello_world">Hello world!</string>
    <string name="action_settings">Settings</string>
    <string-array name="points">
        <item>跑步</item>
        <item>篮球</item>
        <item>游泳</item>
        <item>台球</item>
        <item>撩妹</item>
        <item>牛牛</item>
    </string-array>

</resources>

源码下载的地址：https://github.com/MikeJon/Hexagon