資源描述:
《android 自定義控件-體溫走勢圖(溫度計+曲線+列表)》由會員上傳分享,免費(fèi)在線閱讀,更多相關(guān)內(nèi)容在行業(yè)資料-天天文庫。
1、Android自定義控件-體溫走勢圖聲明:本文只介紹開發(fā)思路,并不提供完整的源代碼,若說的有不對之處,還請各位看官見諒!本人菜鳥一枚,以前一直做c#的WinForm、WPF的前端開發(fā),近來隨著公司業(yè)務(wù)發(fā)展需要開始慢慢接觸android,最近在做一個項目需要使用一些圖表控件,剛開開始在網(wǎng)上找了幾個開源圖庫,雖然功能很強(qiáng)大,但并能完全滿足開發(fā)需求。故開始嘗試自定義控件的不歸之路一、圖表需求1)曲線圖要求1、不同溫度值,用不同顏色區(qū)分,如:正常為綠色、發(fā)燒為橙色、高燒為紅色;2、自適應(yīng)屏幕分頁展示;3、根據(jù)需要動態(tài)控制是否標(biāo)志最高溫;2)列表展示要求1
2、、類似余額寶收益效果圖二、效果展示溫度計+曲線走勢圖(一)溫度計+曲線走勢圖(二)曲線走勢圖-分頁展示(分頁中)曲線走勢圖(最后一頁)列表展示圖二、設(shè)計思路1)體溫計體溫計主要分為兩部分,即:1、上半部:矩形+刻度線,用于展示溫度數(shù)值2、下半部:圓形使用技術(shù),canvas里的drawRect、drawLine、drawText設(shè)計思路:1、溫度數(shù)據(jù)展示部分,首先畫一個實(shí)心矩形(高度滿屏),來作為背景色,第二步:再畫一個矩形來標(biāo)注溫度值(高度根據(jù)溫度值動態(tài)計算),第三步繪制刻度線及刻度值。注:顏色效果,根據(jù)溫度值的不同來設(shè)置畫筆顏色即可。2、底部圓
3、形,可通過畫圓或直接使用圖片。2)列表展示這個簡單,只需用到一個空心矩形(外),加一個實(shí)心矩形(內(nèi))即可。設(shè)計思路同上,就不展開了。3)體溫曲線需要用的相關(guān)的知識:1)幾何數(shù)學(xué)1、X/Y二維坐標(biāo)系。2、相似三角形計算。2)Canvas1、drawCirclet,通過畫實(shí)心圓來標(biāo)記點(diǎn)。2、drawPath,來完成復(fù)雜圖形的繪制(如梯形、三角形等)3、drawLine、drawText;設(shè)計思路:1、Y軸,用于標(biāo)注刻度線,及刻度值(需數(shù)學(xué)計算)2、X軸,用于標(biāo)注各個時間點(diǎn)(根據(jù)隊列順序依次繪制即可)3、分頁效果,通過改變數(shù)據(jù)源的方式來實(shí)現(xiàn)。注意事項:
4、1、自適應(yīng)屏幕,動態(tài)變化最大顯示的數(shù)據(jù)量(即顯示數(shù)據(jù)點(diǎn)的最大值);四、相關(guān)源碼1、獲取屏幕分辨率,并計算圖表顯示的最大點(diǎn)數(shù)。//獲取屏幕分辨率DisplayMetricsdm=newDisplayMetrics();getWindowManager().getDefaultDisplay().getMetrics(dm);AppInstance.windowsWith=dm.widthPixels;/***計算文字長度**/privatestaticfloatmeasureTextLength(Stringtext){PaintpaintLine
5、=newPaint();paintLine.setAntiAlias(true);paintLine.setColor(Color.parseColor("#333333"));paintLine.setTextSize(20);paintLine.setStrokeWidth(3f);returnpaintLine.measureText(text);}/***圖表顯示的最多點(diǎn)數(shù)**/publicstaticintgetChartLineMaxPointCount(){floatlinetextLength=measureTextLength(
6、"15:45:34")+5;floatmarginleft=measureTextLength(41+"℃")+15;floatmarginRight=50+45/2;return(int)((AppInstance.windowsWith-marginleft-marginRight)/linetextLength);}/***獲取溫度參考值*@return1:正常2:發(fā)燒3:高燒**/publicstaticintgetTemperatureLevel(floatvalue){intlevel=1;if(value>37.3&&value<=
7、38){level=2;}elseif(value>38){level=3;}else{level=1;}returnlevel;}1、溫度計實(shí)現(xiàn)importcc.ewell.irdc.thermometer.tools.Tools;importandroid.content.Context;importandroid.graphics.Canvas;importandroid.graphics.Color;importandroid.graphics.Paint;importandroid.util.AttributeSet;importand
8、roid.view.View;publicclassThermometerViewextendsView{//體溫值privateflo