動態畫折線圖，暫停與繼續
最近要做一個頻道搜尋時的動態波浪形的UI，百度了很多，總結一下，寫了個Demo,實現動態折線圖的暫停與繼續。
佈局檔案：Fragemt_main.xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context="cn.hy.linechart.MainActivity$PlaceholderFragment" >
<LinearLayout
android:id="@+id/draw_line_chart"
android:layout_width="match_parent"
android:layout_height="300dip"
android:orientation="vertical" >
</LinearLayout>
<Button
android:id="@+id/btn_ok"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="@+id/draw_line_chart"
android:layout_below="@+id/draw_line_chart"
android:layout_marginTop="32dp"
android:text="確定" />
<Button
android:id="@+id/btn_cancel"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="@+id/btn_ok"
android:layout_alignRight="@+id/draw_line_chart"
android:layout_marginRight="50dp"
android:text="取消" />
</RelativeLayout>
主介面MianActivity:
public class MainActivity extends Activity {
private DrawChart view;//自定義的檢視 先點隨機點並畫線
private MyTimerTask task;//任務
private Button btnOk;
private Button btnCancel;
private Timer timer;//計時器 用來過一定時間排程任務執行
public TimerHandler timerHandler;//更新介面顯示檢視
LinearLayout layout;//DrawChart的存放區域
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.fragment_main);
timerHandler = new TimerHandler();
initView();
view = new DrawChart(this);
view.invalidate();
layout.addView(view);
}
public void initView() {
btnOk = (Button) findViewById(R.id.btn_ok);
btnCancel = (Button) findViewById(R.id.btn_cancel);
btnOk.setOnClickListener(btnListener);
btnCancel.setOnClickListener(btnListener);
layout = (LinearLayout) findViewById(R.id.draw_line_chart);
}
/** 實時更新頻道搜尋的波紋圖 */
private class MyTimerTask extends TimerTask {
@Override
public void run() {
timerHandler.sendEmptyMessage(0);
}
}
OnClickListener btnListener = new OnClickListener() {
@Override
public void onClick(View view) {
switch (view.getId()) {
case R.id.btn_ok:
task = new MyTimerTask();
timer = new Timer(true);
timer.schedule(task, 0, 100);
break;
case R.id.btn_cancel:
task.cancel();
break;
}
}
};
// 定義一個handler更新UI
@SuppressLint("HandlerLeak")
public class TimerHandler extends Handler {
@Override
public void handleMessage(Message msg) {
view.invalidate();
}
}
}
DrawChart.java:
public class DrawChart extends View{
private int CHARTH = 200;
private int CHARTW = 600;
private int OFFSET_LEFT = 70;
private int OFFSET_TOP = 20;
private int X_INTERVAL = 10;//線條之間最寬的間距
private List<Point> plist;
public DrawChart(Context context) {
super(context);
plist = new ArrayList<Point>();
//initPlist();
}
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
prepareLine();
drawCurve(canvas);
}
/**畫波紋線條*/
private void drawCurve(Canvas canvas){
Paint paint = new Paint();
paint.setColor(Color.BLACK);
paint.setStrokeWidth(3);
paint.setAntiAlias(true);
if(plist.size() >= 2){
for(int i = 0; i<plist.size()-1; i++){
canvas.drawLine(plist.get(i).x, plist.get(i).y, plist.get(i+1).x, plist.get(i+1).y, paint);//畫線
}
}
}
//準備線條所需要的點
private void prepareLine(){
int py = OFFSET_TOP + (int)(Math.random()*(CHARTH - OFFSET_TOP));//隨機生成點的縱座標位置
Point p = new Point(OFFSET_LEFT + CHARTW , py );//隨機生成點
if(plist.size() > 90){//用來畫線的點的個數
plist.remove(0);//清除第一個點
for(int i = 0; i<89; i++){
if(i == 0) plist.get(i).x -= (X_INTERVAL - 2);
else plist.get(i).x -= X_INTERVAL;
}
plist.add(p);
}
else{
for(int i = 0; i<plist.size()-1; i++){
plist.get(i).x -= X_INTERVAL;
}
plist.add(p);
}
}
}
資源下載：http://download.csdn.net/detail/hongyi787200/7671859