基于Android的计步器(Pedometer)的讲解(二)——柱状图分析

时间:2021-05-31 15:40:48

写正文之前,小小的吐槽一下,还有一个月就放假了,作业、考试、还有实习(研一,下半学期课不多,也不想在实验室)的考虑,最近基于hadoop的数据分析马上也要验收了,真的忙的“外焦里嫩”啊!目前定的方向是Android开发,所以想过年来了找一个Android的实习工作,提高一点在真正的项目中的经验。

好了,说了这么多废话,开始进入正题吧。

整个计步器的项目已经上传到github上了,感兴趣的朋友可以去看看(最好能给小弟我打颗星星哦~)

github下载


CSDN下载

项目整体介绍前面介绍过:http://blog.csdn.net/a296777513/article/details/42339693

首先,这是两张今天要实现的效果图:

虽然这个可以用没问题,我在另一篇的博文里已经进行优化了,界面更加好看

http://blog.csdn.net/a296777513/article/details/42386769 

基于Android的计步器(Pedometer)的讲解(二)——柱状图分析基于Android的计步器(Pedometer)的讲解(二)——柱状图分析

最主要的实现自己写的一个HistogramView的类(柱状图类)

HistogramView的代码如下:

package com.example.histogram.widet;



import com.example.changepage1.R;

import android.annotation.SuppressLint;
import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.RectF;
import android.util.AttributeSet;
import android.view.View;
import android.view.animation.Animation;
import android.view.animation.Transformation;


/**
* 这是重新写的一个柱状图的view
* Author: 李垭超 email:296777513@qq.com
* Date: 2015-1-3
* Time: 下午6:15
*/
public class HistogramView extends View {
private boolean Text = false;//判断是否在柱状图上显示数字
private int Height;//控件高度
private int Width;//控件宽度
private Bitmap bitmap;//柱状图的样子
private int mHeight;//柱状图高度
private int AnimValue;//实现的动画
private double Progress;

private Canvas canvas;//画出柱状图的各个属性
private HistogramAnimation ani;

public void setText(boolean mText) {
this.Text = mText;
invalidate();

}

public HistogramView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
ani = new HistogramAnimation();//初始化自定义的动画类
ani.setDuration(1000);//设置整个动画在1秒内完成
}

public HistogramView(Context context, AttributeSet attrs) {
super(context, attrs);
ani = new HistogramAnimation();
ani.setDuration(1000);
}

@Override
protected void onSizeChanged(int w, int h, int oldw, int oldh) {
super.onSizeChanged(w, h, oldw, oldh);
//初始化控件和进度的条相关参数
Width = w;
Height = h;
mHeight = (int) (h * Progress * 0.9);

}

@SuppressLint("DrawAllocation")
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
this.canvas = canvas;

Paint paint = new Paint();//设置矩形画笔,设置柱状图的信息
paint.setAntiAlias(true);
paint.setStyle(Paint.Style.FILL);
paint.setTextSize(sp2px(getContext(),12));
paint.setColor(Color.parseColor("#6DCAEC"));


// 绘制 柱状图的形状 :left,top,right,bottom
RectF dst = new RectF(0, Height - AnimValue, Width, Height);
//取出图片,并且转换为bitmap类型
bitmap = BitmapFactory
.decodeResource(getResources(), R.drawable.column);

this.canvas.drawBitmap(bitmap, null, dst, paint);//画出柱状图
if (Text) {
if (Progress != 0) {
this.canvas.drawText((int) (Progress * 10000) + "", 0,
(Height - AnimValue) - 10, paint);
} else {
this.canvas.drawText((int) (Progress * 10000) + "", 0,
(Height - AnimValue) - 10, paint);
}

}
}

/**
* 对外提供接口来传进数值
* @param Progress
*/
public void setProgress(double Progress) {
if (Progress < 0.03 && Progress != 0) {
this.Progress = Progress;
Progress = 0.03;
}
this.Progress = Progress;
this.startAnimation(ani);
}

/**
* 集成animation的一个动画类
* @author 李垭超
*
*/
private class HistogramAnimation extends Animation {
@Override
protected void applyTransformation(float interpolatedTime,
Transformation t) {
super.applyTransformation(interpolatedTime, t);
if (interpolatedTime < 1.0f) {
AnimValue = (int) (mHeight * interpolatedTime);
} else {
AnimValue = mHeight;
}
postInvalidate();
}
}


public static int sp2px(Context context, float spValue) {
final float fontScale = context.getResources().getDisplayMetrics().scaledDensity;
return (int) (spValue * fontScale + 0.5f);
}

}

重写FragmentAnalysis类

package com.example.histogram;

import java.text.SimpleDateFormat;
import java.util.Calendar;

import com.example.changepage1.R;
import com.example.histogram.widet.HistogramView;

import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

import android.annotation.SuppressLint;

import android.view.View.OnClickListener;
import android.view.animation.Animation;
import android.view.animation.Transformation;

import android.widget.TextView;

/**
* 这是分析七天步数的碎片 Author: 李垭超 email:296777513@qq.com Date: 2015-1-2 Time: 下午2:39
*/
public class FragmentAnalysis extends Fragment implements OnClickListener {
private HistogramView hv1, hv2, hv3, hv4, hv5, hv6, hv7;// 这是7个条形柱状图

private TextView day1, day2, day3, day4, day5, day6, day7;// 这是底部显示的一周7天

private TextView average_step;// 平均步数
private TextView sum_step;// 总共步数

private int average = 0;
private int sum = 0;
private int average1 = 0;
private int sum1 = 0;

private Calendar calendar;// 日期的操作
private String day;

private View view;

private AllAnimation ani;// 设置的动画

@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
view = inflater.inflate(R.layout.analysis, container, false);
return view;
}

@Override
public void onActivityCreated(Bundle savedInstanceState) {
super.onActivityCreated(savedInstanceState);
init();
setWeek();
setProgress();
view.startAnimation(ani);

}

/**
* 初始化一些对象
*/
private void init() {
average_step = (TextView) view.findViewById(R.id.average_step);
sum_step = (TextView) view.findViewById(R.id.sum_step);
ani = new AllAnimation();// 创建自定义的动画对象
ani.setDuration(1000);// 设置完成动画的时间为1秒

calendar = Calendar.getInstance();// 对日期进行实例化,显示当天的日期

hv1 = (HistogramView) view.findViewById(R.id.map1);
hv2 = (HistogramView) view.findViewById(R.id.map2);
hv3 = (HistogramView) view.findViewById(R.id.map3);
hv4 = (HistogramView) view.findViewById(R.id.map4);
hv5 = (HistogramView) view.findViewById(R.id.map5);
hv6 = (HistogramView) view.findViewById(R.id.map6);
hv7 = (HistogramView) view.findViewById(R.id.map7);

// 对7个柱状图设置点击时间,可以显示具体的数值
hv1.setOnClickListener(this);
hv2.setOnClickListener(this);
hv3.setOnClickListener(this);
hv4.setOnClickListener(this);
hv5.setOnClickListener(this);
hv6.setOnClickListener(this);
hv7.setOnClickListener(this);

// 显示对应的周数
day1 = (TextView) view.findViewById(R.id.Monday);
day2 = (TextView) view.findViewById(R.id.Tuesday);
day3 = (TextView) view.findViewById(R.id.Wednesday);
day4 = (TextView) view.findViewById(R.id.Thursday);
day5 = (TextView) view.findViewById(R.id.Friday);
day6 = (TextView) view.findViewById(R.id.Saturday);
day7 = (TextView) view.findViewById(R.id.Sunday);

}

@SuppressLint("SimpleDateFormat")
private void setProgress() {
SimpleDateFormat sdf = new SimpleDateFormat("yyyyMMdd");
day = sdf.format(calendar.getTime());
// Toast.makeText(getActivity(), day + "", Toast.LENGTH_LONG).show();
hv1.setProgress((5000 / 10000.0));
sum += 5000;

calendar.add(Calendar.DAY_OF_MONTH, -1);//把日期设置成为
day = sdf.format(calendar.getTime());
hv2.setProgress((3000 / 10000.0));
sum += 3000;
// Toast.makeText(getActivity(), day+"", Toast.LENGTH_LONG).show();

calendar.add(Calendar.DAY_OF_MONTH, -1);
day = sdf.format(calendar.getTime());
hv3.setProgress((2000 / 10000.0));
sum += 2000;

calendar.add(Calendar.DAY_OF_MONTH, -1);
day = sdf.format(calendar.getTime());
hv4.setProgress((7631 / 10000.0));
sum += 7631;

calendar.add(Calendar.DAY_OF_MONTH, -1);
day = sdf.format(calendar.getTime());
hv5.setProgress((4213 / 10000.0));
sum += 4213;

calendar.add(Calendar.DAY_OF_MONTH, -1);
day = sdf.format(calendar.getTime());
hv6.setProgress((8431/ 10000.0));
sum += 8431;

calendar.add(Calendar.DAY_OF_MONTH, -1);
day = sdf.format(calendar.getTime());
hv7.setProgress((9999 / 10000.0));
sum += 9999;

}

/**
* 设置星期
*/
private void setWeek() {

int day = calendar.get(Calendar.DAY_OF_WEEK);//当天的周数
// Toast.makeText(getActivity(), day + "", Toast.LENGTH_LONG).show();
day -= 1;
day1.setText(week(day));
day2.setText(week(day - 1));
day3.setText(week(day - 2));
day4.setText(week(day - 3));
day5.setText(week(day - 4));
day6.setText(week(day - 5));
day7.setText(week(day - 6));
}

@Override
public void onClick(View arg0) {
switch (arg0.getId()) {
case R.id.map1:
hv1.setText(true);
hv2.setText(false);
hv3.setText(false);
hv4.setText(false);
hv5.setText(false);
hv6.setText(false);
hv7.setText(false);
view.invalidate();
break;
case R.id.map2:
hv1.setText(false);
hv2.setText(true);
hv3.setText(false);
hv4.setText(false);
hv5.setText(false);
hv6.setText(false);
hv7.setText(false);
view.invalidate();
break;
case R.id.map3:
hv1.setText(false);
hv2.setText(false);
hv3.setText(true);
hv4.setText(false);
hv5.setText(false);
hv6.setText(false);
hv7.setText(false);
view.invalidate();
break;
case R.id.map4:
hv1.setText(false);
hv2.setText(false);
hv3.setText(false);
hv4.setText(true);
hv5.setText(false);
hv6.setText(false);
hv7.setText(false);
view.invalidate();
break;
case R.id.map5:
hv1.setText(false);
hv2.setText(false);
hv3.setText(false);
hv4.setText(false);
hv5.setText(true);
hv6.setText(false);
hv7.setText(false);
view.invalidate();
break;
case R.id.map6:
hv1.setText(false);
hv2.setText(false);
hv3.setText(false);
hv4.setText(false);
hv5.setText(false);
hv6.setText(true);
hv7.setText(false);
view.invalidate();
break;
case R.id.map7:
hv1.setText(false);
hv2.setText(false);
hv3.setText(false);
hv4.setText(false);
hv5.setText(false);
hv6.setText(false);
hv7.setText(true);
view.invalidate();
break;

default:
break;
}

}

/**
* 将星期由阿拉伯数字变为汉字
* @param day
* @return
*/
private String week(int day) {
if (day < 1) {
day += 7;
}
switch (day) {
case 1:
return "周一";
case 2:
return "周二";
case 3:
return "周三";
case 4:
return "周四";
case 5:
return "周五";
case 6:
return "周六";
case 7:
return "周日";
default:
return "";
}
}

/**
* 自定义的一个动画类
* @author 李垭超
*
*/
private class AllAnimation extends Animation {
@Override
protected void applyTransformation(float interpolatedTime,
Transformation t) {
super.applyTransformation(interpolatedTime, t);
if (interpolatedTime < 1.0f) {
sum1 = (int) (sum * interpolatedTime);
average1 = (int) (average * interpolatedTime);
} else {
sum1 = sum;
average1 = average;
}
view.postInvalidate();
sum_step.setText(sum1 + "");
average = sum / 7;
average_step.setText(average1 + "");

}
}

}
       

FragmentAnalysis对应的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" >

<LinearLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:orientation="horizontal" >

<ImageView
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_gravity="left"
android:layout_marginLeft="10dp"
android:contentDescription="@string/app_name" />

<TextView
android:id="@+id/analysis"
android:layout_width="0dp"
android:layout_height="50dp"
android:layout_gravity="center"
android:layout_weight="1"
android:gravity="center"
android:text="@string/analysis"
android:textColor="#6DCAEC"
android:textSize="20sp" />

<ImageView
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_gravity="left"
android:layout_marginLeft="10dp"
android:contentDescription="@string/app_name" />
</LinearLayout>

<TextView
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="@android:color/darker_gray" />

<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="30dp"
android:orientation="horizontal" >

<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:text="@string/sumstep"
android:textSize="20sp" />

<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:text="@string/averagestep"
android:textSize="20sp" />
</LinearLayout>

<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >

<TextView
android:id="@+id/sum_step"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:text="@string/_0"
android:textColor="#6DCAEC"
android:textSize="30sp"
android:typeface="normal" />

<TextView
android:id="@+id/average_step"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:text="@string/_0"
android:textColor="#6DCAEC"
android:textSize="30sp" />
</LinearLayout>

<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="10"
android:orientation="horizontal" >

<com.example.histogram.widet.HistogramView
android:id="@+id/map1"
android:layout_width="30dp"
android:layout_height="250dp"
android:layout_gravity="bottom"
android:layout_marginLeft="40dp"
android:layout_marginTop="30dp" />

<com.example.histogram.widet.HistogramView
android:id="@+id/map2"
android:layout_width="30dp"
android:layout_height="250dp"
android:layout_gravity="bottom"
android:layout_marginLeft="5dp" />

<com.example.histogram.widet.HistogramView
android:id="@+id/map3"
android:layout_width="30dp"
android:layout_height="250dp"
android:layout_gravity="bottom"
android:layout_marginLeft="5dp" />

<com.example.histogram.widet.HistogramView
android:id="@+id/map4"
android:layout_width="30dp"
android:layout_height="250dp"
android:layout_gravity="bottom"
android:layout_marginLeft="5dp" />

<com.example.histogram.widet.HistogramView
android:id="@+id/map5"
android:layout_width="30dp"
android:layout_height="250dp"
android:layout_gravity="bottom"
android:layout_marginLeft="5dp" />

<com.example.histogram.widet.HistogramView
android:id="@+id/map6"
android:layout_width="30dp"
android:layout_height="250dp"
android:layout_gravity="bottom"
android:layout_marginLeft="5dp" />

<com.example.histogram.widet.HistogramView
android:id="@+id/map7"
android:layout_width="30dp"
android:layout_height="250dp"
android:layout_gravity="bottom"
android:layout_marginLeft="5dp" />
</LinearLayout>

<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp"
android:text="@string/_0k"
android:textSize="15sp" />

<TextView
android:layout_width="match_parent"
android:layout_height="3dp"
android:layout_gravity="center_vertical"
android:layout_marginLeft="5dp"
android:layout_marginRight="40dp"
android:background="@android:color/darker_gray" />
</LinearLayout>

<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="20dp"
android:layout_marginTop="5dp"
android:orientation="horizontal" >

<TextView
android:id="@+id/Monday"
android:layout_width="30dp"
android:layout_height="wrap_content"
android:layout_marginLeft="40dp"
android:text="@string/Monday"
android:textSize="15sp" />

<TextView
android:id="@+id/Tuesday"
android:layout_width="30dp"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:text="@string/Tuesday"
android:textSize="15sp" />

<TextView
android:id="@+id/Wednesday"
android:layout_width="30dp"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:text="@string/Wednesday"
android:textSize="15sp" />

<TextView
android:id="@+id/Thursday"
android:layout_width="30dp"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:text="@string/Thursday"
android:textSize="15sp" />

<TextView
android:id="@+id/Friday"
android:layout_width="30dp"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:text="@string/Friday"
android:textSize="15sp" />

<TextView
android:id="@+id/Saturday"
android:layout_width="30dp"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:text="@string/Saturday"
android:textSize="15sp" />

<TextView
android:id="@+id/Sunday"
android:layout_width="30dp"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:text="@string/Sunday"
android:textSize="15sp" />
</LinearLayout>

</LinearLayout>