基于Android的计步器(Pedometer)的讲解(二)——柱状图分析
浏览数：19 /
时间：2015年06月11日
写正文之前，小小的吐槽一下，还有一个月就放假了，作业、考试、还有实习（研一，下半学期课不多，也不想在实验室）的考虑，最近基于hadoop的数据分析马上也要验收了，真的忙的“外焦里嫩”啊！目前定的方向是Android开发，所以想过年来了找一个Android的实习工作，提高一点在真正的项目中的经验。
好了，说了这么多废话，开始进入正题吧。
整个计步器的项目已经上传到github上了，感兴趣的朋友可以去看看（最好能给小弟我打颗星星哦~）
https://github.com/296777513/pedometer
项目整体介绍前面介绍过：http://blog.csdn.net/a296777513/article/details/42339693
首先，这是两张今天要实现的效果图：
最主要的实现自己写的一个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:[email protected] * 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:[email protected] 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>郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。
