admin管理员组文章数量:1026989
LOL英雄战力效果【五星战力分析】5星
大概效果这样
代码如下：
/*** Create by Mazhanzhu on 2020/10/12* LOL英雄战斗力效果*/
public class LOLview extends View {public static final String TAG = "LOLview";private int n; //边的数量或者能力的个数private float R; //最外圈的半径，顶点到中心点的距离private int intervalCount; //间隔数量，就把半径分为几段private float angle; //两条顶点到中线点的线之间的角度private Paint linePaint; //画线的笔private Paint textPaint; //画文字的笔private int viewHeight; //控件宽度private int viewWidth; //控件高度private ArrayList<AbilityBean> data = new ArrayList<>(); //元数据private ArrayList<ArrayList<PointF>> pointsArrayList = new ArrayList<>(); //存储多边形顶点数组的数组private ArrayList<PointF> abilityPoints = new ArrayList<>(); //存储能力点的数组public LOLview(Context context) {//这地方改为this,使得不管怎么初始化都会进入第三个构造函数中this(context, null);}public LOLview(Context context, @Nullable AttributeSet attrs) {//这地方改为this,使得不管怎么初始化都会进入第三个构造函数中this(context, attrs, 0);}public LOLview(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {super(context, attrs, defStyleAttr);initSize(context);initPaint(context);}@Overrideprotected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {super.onMeasure(widthMeasureSpec, heightMeasureSpec);//设置控件的最终视图大小(宽高)setMeasuredDimension(viewWidth, viewHeight);}@Overrideprotected void onSizeChanged(int w, int h, int oldw, int oldh) {super.onSizeChanged(w, h, oldw, oldh);initSize(getContext());}@Overrideprotected void onDraw(Canvas canvas) {super.onDraw(canvas);if (data.size() > 0) {//把画布的原点移动到控件的中心点canvas.translate(viewWidth / 2, viewHeight / 2);//绘制多边形边,每一圈都绘制drawPolygon(canvas);/*** 画轮廓线* 1.先画最外面的多边形轮廓* 2.再画顶点到中心的线*/drawOutLine(canvas);//画能力线drawAbilityLine(canvas);//画能力描述的文字drawAbilityText(canvas);}}private void drawAbilityText(Canvas canvas) {canvas.save();//先计算出坐标来ArrayList<PointF> textPoints = new ArrayList<>();for (int i = 0; i < data.size(); i++) {float r = R + PxUtils.dp2pxF(getContext(), 15f);float x = (float) (r * Math.cos(i * angle - Math.PI / 2));float y = (float) (r * Math.sin(i * angle - Math.PI / 2));textPoints.add(new PointF(x, y));}//拿到字体测量器Paint.FontMetrics metrics = textPaint.getFontMetrics();for (int i = 0; i < data.size(); i++) {float x = textPoints.get(i).x;//ascent:上坡度，是文字的基线到文字的最高处的距离//descent:下坡度,，文字的基线到文字的最低处的距离float y = textPoints.get(i).y - (metrics.ascent + metrics.descent) / 2;canvas.drawText(data.get(i).name, x, y, textPaint);}canvas.restore();}private void drawAbilityLine(Canvas canvas) {canvas.save();//先把能力点初始化出来abilityPoints = new ArrayList<>();for (int i = 0; i < data.size(); i++) {float r = R * (data.get(i).num / 100.0f); //能力值/100再乘以半径就是所占的比例float x = (float) (r * Math.cos(i * angle - Math.PI / 2));float y = (float) (r * Math.sin(i * angle - Math.PI / 2));abilityPoints.add(new PointF(x, y));}linePaint.setStrokeWidth(PxUtils.dp2px(getContext(), 2f));
// linePaint.setColor(Color.parseColor("#E96153"));linePaint.setColor(Color.parseColor("#A67EA4E3"));
// linePaint.setStyle(Paint.Style.STROKE); //设置空心的linePaint.setStyle(Paint.Style.FILL); //设置实心的Path path = new Path(); //路径for (int i = 0; i < data.size(); i++) {float x = abilityPoints.get(i).x;float y = abilityPoints.get(i).y;if (i == 0) {path.moveTo(x, y);} else {path.lineTo(x, y);}}path.close(); //别忘了闭合canvas.drawPath(path, linePaint);canvas.restore();}private void drawOutLine(Canvas canvas) {canvas.save();//保存画布当前状态(平移、放缩、旋转、裁剪等),和canvas.restore()配合使用linePaint.setColor(Color.parseColor("#eef2fb"));linePaint.setStyle(Paint.Style.STROKE); //设置空心的//先画最外面的多边形轮廓Path path = new Path(); //路径for (int i = 0; i < data.size(); i++) {//只需要第一组的点float x = pointsArrayList.get(0).get(i).x;float y = pointsArrayList.get(0).get(i).y;if (i == 0) {//如果是第一个点就把path的起点设置为这个点path.moveTo(x, y);} else {path.lineTo(x, y);}}path.close(); //闭合路径canvas.drawPath(path, linePaint);//再画顶点到中心的线for (int i = 0; i < data.size(); i++) {float x = pointsArrayList.get(0).get(i).x;float y = pointsArrayList.get(0).get(i).y;canvas.drawLine(0, 0, x, y, linePaint); //起点都是中心点}canvas.restore();}private void drawPolygon(Canvas canvas) {canvas.save();//保存画布当前状态(平移、放缩、旋转、裁剪等),和canvas.restore()配合使用linePaint.setStyle(Paint.Style.FILL_AND_STROKE); //设置为填充且描边Path path = new Path(); //路径for (int i = 0; i < intervalCount; i++) { //循环、一层一层的绘制//每一层的颜色都都不同switch (i) {case 0:linePaint.setColor(Color.parseColor("#eef2fb"));break;case 1:linePaint.setColor(Color.parseColor("#dfe6f9"));break;case 2:linePaint.setColor(Color.parseColor("#ccdaf5"));break;case 3:linePaint.setColor(Color.parseColor("#b8c9f5"));break;}for (int j = 0; j < data.size(); j++) { //每一层有n个点float x = pointsArrayList.get(i).get(j).x;float y = pointsArrayList.get(i).get(j).y;if (j == 0) {//如果是每层的第一个点就把path的起点设置为这个点path.moveTo(x, y);} else {path.lineTo(x, y);}}path.close(); //设置为闭合的canvas.drawPath(path, linePaint);path.reset(); //清除path存储的路径}canvas.restore();}/*** 初始化一些固定数据** @param context*/private void initSize(Context context) {
// R = dp2pxF(context, 100); //半径暂时设为100dpintervalCount = 4; //有四层angle = (float) ((2 * Math.PI) / data.size()); //一周是2π,这里用π，因为进制的问题，不能用360度,画出来会有问题//拿到屏幕的宽高，单位是像素int screenWidth = PxUtils.getScreenWidth(context) - PxUtils.dp2px(52);//控件设置为正方向viewWidth = screenWidth;viewHeight = screenWidth / 3 * 2;R = viewWidth / 4; //半径设为宽度的三分之一}/*** 初始化画笔*/private void initPaint(Context context) {//画线的笔linePaint = new Paint(Paint.ANTI_ALIAS_FLAG);//设置线宽度linePaint.setStrokeWidth(PxUtils.dp2px(context, 1f));//画文字的笔textPaint = new Paint(Paint.ANTI_ALIAS_FLAG);textPaint.setTextAlign(Paint.Align.CENTER); //设置文字居中textPaint.setColor(Color.BLACK);textPaint.setTextSize(PxUtils.sp2pxF(context, 14f));}/*** 传入元数据*/public void setData(ArrayList<AbilityBean> list, Context context) {if (list.size() == 0) {return;}data = list;initSize(context);initPoints();//View本身调用迫使view重画invalidate();}/*** 初始化多边形的所有点 每一圈7个点，有4圈*/private void initPoints() {float x;float y;for (int i = 0; i < intervalCount; i++) {//创建一个存储点的数组ArrayList<PointF> points = new ArrayList<>();for (int j = 0; j < data.size(); j++) {float r = R * ((float) (4 - i) / intervalCount); //每一圈的半径都按比例减少//这里减去Math.PI / 2 是为了让多边形逆时针旋转90度，所以后面的所有用到cos,sin的都要减x = (float) (r * Math.cos(j * angle - Math.PI / 2));y = (float) (r * Math.sin(j * angle - Math.PI / 2));points.add(new PointF(x, y));}pointsArrayList.add(points);}}
}
怎么使用呢？使用如下：【这是我代码里面这样使用的】
其中用到了一个Bean类：
/*** 今年居然不发年终奖，哎*/
public class AbilityBean {public String name = "";//能力的名称public int num;//能力的值，范围0~100，单位%public int id;//能力的IDpublic AbilityBean(String name, int num, int id) {this.name = name;this.num = num;this.id = id;}public AbilityBean() {}
}应该就可以直接使用了
LOL英雄战力效果【五星战力分析】5星
大概效果这样
代码如下：
/*** Create by Mazhanzhu on 2020/10/12* LOL英雄战斗力效果*/
public class LOLview extends View {public static final String TAG = "LOLview";private int n; //边的数量或者能力的个数private float R; //最外圈的半径，顶点到中心点的距离private int intervalCount; //间隔数量，就把半径分为几段private float angle; //两条顶点到中线点的线之间的角度private Paint linePaint; //画线的笔private Paint textPaint; //画文字的笔private int viewHeight; //控件宽度private int viewWidth; //控件高度private ArrayList<AbilityBean> data = new ArrayList<>(); //元数据private ArrayList<ArrayList<PointF>> pointsArrayList = new ArrayList<>(); //存储多边形顶点数组的数组private ArrayList<PointF> abilityPoints = new ArrayList<>(); //存储能力点的数组public LOLview(Context context) {//这地方改为this,使得不管怎么初始化都会进入第三个构造函数中this(context, null);}public LOLview(Context context, @Nullable AttributeSet attrs) {//这地方改为this,使得不管怎么初始化都会进入第三个构造函数中this(context, attrs, 0);}public LOLview(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {super(context, attrs, defStyleAttr);initSize(context);initPaint(context);}@Overrideprotected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {super.onMeasure(widthMeasureSpec, heightMeasureSpec);//设置控件的最终视图大小(宽高)setMeasuredDimension(viewWidth, viewHeight);}@Overrideprotected void onSizeChanged(int w, int h, int oldw, int oldh) {super.onSizeChanged(w, h, oldw, oldh);initSize(getContext());}@Overrideprotected void onDraw(Canvas canvas) {super.onDraw(canvas);if (data.size() > 0) {//把画布的原点移动到控件的中心点canvas.translate(viewWidth / 2, viewHeight / 2);//绘制多边形边,每一圈都绘制drawPolygon(canvas);/*** 画轮廓线* 1.先画最外面的多边形轮廓* 2.再画顶点到中心的线*/drawOutLine(canvas);//画能力线drawAbilityLine(canvas);//画能力描述的文字drawAbilityText(canvas);}}private void drawAbilityText(Canvas canvas) {canvas.save();//先计算出坐标来ArrayList<PointF> textPoints = new ArrayList<>();for (int i = 0; i < data.size(); i++) {float r = R + PxUtils.dp2pxF(getContext(), 15f);float x = (float) (r * Math.cos(i * angle - Math.PI / 2));float y = (float) (r * Math.sin(i * angle - Math.PI / 2));textPoints.add(new PointF(x, y));}//拿到字体测量器Paint.FontMetrics metrics = textPaint.getFontMetrics();for (int i = 0; i < data.size(); i++) {float x = textPoints.get(i).x;//ascent:上坡度，是文字的基线到文字的最高处的距离//descent:下坡度,，文字的基线到文字的最低处的距离float y = textPoints.get(i).y - (metrics.ascent + metrics.descent) / 2;canvas.drawText(data.get(i).name, x, y, textPaint);}canvas.restore();}private void drawAbilityLine(Canvas canvas) {canvas.save();//先把能力点初始化出来abilityPoints = new ArrayList<>();for (int i = 0; i < data.size(); i++) {float r = R * (data.get(i).num / 100.0f); //能力值/100再乘以半径就是所占的比例float x = (float) (r * Math.cos(i * angle - Math.PI / 2));float y = (float) (r * Math.sin(i * angle - Math.PI / 2));abilityPoints.add(new PointF(x, y));}linePaint.setStrokeWidth(PxUtils.dp2px(getContext(), 2f));
// linePaint.setColor(Color.parseColor("#E96153"));linePaint.setColor(Color.parseColor("#A67EA4E3"));
// linePaint.setStyle(Paint.Style.STROKE); //设置空心的linePaint.setStyle(Paint.Style.FILL); //设置实心的Path path = new Path(); //路径for (int i = 0; i < data.size(); i++) {float x = abilityPoints.get(i).x;float y = abilityPoints.get(i).y;if (i == 0) {path.moveTo(x, y);} else {path.lineTo(x, y);}}path.close(); //别忘了闭合canvas.drawPath(path, linePaint);canvas.restore();}private void drawOutLine(Canvas canvas) {canvas.save();//保存画布当前状态(平移、放缩、旋转、裁剪等),和canvas.restore()配合使用linePaint.setColor(Color.parseColor("#eef2fb"));linePaint.setStyle(Paint.Style.STROKE); //设置空心的//先画最外面的多边形轮廓Path path = new Path(); //路径for (int i = 0; i < data.size(); i++) {//只需要第一组的点float x = pointsArrayList.get(0).get(i).x;float y = pointsArrayList.get(0).get(i).y;if (i == 0) {//如果是第一个点就把path的起点设置为这个点path.moveTo(x, y);} else {path.lineTo(x, y);}}path.close(); //闭合路径canvas.drawPath(path, linePaint);//再画顶点到中心的线for (int i = 0; i < data.size(); i++) {float x = pointsArrayList.get(0).get(i).x;float y = pointsArrayList.get(0).get(i).y;canvas.drawLine(0, 0, x, y, linePaint); //起点都是中心点}canvas.restore();}private void drawPolygon(Canvas canvas) {canvas.save();//保存画布当前状态(平移、放缩、旋转、裁剪等),和canvas.restore()配合使用linePaint.setStyle(Paint.Style.FILL_AND_STROKE); //设置为填充且描边Path path = new Path(); //路径for (int i = 0; i < intervalCount; i++) { //循环、一层一层的绘制//每一层的颜色都都不同switch (i) {case 0:linePaint.setColor(Color.parseColor("#eef2fb"));break;case 1:linePaint.setColor(Color.parseColor("#dfe6f9"));break;case 2:linePaint.setColor(Color.parseColor("#ccdaf5"));break;case 3:linePaint.setColor(Color.parseColor("#b8c9f5"));break;}for (int j = 0; j < data.size(); j++) { //每一层有n个点float x = pointsArrayList.get(i).get(j).x;float y = pointsArrayList.get(i).get(j).y;if (j == 0) {//如果是每层的第一个点就把path的起点设置为这个点path.moveTo(x, y);} else {path.lineTo(x, y);}}path.close(); //设置为闭合的canvas.drawPath(path, linePaint);path.reset(); //清除path存储的路径}canvas.restore();}/*** 初始化一些固定数据** @param context*/private void initSize(Context context) {
// R = dp2pxF(context, 100); //半径暂时设为100dpintervalCount = 4; //有四层angle = (float) ((2 * Math.PI) / data.size()); //一周是2π,这里用π，因为进制的问题，不能用360度,画出来会有问题//拿到屏幕的宽高，单位是像素int screenWidth = PxUtils.getScreenWidth(context) - PxUtils.dp2px(52);//控件设置为正方向viewWidth = screenWidth;viewHeight = screenWidth / 3 * 2;R = viewWidth / 4; //半径设为宽度的三分之一}/*** 初始化画笔*/private void initPaint(Context context) {//画线的笔linePaint = new Paint(Paint.ANTI_ALIAS_FLAG);//设置线宽度linePaint.setStrokeWidth(PxUtils.dp2px(context, 1f));//画文字的笔textPaint = new Paint(Paint.ANTI_ALIAS_FLAG);textPaint.setTextAlign(Paint.Align.CENTER); //设置文字居中textPaint.setColor(Color.BLACK);textPaint.setTextSize(PxUtils.sp2pxF(context, 14f));}/*** 传入元数据*/public void setData(ArrayList<AbilityBean> list, Context context) {if (list.size() == 0) {return;}data = list;initSize(context);initPoints();//View本身调用迫使view重画invalidate();}/*** 初始化多边形的所有点 每一圈7个点，有4圈*/private void initPoints() {float x;float y;for (int i = 0; i < intervalCount; i++) {//创建一个存储点的数组ArrayList<PointF> points = new ArrayList<>();for (int j = 0; j < data.size(); j++) {float r = R * ((float) (4 - i) / intervalCount); //每一圈的半径都按比例减少//这里减去Math.PI / 2 是为了让多边形逆时针旋转90度，所以后面的所有用到cos,sin的都要减x = (float) (r * Math.cos(j * angle - Math.PI / 2));y = (float) (r * Math.sin(j * angle - Math.PI / 2));points.add(new PointF(x, y));}pointsArrayList.add(points);}}
}
怎么使用呢？使用如下：【这是我代码里面这样使用的】
其中用到了一个Bean类：
/*** 今年居然不发年终奖，哎*/
public class AbilityBean {public String name = "";//能力的名称public int num;//能力的值，范围0~100，单位%public int id;//能力的IDpublic AbilityBean(String name, int num, int id) {this.name = name;this.num = num;this.id = id;}public AbilityBean() {}
}应该就可以直接使用了
本文标签： LOL英雄战力效果五星战力分析5星
版权声明：本文标题：LOL英雄战力效果【五星战力分析】5星 内容由热心网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://it.en369.cn/IT/1694648329a254495.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。
发表评论