自定义控件详解(四):Paint 画笔路径效果
Paint ?畫(huà)筆 ,即用來(lái)繪制圖形的"筆"
前面我們知道了Paint的一些基本用法:
paint.setAntiAlias(true);//抗鋸齒功能 paint.setColor(Color.RED); //設(shè)置畫(huà)筆顏色 paint.setStyle(Style.FILL);//設(shè)置填充樣式 paint.setStrokeWidth(10);//設(shè)置畫(huà)筆寬度 ,單位px paint.setShadowLayer(10, 15, 15, Color.GREEN);//設(shè)置陰影不過(guò)我們會(huì)發(fā)現(xiàn),這樣畫(huà)出的線條都是筆筆直直的,能滿足需求,但是美觀上并不好看。
這就需要使用到Paint類 更多的一些方法了?
?
首先,看下最簡(jiǎn)單設(shè)置的線條
Paint paint = new Paint();paint.setStyle(Paint.Style.STROKE);
paint.setColor(Color.RED);
paint.setStrokeWidth(50);
Path path = new Path();
path.moveTo(100,500);
path.lineTo(200,200);
path.lineTo(300,500);
//繪制一個(gè)紅色,線條寬度50px 的折線
canvas.drawPath(path,paint);
?
?
一、線條路徑樣式?
public void setPathEffect(PathEffect effect);設(shè)置路徑樣式;取值類型是所有派生自PathEffect的子類
?
從第二個(gè)到最后一個(gè) ,每一個(gè)都表示一個(gè)樣式,其中用的最多的是?CornerPathEffect--圓形拐角效果 ?,DashPathEffect——虛線效果?
(1)、CornerPathEffect--圓形拐角效果
new CornerPathEffect(float radius) // radius 表示彎曲的半徑程度
Path path = new Path(); path.moveTo(100,500); path.lineTo(200,200); path.lineTo(300,500); //繪制一個(gè)紅色,線條寬度50px 的折線 paint.setPathEffect(new CornerPathEffect(5)); canvas.drawPath(path,paint);
?可以看到原來(lái)直線的折角 現(xiàn)在已經(jīng)有一個(gè)彎曲程度了
?拓展:我們可以根據(jù)這個(gè)方法來(lái)進(jìn)行曲線圖的實(shí)現(xiàn)
?
(2)、DashPathEffect——虛線效果?
public DashPathEffect(float intervals[], float phase) intervals[]:表示組成虛線的各個(gè)線段的長(zhǎng)度;整條虛線就是由intervals[]中這些基本線段循環(huán)組成的。phase: 開(kāi)始繪制的偏移值
注意: intervals[ ] 里面?zhèn)€數(shù)不限,但至少為2個(gè)。
可以為單數(shù)個(gè),也可以為雙數(shù)個(gè),如果為單數(shù)個(gè),多出來(lái)的最后一個(gè)無(wú)效果
? ? ? 雙數(shù)個(gè),表示一個(gè)實(shí)現(xiàn)長(zhǎng)度,一個(gè)空線長(zhǎng)度
比如 ?new DashPathEffect(new float[]{30,10,20,10},10);
那么每一段都分為4部分,先是30px的實(shí)線,再是10px的空心線,再是20px的實(shí)線,再是10px的空線
?
Paint paint = new Paint(); paint.setStyle(Paint.Style.STROKE); paint.setColor(Color.RED); paint.setStrokeWidth(10); Path path = new Path(); path.moveTo(100,500); path.lineTo(800,500);paint.setPathEffect(new DashPathEffect(new float[]{30,10,20,10},10));canvas.drawPath(path,paint);?
??至于其他的效果,大家可以自己嘗試 。
?
二、ComposePathEffect與SumPathEffect 疊加路徑效果
從英文上可以看出這兩個(gè)方法是用來(lái)合并路徑效果的,但既然是兩個(gè)方法,就有相應(yīng)的區(qū)別
(1)、ComposePathEffect
這種合并路徑效果是 先將paint 設(shè)置成第二個(gè)參數(shù)的路徑效果,然后在此基礎(chǔ)上 在設(shè)置成第一個(gè)參數(shù)對(duì)應(yīng)的路徑效果
我們給一個(gè)線條,設(shè)置圓形拐角路徑 和 一個(gè)虛線路徑看一下
Paint paint = new Paint(); paint.setStyle(Paint.Style.STROKE); paint.setColor(Color.RED); paint.setStrokeWidth(3); Path path = new Path(); path.moveTo(100,600); path.lineTo(200,200); path.lineTo(300,600); //虛線路徑 DashPathEffect dashPathEffect = new DashPathEffect(new float[]{30, 10, 20, 10}, 0); //圓角拐點(diǎn)路徑 CornerPathEffect cornerPathEffect = new CornerPathEffect(10); //合并后的路徑 ComposePathEffect composePathEffect = new ComposePathEffect(dashPathEffect, cornerPathEffect); //設(shè)置路徑 paint.setPathEffect(composePathEffect); canvas.drawPath(path,paint);?
(2)、SumPathEffect?
這種合并路徑效果是 分別將兩個(gè)路徑的效果疊加的顯示出現(xiàn)
我們給一個(gè)線條,設(shè)置圓形拐角路徑 和 一個(gè)虛線路徑看一下
Paint paint = new Paint(); paint.setStyle(Paint.Style.STROKE); paint.setColor(Color.RED); paint.setStrokeWidth(3); Path path = new Path(); path.moveTo(100,600); path.lineTo(200,200); path.lineTo(300,600); //虛線路徑 DashPathEffect dashPathEffect = new DashPathEffect(new float[]{30, 10, 20, 10}, 0); //圓角拐點(diǎn)路徑 CornerPathEffect cornerPathEffect = new CornerPathEffect(50); //合并后的路徑 SumPathEffect sumPathEffect = new SumPathEffect(dashPathEffect,cornerPathEffect); //設(shè)置路徑 paint.setPathEffect(sumPathEffect); canvas.drawPath(path,paint);可以看出 ?一個(gè)虛線路徑 和 一個(gè) 圓形拐角路徑 疊加顯示起來(lái)的效果
?
?
三、setStrokeCap(Paint.Cap cap)
設(shè)置線帽樣式,取值有Cap.ROUND(圓形線帽)、Cap.SQUARE(方形線帽)、Paint.Cap.BUTT(無(wú)線帽)?
線冒,可以理解為一條線兩個(gè)端點(diǎn),設(shè)置線冒樣式使線條兩端不看起來(lái)不那么死板
這里繪制3條不同 樣式的直線 來(lái)看一下效果
Paint paint = new Paint(); paint.setStyle(Paint.Style.STROKE); paint.setColor(Color.RED); paint.setStrokeWidth(50);Path pathBUTT = new Path(); pathBUTT.moveTo(100,200); pathBUTT.lineTo(600,200); paint.setStrokeCap(Paint.Cap.BUTT); canvas.drawPath(pathBUTT,paint);Path pathSQUARE = new Path(); pathSQUARE.moveTo(100,400); pathSQUARE.lineTo(600,400); paint.setStrokeCap(Paint.Cap.SQUARE); canvas.drawPath(pathSQUARE,paint);Path pathROUND = new Path(); pathROUND.moveTo(100,600); pathROUND.lineTo(600,600); paint.setStrokeCap(Paint.Cap.ROUND); canvas.drawPath(pathROUND,paint);
?
?
四、setStrokeJoin(Paint.Join join)
設(shè)置結(jié)合處效果取值:
1、Join.MITER(結(jié)合處為銳角) 2、Join.Round(結(jié)合處為圓弧) 3、Join.BEVEL(結(jié)合處為直線)舉例:
Paint paint = new Paint(); paint.setColor(Color.RED); paint.setStrokeWidth(30); paint.setStyle(Paint.Style.STROKE); paint.setAntiAlias(true);Path pathROUND = new Path(); pathROUND.moveTo(100,300); pathROUND.lineTo(600,300); pathROUND.lineTo(150,100); paint.setStrokeJoin(Paint.Join.ROUND); canvas.drawPath(pathROUND,paint);Path pathMITER = new Path(); pathMITER.moveTo(100,600); pathMITER.lineTo(600,600); pathMITER.lineTo(150,400); paint.setColor(Color.GREEN); paint.setStrokeJoin(Paint.Join.MITER); canvas.drawPath(pathMITER,paint);Path path = new Path(); path.moveTo(100,900); path.lineTo(600,900); path.lineTo(150,700); paint.setColor(Color.BLUE); paint.setStrokeJoin(Paint.Join.BEVEL); canvas.drawPath(path,paint);?
總結(jié)
以上是生活随笔為你收集整理的自定义控件详解(四):Paint 画笔路径效果的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇: delphi中利用Indy的TIdFtp
- 下一篇: sql必读的九本书