仿掌上英雄联盟能力值图形绘制
!
。
。
canvas.drawLine canvas.rotate
public class MyView extends View{private int startX=720,startY=200;//起始点private int centerX=720,centerY=600;//圆心private int r=centerY-startY;//半径private String[]str= {"击杀","生存","助攻","物理","魔法","防御","金钱"};private int dimension;//文字大小private float xA,xB,xC,xD,xE,xF,xG;//x轴坐标private float yA,yB,yC,yD,yE,yF,yG;//y轴坐标private static final int TEXTSIZE=20;private float y1,y2,y3,y4,y5,y6,y7,x1,x2,x3,x4,x5,x6,x7;//能力值坐标private float pre1=0.2f,pre2=0.2f,pre3=0.2f,pre4=0.2f,pre5=0.2f,pre6=0.2f,pre7=0.2f;//百分率public MyView(Context context) {this(context,null);}public MyView(Context context, AttributeSet attrs) {this(context, attrs,0);}public MyView(Context context, AttributeSet attrs, int defStyleAttr) {super(context, attrs, defStyleAttr);initView();TypedArray typedArray=context.obtainStyledAttributes(attrs,R.styleable.textSize);dimension = (int) typedArray.getDimension(R.styleable.textSize_textsize, TEXTSIZE);typedArray.recycle();}@Overrideprotected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {super.onMeasure(widthMeasureSpec, heightMeasureSpec);}private void initView(){initData();}
上面这些呢主要是构造方法,和一些常量,圆心坐标呢我并没有对屏幕做适配,而是依据我的模拟器选择的一个大概的值,大家假设想做的话直接调用WindowManger窗体管理器,或者重写onMeasure()方法都能够得到view的宽度去做调整,
private void initData() {//首先A点坐标(其有用不到)xA=startX;yA=startY;//先求出B点的坐标xB= (float) (centerX+Math.sin(Math.toRadians(360/7))*r);yB= (float) (centerY-Math.cos(Math.toRadians(360/7))*r);//在求出C点坐标xC= (float) (startX+Math.sin(Math.toRadians(360/7*1.5))*r);yC= (float) (centerY+Math.cos(Math.toRadians(360/7*1.5))*r);//Log.i("TAG",""+xC+"---"+yC);//在求出D点坐标xD= (float) (startX+Math.sin(Math.toRadians(360/7/2))*r);yD= (float) (centerY+Math.cos(Math.toRadians(360/7/2))*r);//于D点水平对称的E点坐标xE=(float) (centerX-Math.sin(Math.toRadians(360/7/2))*r);yE= (float) (centerY+Math.cos(Math.toRadians(360/7/2))*r);//与C点水平对称点的坐标FxF= (float) (centerX-Math.sin(Math.toRadians(360/7*1.5))*r);yF= (float) (centerY+Math.cos(Math.toRadians(360/7*1.5))*r);//与B点水平对称点的坐标GxG= (float) (centerX-Math.sin(Math.toRadians(360/7))*r);yG= (float) (centerY-Math.cos(Math.toRadians(360/7))*r);}
我们这次瞄点是依据角度进行绘制的。应该还有其它方法。PathMeasure这个类应该有api能够绘制,感兴趣的同学能够去研究下,上面的A点呢就是最上面的那个点,然后呢顺时针以此往下,
@Overrideprotected void onDraw(Canvas canvas) {super.onDraw(canvas);canvas.save();Paint paint=new Paint();paint.setColor(Color.GREEN);paint.setStrokeWidth(2);for (int i = 0; i < 7; i++) {canvas.drawLine(startX,startY,centerX,centerY,paint);canvas.rotate((float) 360/7,centerX,centerY);}canvas.restore();//画AB之间的直线canvas.drawLine(startX,startY,xB,yB,paint);//画BC之间的直线canvas.drawLine(xB,yB,xC,yC,paint);//画BD之间的直线canvas.drawLine(xC,yC,xD,yD,paint);//画DE之间的直线canvas.drawLine(xD,yD,xE,yE,paint);//画EF之间的直线canvas.drawLine(xE,yE,xF,yF,paint);//画FG之间的直线canvas.drawLine(xF,yF,xG,yG,paint);//画FA之间的直线canvas.drawLine(xG,yG,startX,startY,paint);
点已经喵好了接下来肯定就是把这些点连载一起喽。代码凝视的非常清楚对吧~~注意上面这些是最最外面的多边形
5,连线(画内多边形)
//画内多变形canvas.drawLine(startX,centerY-r/2,(xB+startX)/2,yB+(centerY-yB)/2,paint);canvas.drawLine((xB+startX)/2,yB+(centerY-yB)/2,(startX+xC)/2,(centerY+yC)/2,paint);canvas.drawLine((startX+xC)/2,(centerY+yC)/2,(startX+xD)/2,(centerY+yD)/2,paint);canvas.drawLine((startX+xD)/2,(centerY+yD)/2,(startX+xE)/2,(centerY+yE)/2,paint);canvas.drawLine((startX+xE)/2,(centerY+yE)/2,(startX+xF)/2,(centerY+yF)/2,paint);canvas.drawLine((startX+xF)/2,(centerY+yF)/2,(startX+xG)/2,(centerY+yG)/2,paint);canvas.drawLine((startX+xG)/2,(centerY+yG)/2,startX,centerY-r/2,paint);canvas.drawLine((startX+xG)/2,(centerY+yG)/2,startX,centerY-r/2,paint);
6。动态的绘制图形
//顺时针依次x1=startX;y1= (centerY-(pre1*r));x2= (float) (startX+Math.sin(Math.toRadians(360/7))*pre2*r);y2= (float) (centerY-Math.cos(Math.toRadians(360/7))*pre2*r);x3= (float) (startX+Math.sin(Math.toRadians(180-360/7*2))*pre3*r);y3= (float) (centerY+Math.cos(Math.toRadians(180-360/7*2))*pre3*r);x4= (float) (startX+Math.sin(Math.toRadians(180-360/7*3))*r*pre4);y4= (float) (centerY+Math.cos(Math.toRadians(180-360/7*3))*r*pre4);x5= (float) (centerX-Math.sin(Math.toRadians(180-360/7*3))*r*pre5);y5= (float) (centerY+Math.cos(Math.toRadians(180-360/7*3))*r*pre5);x6= (float) (centerX-Math.sin(Math.toRadians(180-360/7*2))*r*pre6);y6= (float) (centerY+Math.cos(Math.toRadians(180-360/7*2))*r*pre6);x7= (float) (centerX-Math.sin(Math.toRadians(360/7))*r*pre7);y7= (float) (centerY-Math.sin(Math.toRadians(90-360/7))*r*pre7);mPath.moveTo(x7,y7);//把起点设置为7点能够使图形封闭mPath.lineTo(x1,y1);mPath.lineTo(x2,y2);mPath.lineTo(x3,y3);mPath.lineTo(x4,y4);mPath.lineTo(x5,y5);mPath.lineTo(x6,y6);mPath.lineTo(x7,y7);// 绘制路径canvas.drawPath(mPath, mPaint);//mPath.close(); //封闭曲线invalidate();
pre代表SeekBar滑动的值/最大值,由于我用了mPath.moveTo(x7,y7);所以不须要在调用mPath.close()了。它是能够是线条首尾连在一起组成一个封闭的图形,注意上面这些都要用float值,由于这些角度大部分都是float值,假设用int的话会让图片看起来有一定的偏差,我也截了一张错误的图大家细致看一下是有差别的:
转载于:https://www.cnblogs.com/yutingliuyl/p/7399772.html
仿掌上英雄联盟能力值图形绘制相关推荐
- 仿掌上英雄联盟能力值分析效果
今日科技快讯 就在上周五,百度又出现重磅新闻,副总裁李明远被人举报贪污,在公司收购的项目中与被收购公司私下里有巨额经济来往.李明远虽然回应称自己没有贪污,是被人诬陷,但目前已引咎辞职.这已经是百度今年 ...
- android开发自定义View(四)仿掌上英雄联盟能力值分析效果
本篇文章已授权微信公众号 guolin_blog (郭霖)独家发布 原始图效果 模仿效果 PNG GIF 流程 绘制中心线,用于计算外层多边形各点的坐标 绘制最外层多边形 分析原型图算出每个多边形之间 ...
- Android仿掌上英雄联盟首页,实现折叠效果
不单单是掌上英雄联盟,像微博发现页也用了这样的布局,当滑动到一定距离的时候,自动隐藏轮播图,或者标题栏下面的布局.并且使tablayout置顶. 与之相似的还有简书的个人页面也是这样的布局. 图片处理 ...
- 仿掌上英雄联盟云顶之弈 - 微信小程序版
毕业3年已经很少玩英雄联盟了,最近出了个云顶之弈的新模式,就玩了几局.自己还没有写过微信小程序,正好就仿照掌上英雄联盟写个Demo,并没有使用很多技巧,算是初步学习的测验吧. github源码 欢迎给 ...
- ViewPager系列之-仿掌上英雄联盟皮肤浏览效果
封面图.png 能有一个双休的周末,对于程序员来说,也算是一件幸福的事情吧.苦逼的加了一周的班,终于可以休息放松放松了.作为一个LOL爱好者,周末最开心的事当然就是约上几个小伙伴一起开黑了.一起超神. ...
- 用Kotlin画起仿掌上英雄联盟和懂球帝的自定义多边形战力图
大家好,可能今年换了公司过得比较安逸,自己的心情也不算太好,所以一段时间都没很好的学习和更新文章.自从最近看了扔物线HenCoder的文章之后,自己感觉自己对很多自定义View和动画的知识都不太懂,甚 ...
- 所向无前 正当年!掌上英雄联盟S10换肤设计小结
项目背景 掌盟作为官方APP,会在重要节点配合产品和运营侧进行换肤设计,渲染节点氛围,从而希望可以提升产品口碑,做一个有温度的APP. 在掌盟的换肤工作中,可以总结为3种换肤类型: S10换肤的工作就 ...
- 【无限互联】 学院作品: LOL掌上英雄联盟
一.项目介绍: 我做的项目是LOL英雄掌上联盟(模仿版),是腾讯游戏英雄联盟官方制作的app,来为LOL玩家提供最专业的资讯和社交服务 ,可以查询英雄联盟的最新的情况,这款app的功能有: ...
- ios自定义UITabBar-仿写掌上英雄联盟的UITabBar
最近在仿写这个软件,发现UITabBar不是使用的原生的.所以,需要自己去自定义 观察掌盟的UITabBar 观察官方的软件下面的tabBar,我们可以发现几点需要我们注意的 1. 当select一个 ...
最新文章
- python统计文件行数检测字符串_python统计文件中的字符串数目示例
- 魔改GPT自动写网文,速度一秒十字,还能给太监作品无限续更 | 开源
- 第二十四篇:可靠信号机制
- factor--符号矩阵的因式分解
- Code Review最佳实践
- Another way to define Angular controller
- 一文搞定C#关于NPOI类库的使用读写Excel以及io流文件的写出
- 服务去获取配置中心配置
- 寂寞的hasLayout
- C#绘制立体三维饼状图(超酷)
- 出现梯度消失与梯度爆炸的原因以及解决方案
- HTTP传输协议原理
- flash发布html快捷键,Flash菜单操作之快捷键
- HTTP - 长连接/短连接 - 学习/实践
- uniapp 定位服务_uniapp使用高德地图定位
- java中暴力是啥方法_[蓝桥杯][历届试题]回文数字 中规中矩的暴力方法(Java代码)...
- 360ie7模式下的一个兼容
- vivo Y76s参数配置
- 实验七 12 小数化分数
- 用python绘制散点图