android自定义View绘制天气温度曲线

转载请注明出处：http://blog.csdn.net/kaku2013/article/details/50091387

大家好，不久前写了个绘制天气温度曲线功能的demo今天抽空来和大家分享一下。

效果图如下：

运用到我的项目效果图：https://github.com/kaku2015/WeatherAlarmClock

一般绘制图表，可以直接使用类库来实现，类似的类库还是很多的。

例如：

hellocharts-android

WilliamChart

MPAndroidChart

上述类库功能很多，可以实现很多种图表，效果也是非常绚丽的。
那么为什么这里我还要尝试自己绘制天气温度曲线呢，原因如下：

1.由于类库实现的功能比较多相对代码也稍显复杂，要想实现需求要改的地方还是挺多的，尝试的修改了几个类库代码，最终还是没能完全符合自己的需求，有的改后也莫名其妙的出现了细微的bug，不知道是不是修改的原因…因此也浪费了挺长的时间，不过也学到了很多的东西。

2.这么强大类库用来实现功能、效果相对单一的天气温度曲线是不是有点杀鸡焉用宰牛刀呢！

主要还是没能通过类库完全实现自己的需求，无奈逼迫自己走上了自定义View这条荆棘之路…

由于本人接触安卓时间并不算长，还没有自定义过组件，所以对于自定义View还是比较畏惧的…

经过方案的思考与整理，发现自定义View来实现天气温度曲线并没有想象中的那么难，相反还是挺简单的，而且代码量也是相当的少，只需要覆写View类的 onDraw(Canvas canvas) 方法即可实现需求。

自定义View代码如下：

/*
 * Copyright (c) 2016 Kaku咖枯 <kaku201313@163.com | 3772304@qq.com>
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
   you may not use this file except in compliance with the License.
   You may obtain a copy of the License at

       http://www.apache.org/licenses/LICENSE-2.0

   Unless required by applicable law or agreed to in writing, software
   distributed under the License is distributed on an "AS IS" BASIS,
   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
   See the License for the specific language governing permissions and
   limitations under the License.
 */
package com.kaku.wcv;

import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.DashPathEffect;
import android.graphics.Paint;
import android.graphics.Path;
import android.util.AttributeSet;
import android.view.View;

import com.kaku.library.R;

// The plan
//*-----------------------------------------*
//                  SPACE                   *
//*-----------------------------------------*
//                  TEXT                    *
//*-----------------------------------------*
//               TEXT SPACE                 *
//*-----------------------------------------*
//                  RADIUS                  *
//*-----------------------------------------*
//                   |                      *
//                   |                      *
//                   |                      *
//        ---------(x,y)--------            *
//                   |                      *
//                   |                      *
//                   |                      *
//*-----------------------------------------*
//                  RADIUS                  *
//*-----------------------------------------*
//               TEXT SPACE                 *
//*-----------------------------------------*
//                  TEXT                    *
//*-----------------------------------------*
//                  SPACE                   *
//*-----------------------------------------*


/**
 * 折线温度双曲线
 *
 * @author 咖枯
 * @version 1.0 2015/11/06
 */
publi