亲宝软件园·资讯

展开

Android体温计 Android实现动态体温计

小全Q 人气:1

前段时间在做一个生理参数采集的项目,其中涉及到体温模块。这是我的部分总结。
实现内容: 从文件中读取体温数据,动态绘制体温的效果。即体温数据随时间在不停的变化。体温计绘制效果为立体效果。

实现原理:

1、体温计的绘制

绘制原理:

体温计的大体框架由图1,2,4,5,6,7构成,绘制通过自定义View,DrawView的onDraw()方法来实现,体温计水银柱的的绘制通过SurfaceView来实现。根据屏幕宽度来设定体温计大小及位置。

图1,2,6构成体温计玻璃管,由颜色Color.argb(255, 25, 25, 112)和颜色Color.argb(250, 65,105,225)从左往右一次填充,实现渐变。图3是动态矩形,为体温计水银柱,由Color.RED和Color.argb(250, 255, 255, 0)有下往上填充,实现红色到橙色的渐变。图8为体温计水银柱头部,用红色填充。图4,5组合形成光晕,图4由Color.argb(30, 250, 250, 250)填充,图5填充颜色与体温计玻璃管相同。先绘制图4再绘制图5,于是,便形成月牙形光晕。图7为光晕,由Color.argb(30, 250, 250, 250)填充。然后画出刻度线,这样便制作出具有立体感的体温计。感觉底座部分设计的不大好,立体感不强。

动态刷新原理:将从文件中的体温数据读取,存储到数组当中,绘制体温时,根据数据来确定中间红色水银柱的坐标,其实,也就是动态矩形的绘制,采用定时绘制的方法实现动态效果。

原理说的差不多了,我们来看下代码实现过程:

布局文件:textView用来显示数值,surfaceView用来绘制动态矩形。

temp.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 android:layout_width="match_parent"
 android:layout_height="match_parent"
 android:orientation="vertical" >

 <RelativeLayout
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  android:background="@drawable/b03"
  android:paddingBottom="@dimen/activity_vertical_margin"
  android:paddingLeft="@dimen/activity_horizontal_margin"
  android:paddingRight="@dimen/activity_horizontal_margin"
  android:paddingTop="@dimen/activity_vertical_margin" >

  <LinearLayout
   android:id="@+id/linearLayout02"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:orientation="horizontal" >
  </LinearLayout>

  <LinearLayout
   android:id="@+id/linearLayout01"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content" >

   <SurfaceView
    android:id="@+id/surfacetemp"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginRight="20dp" />
  </LinearLayout>

  <TextView 
   android:id="@+id/textview01"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:layout_alignParentLeft="true"
   android:layout_gravity="center"
   android:layout_marginTop="160dp"
   android:textColor="#00C957"
   android:textSize="40sp" />

  <TextView
   android:id="@+id/textview02"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:layout_marginLeft="10dp"
   android:layout_marginTop="130dp"
   android:layout_toRightOf="@+id/textview01"
   android:textColor="#00FF00"
   android:textSize="30sp" />

  <TextView
   android:id="@+id/textview03"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:layout_marginLeft="2dp"
   android:layout_marginTop="130dp"
   android:layout_toRightOf="@+id/textview02"
   android:textColor="#00FF00"
   android:textSize="60sp" />

  <Button
   android:id="@+id/button01"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:layout_alignParentBottom="true"
   android:layout_alignParentLeft="true"
   android:layout_marginBottom="40dp"
   android:layout_marginLeft="50dp"
   android:background="@drawable/button_selector"
   android:text="开始"
   android:textColor="@color/paleturquoise"
   android:textSize="15sp" />

  <Button
   android:id="@+id/button02"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:layout_alignParentBottom="true"
   android:layout_alignParentRight="true"
   android:layout_marginBottom="40dp"
   android:layout_marginRight="50dp"
   android:background="@drawable/button_selector"
   android:text="暂停"
   android:textColor="@color/paleturquoise"
   android:textSize="15sp" />
 </RelativeLayout>

</LinearLayout>

体温计绘制View代码段:

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.LinearGradient;
import android.graphics.Paint;
import android.graphics.RectF;
import android.graphics.Shader;
import android.util.DisplayMetrics;
import android.view.View;

public class DrawTemp extends View{


 private float wide;
 private float high;
 private float t_wide;
 private float t_high ;
 private float r; //半径大小
 private float x0;//圆心坐标
 private float x1;
 private float y0;
 private float y1;
 /*自定义颜色*/
 private int color_blue = Color.argb(255, 25, 25, 112);
 private int color_bule1 = Color.argb(250, 65,105,225);
 private int color_white = Color.argb(30, 250, 250, 250);
 private int color_white1 = Color.argb(60, 250, 250, 250);
 private int color_orange = Color.argb(250, 255, 255, 0);
 public DrawTemp(Context context) {
  super(context);
  // TODO 自动生成的构造函数存根
   Paint paint = new Paint();
   paint.setColor(Color.YELLOW);
 }

  protected void onDraw(Canvas canvas)
  {
   DisplayMetrics dm = new DisplayMetrics(); 
   dm = getResources().getDisplayMetrics();
  wide = dm.widthPixels; // 屏幕宽(像素,如:480px) 
 high = dm.heightPixels; // 屏幕高(像素,如:800px)
   t_wide = wide/20;
   t_high = high/20;
   r = t_high-10;
   x0 = wide/2+2*t_wide;
   x1 = wide/2+4*t_wide;
   y0 = t_high*2;
   y1 = 10*t_high;

   float ydegree = 9*t_high; 
   int min_temp = 35; //最低温度为35
   int m1 = 4;
   int Line1_size = 1;
    int Line2_size = 3;
    int Line3_size = 5;
   //设置最小大刻度线条参数
   Paint paintLine1 = new Paint(); 
   paintLine1.setColor(Color.BLUE); 
   paintLine1.setStrokeWidth(Line3_size);
   //设置中等刻度线条参数
   Paint paintLine2 = new Paint(); 
   paintLine2.setColor(Color.YELLOW); 
   paintLine2.setStrokeWidth(Line2_size);
   //设置最小刻度线条参数
   Paint paintLine3 = new Paint(); 
   paintLine3.setColor(Color.GREEN); 
   paintLine3.setStrokeWidth(Line1_size);
   //设置文字参数
   Paint text = new Paint();
   text.setColor(Color.MAGENTA);
   text.setTextSize(30);

   Paint mPaint = new Paint(); 
   mPaint.setStrokeWidth(m1);
   LinearGradient ng= new LinearGradient(x0-10, y0, x1-10, y0, color_blue,color_bule1, Shader.TileMode.CLAMP);
   mPaint.setShader(ng);
   canvas.drawRect(x0-10, y0, x1+10, y1, mPaint);//绘制外围矩形
   canvas.drawCircle(x0+t_wide, y0, t_wide+10,mPaint );//绘制外围上部分圆弧
   canvas.drawCircle(x0+t_wide, y1,r+10, mPaint);//绘制外围底座


   //绘制水银柱
   Paint nPaint = new Paint();
   nPaint.setColor(Color.RED);
   canvas.drawCircle(x0+t_wide, y1, r-10, nPaint); 
   //LinearGradient mg= new LinearGradient(x0+10, y1, x0-10, y0, Color.RED,color_orange, Shader.TileMode.CLAMP);
   LinearGradient mg= new LinearGradient(x0+10, y1, x1-10, y0, Color.RED,color_orange, Shader.TileMode.CLAMP); 
   nPaint.setShader(mg);

   //绘制动态矩形
   // canvas.drawRect(x0+10, y, x1-10, y1, nPaint);

   //绘制光晕,圆角矩形
   Paint paint = new Paint();
   paint.setColor(color_white);
   RectF Rect = new RectF(x0-5, y0,x0+5, y1-t_high);

   canvas.drawCircle(x0+t_wide, y0-t_wide/2-t_wide/3, t_wide/3,paint );
   canvas.drawCircle(x0+t_wide, y0, t_wide-t_wide/8,mPaint );

   canvas.drawCircle(x0+t_wide-8, y1, r-10, paint);

   canvas.drawCircle(x0+t_wide, y1, r-10, nPaint); 
   paint.setColor(color_white1);
   RectF Rect3 = new RectF(x0, y1, x0+t_wide, y1+t_wide);
   canvas.drawArc(Rect3, 0, 30, false, paint);

   while (ydegree > y0+30) {  
     canvas.drawLine(x1+10, ydegree, x1+15, ydegree, paintLine3); 
    if (ydegree % t_high == 0) { 
     canvas.drawLine(x1+10, ydegree, x1+50, ydegree, paintLine1); 
     canvas.drawText(min_temp + "", x1+55, ydegree + 5, text); 
     min_temp++; 
    } 
    else if(ydegree % (t_high/2) == 0)
    {
      canvas.drawLine(x1+10, ydegree, x1+25, ydegree, paintLine2); 
    }
    ydegree = ydegree - 2 ; 
   }  
} 
}

主程序:

public void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  setContentView(R.layout.temp_layout);

  innit(); // 初始化
 ActionBarUtils.initActionBar(getApplicationContext(), getActionBar(),
    "体温");

  timer = new Timer();

   start.setOnClickListener(new OnClickListener()
   {

   @Override
   public void onClick(View v) {
    // TODO 自动生成的方法存根
     timer= new Timer();

     handler = new Handler()
     { 
      @Override 
      public void handleMessage(Message msg) 
      {  //刷新图表 
        s = String.valueOf(min_data);   

        if(msg.what == 1)
        { 
         text1.setText(s); 
        }
        if(msg.what == 0)
        {
         String num = String.valueOf(number);
         text1.setText(num);
        }
        else if(msg.what == 2)
        {
         text1.setText("爆表啦");
        }

        super.handleMessage(msg); 
      } 
     };

     task = new TimerTask() 
     { 
      @Override 
      public void run() 
      { 
       Message message = new Message();
       // drawPmThread pm = new drawPmThread();
       if( min_data == number)
       {
        onDestroy();
       }

       if(number>40)
        {
        message.what = 2;
        handler.sendMessage(message);
        }

       if(0<min_data && min_data < 35)
       {
        message.what = 0;
        handler.sendMessage(message);
       }
       else if (35<=min_data && min_data<number)
       {

        draw(min_data);
        message.what = 1; 
        handler.sendMessage(message);
        min_data++;
       }

      } 
     };
   //定时刷新  
     timer.schedule(task, 4, 40);
   }
   }
    );

  stop.setOnClickListener(new OnClickListener() {

   @Override
   public void onClick(View v) {
    stopTimer();
   }
  });
 }

 // 初始化界面
 private void innit() {
  // TODO Auto-generated method stub
  start = (Button) findViewById(R.id.button01);
  stop = (Button) findViewById(R.id.button02);
  text1 = (TextView) findViewById(R.id.textview01);
  text2 = (TextView) findViewById(R.id.textview02);
  text3 = (TextView) findViewById(R.id.textview03);
  save = (TextView) findViewById(R.id.textView1);
  linearLayout02 = (LinearLayout) findViewById(R.id.linearLayout02);
  drawView = new DrawTemp(this);
  linearLayout02.addView(drawView);
  surface = (SurfaceView) findViewById(R.id.surfacetemp);

  String s2 = "o";
  String s3 = "C";
  text2.setText(s2);
  text3.setText(s3);
  TextPaint tp = start.getPaint();
  tp.setFakeBoldText(true);
  TextPaint tp1 = stop.getPaint();
  tp1.setFakeBoldText(true);
  scrn = new DisplayMetrics();
  getWindowManager().getDefaultDisplay().getMetrics(scrn);

  holder = surface.getHolder(); 
  holder.addCallback(this);

  surface.setZOrderOnTop(true); //设置背景色为透明
  surface.getHolder().setFormat(PixelFormat.TRANSLUCENT);
  // thread = new Thread(this,"SurfaceView");

  width = scrn.widthPixels; // 宽度(PX)
  height = scrn.heightPixels; // 高度(PX)
  t_width = width/20;
  t_height = height/20;
  x0 = width/2+2*t_width;
  x1 = width/2+4*t_width;
  y1 = 10*t_height;

 }

 // 停止计时器
 private void stopTimer() {

  if (timer != null) {
   timer.cancel();
   timer = null;
  }

  if (task != null) {
   task.cancel();
   task = null;
  }
 }
 // 绘制体温动态柱形图
 private void draw(float min_data)
 {

  int ydegree = 9 * t_height;
  float y = ydegree - (min_data - 35) * t_height;
  Canvas canvas = holder.lockCanvas();
  // 绘制动态矩形
  Paint nPaint = new Paint();
  nPaint.setColor(Color.RED);
  canvas.drawRect(x0 + 10, y, x1 - 10, y1, nPaint);

  holder.unlockCanvasAndPost(canvas);// 更新屏幕显示内容 */
 }

 class MyCallBack implements SurfaceHolder.Callback {

  @Override
  public void surfaceChanged(SurfaceHolder arg0, int arg1, int arg2,
    int arg3) {
   // TODO Auto-generated method stub
  }

加载全部内容

相关教程
猜你喜欢
用户评论