⑴ 有誰可以在android實現仿照siri聲波曲線
代碼實現
波浪其實是由4條貝塞爾曲線組成的,可以在自定義View的onDraw函數中,用Path.quadTo函數畫出4條曲線。
Path.quadTo(float x1, float y1, float x2, float y2)
其中,x1,y1為控制點的坐標值,x2,y2為終點的坐標值;當控制點的x1位於起點與終點之間時,將畫出正弦曲線,此時y1控制正弦曲線的高度,即效果圖中波浪的高度由y1控制。
實現了曲線繪制和高度控制之後,如何讓曲線像波浪一樣動起來呢?
我的解決方法是在屏幕左邊,即x<0的位置,同樣繪制4條正弦曲線,並且啟動線程讓8條曲線都向右移動,當左邊4條曲線全部移動到屏幕內後,讓這8條曲線復位。如此周期進行。
解析
使用方法
在xml中,
<com.tao.view.SiriView
android:id="@+id/siriView"
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_centerInParent="true"/>
在Activity.java中,
SiriView siriView = (SiriView) findViewById(R.id.siriView);
// 停止波浪曲線
siriView.stop();
// 設置曲線高度,height的取值是0f~1f
siriView.setWaveHeight(0.5f);
// 設置曲線的粗細,width的取值大於0f
siriView.setWaveWidth(5f);
// 設置曲線顏色
siriView.setWaveColor(Color.rgb(39, 188, 136));
// 設置曲線在X軸上的偏移量,默認值為0f
siriView.setWaveOffsetX(0f);
// 設置曲線的數量,默認是4
siriView.setWaveAmount(4);
// 設置曲線的速度,默認是0.1f
siriView.setWaveSpeed(0.1f);
⑵ android怎麼將柱狀圖和曲線共存
1、先選取主要數據區,插入柱形圖
於是得到了下面的圖表,但是注意到橫坐標並非「1月,2月...」,而是"1,2...",所以先來解決這個
2、右側圖表->「選擇數據」->"水平(分類)軸標簽",設置水平分類標簽的數據源
完成之後,水平橫坐標應該能正常顯示"1月,2月..."了,但是到目前為止,折線圖還不見蹤影
3、在圖表上右擊-->選擇數據源-->圖例項(系列)-->添加
按照下圖設置「系列名稱」來源,以及「系列值」來源(即添加浙江件數的數據來源)
完成之後,會發現圖表面目全非了,而且右側的縱向坐標軸也變了!
4、選中圖表中的柱狀,右擊-->更改系列圖表類型(Y)
改成折線圖
然後繼續選中折線,右擊-->設置數據系列格式-->設置為"次坐標軸",你會發現之前漂亮的圖表又回來了
5、類似的操作,添加其它幾個省份的"件數"折線圖
可能注意到了:右側的圖例中,有二組相同的省份(一組是柱狀圖的,一組是折線圖的),可以刪掉一組
6、最後調整柱狀圖跟折線的顏色,以便讓這二組圖的顏色一致
終於,得到了一個漂亮的同時帶有「折線」跟「柱狀」的圖表.
⑶ android 使用canvas畫線,如何保證快速畫出圓滑的曲線
[mw_shl_code=java,true] RectF rect = new RectF(0, 0, radii, radii); // 圓形弧度需要的區域(左上角的x,y坐標 ,及右下角x,y坐標) Paint paint = new Paint(); paint.setColor(r.getColor(R.color.bg_color_1)); canvas.drawCircle(radii/2, radii/2, radii/2, paint);[/mw_shl_code]
⑷ 有誰知道android里的Path類中的quadTo()方法是怎麼實現貝塞爾曲線的嗎
/**
* 畫曲線(核心代碼)
*
* @param startp
* 開始點
* @param endp
* 結束點
* @param canvas
* 畫布
* @param paint
* 畫筆
*/
private void drawCurve(Point[] points, Canvas canvas, Paint paint)
{
Point startp = new Point();
Point endp = new Point();
for (int i = 0; i < points.length - 1; i++)
{
startp = points[i];
endp = points[i + 1];
int wt = (startp.x + endp.x) / 2;
Point p3 = new Point();
Point p4 = new Point();
p3.y = startp.y;
p3.x = wt;
p4.y = endp.y;
p4.x = wt;
// 確定曲線的路徑
path = new Path();
path.moveTo(startp.x, startp.y);
path.cubicTo(p3.x, p3.y, p4.x, p4.y, endp.x, endp.y);
canvas.drawPath(path, paint);
}
}
⑸ android中這樣的曲線要怎麼繪制
繪制曲線圖首先需要畫好橫豎坐標軸建立坐標系,比如坐標系中的100距離應該在canvas中繪制多長,這個是需要計算的,其實坐標體系的建立是最復雜的,我看過很多第三方庫的建立方法都不一樣,有的要靈活一些,有的比較死板。至於繪制曲線要麼是用Canvas.drawLine方法,要麼是用Path.lineTo方法,看你自己的習慣。
為了做出一個外觀良好的曲線圖,我參考了兩個開源代碼,第一個的曲線圖繪制限制較多,使用范圍太窄,但是有數據變化時的動畫效果。第二個的適用范圍很廣,他能根據數據集合自動計算橫縱坐標的個數,在canvas上單元格的距離,只需輸入坐標點就能自動建立坐標體系繪制曲線,但是沒有動畫效果。
先講第一個LineView。
LineView的demo可以在這里下載,lineview其實只是github項目的一部分,我是將其提取出來了的,個人覺得他的其他部分沒有參考價值。作者好像是個韓國人。
LineView的曲線繪制沒有什麼可取的部分,我想學習的是他實現動畫效果的方法,設計的很好,但具體實現還需要改進,讓動畫更流暢。
Lineview的調用方法:
在xml中添加lineview控制項
<HorizontalScrollView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="@+id/horizontalScrollView"
android:layout_alignParentRight="true"
android:layout_above="@+id/line_button">
<view
android:layout_width="wrap_content"
android:layout_height="200dp"
class="com.example.widget.LineView"
android:id="@+id/line_view"/>
</HorizontalScrollView>
在activity代碼中獲取lineview對象:
finalLineView lineView = (LineView)findViewById(R.id.line_view);
添加橫坐標:
int randomint = 9;
ArrayList<String>test =newArrayList<String>();
for (int i=0;i<randomint; i++){
test.add(String.valueOf(i+1));
}
lineView.setBottomTextList(test);
允許繪制坐標點:
lineView.setDrawDotLine(true);
lineView.setShowPopup(LineView.SHOW_POPUPS_NONE);
ArrayList<Integer> dataList = newArrayList<Integer>();
intrandom = (int)(Math.random()*9+1);
for (int i=0;i<randomint; i++){
dataList.add((int)(Math.random()*random));
}
添加縱坐標的值:
ArrayList<ArrayList<Integer>>dataLists = newArrayList<ArrayList<Integer>>();
dataLists.add(dataList);
lineView.setDataList(dataLists);
從其用法中可以看出,lineview需要提前設定橫坐標的范圍,而且縱坐標的值必須和lineView.setBottomTextList(test)中添加的值一一對應(讀lineview源碼可以知道),使用起來很不方便,我覺得作者僅僅是做出了一條曲線而已,而不太關注是否有用。和很多曲線圖的開源代碼一樣lineview允許一次繪制幾根顏色不同的曲線。
只需在上面的代碼中為dataLists再添加一個list成員就行。