Android口袋天气系列五-->天气页面

源码暂时不会给，因为此应用博主是要制作出来上线的，而且现在只做了一部分

效果图：

思路：

1.天气页面里面主要是包含一些天气信息，界面主要是由一些简单的控件组成

2.自定义折线图的实现

3.开启一个AsyncTask ，获取天气信息

 

别的代码就不贴了，主要是折线图，折线图最好不要用用AchartEngine,要用自定义的控件，因为自定义的比较灵活多变。

          

/**
* 自定义趋势折线图
* Created by Administrator on 2016/5/15.
*/
public classTreadView extendsView{
    //传进来的高度和宽度
    private float Width;
    private float Height ;
    //趋势图实际的宽度和高度
    private float trendWidth;
    private float trendHeight ;

    //最高温度线绘制类，
    private Paint maxLinePaint;
    //最低温度线绘制类
    private Paint minLinePaint;
    //点绘制
    private Paint mPointPaint;
    //温度值文字绘制类
    private TextPaint textPaint;

    //最高温度值
    private ArrayList<Integer> maxTemps;
    //最低温度值
    private ArrayList<Integer> minTemps;

    //横向各温度点的x坐标,因为目前是五个点，所以数组长度目前设置为5,如果温度点不止五个，以后可以重新定义
    private float x[]=new float[5];

    public TreadView(Context context) {
        super (context);
    }

    public TreadView(Context context , AttributeSet attrs) {
        super (context,attrs);
        init() ;

    }
    //初始化
    public void init(){
        //文字绘制
        textPaint =newTextPaint();
        textPaint .setColor(Color.WHITE);
        textPaint .setTextSize(25f);
        textPaint .setAntiAlias(true);
        textPaint .setTextAlign(Paint.Align. CENTER);
        //最高气温线绘制
        maxLinePaint =newPaint();
        maxLinePaint .setColor(Color.YELLOW);
        maxLinePaint .setStrokeWidth(4f);
        maxLinePaint .setStyle(Paint.Style.FILL);

        //最低气温度线
        minLinePaint =newPaint();
        minLinePaint .setColor(Color.RED);
        minLinePaint .setStrokeWidth(4f);
        minLinePaint .setStyle(Paint.Style.FILL);

        //气温点绘制
        mPointPaint =newPaint();
        mPointPaint .setColor(Color.WHITE);
        mPointPaint .setAntiAlias(true);
    }

    /**
     * 传入温度值
     */
    public void setTemperature(ArrayList<Integer> maxTemps,ArrayList<Integer> minTemps){
        this .maxTemps=maxTemps;
        this.minTemps=minTemps;
        postInvalidate() ;
    }
    //如果控件本身没有设置具体的宽高值，必须传入宽高
    public void setSize(floatmWidth,floatmHeight){
        this .Width=mWidth;
        this.Height=mHeight;
    }

    /**
     * 测量
     * @paramwidthMeasureSpec
     * @paramheightMeasureSpec
     */
    @Override
    protected void onMeasure(intwidthMeasureSpec, intheightMeasureSpec) {
        super .onMeasure(widthMeasureSpec , heightMeasureSpec);
        setMeasuredDimension(measureWidth(widthMeasureSpec),measureHeight(heightMeasureSpec));
        trendWidth =measureWidth(widthMeasureSpec) ;
        trendHeight =measureHeight(heightMeasureSpec) ;
        //获得各温度点的横坐标值
        x [0]=trendWidth/10.0f;
        x [1]=trendWidth*3.0f/10.0f;
        x [2]=trendWidth*5.0f/10.0f;
        x [3]=trendWidth*7.0f/10.0f;
        x [4]=trendWidth*9.0f/10.0f;

    }
    //测量宽度
    private int measureWidth(intwidthMeasureSpec){
        int result=0;
        int specMode=MeasureSpec. getMode(widthMeasureSpec);
        int specSize=MeasureSpec. getSize(widthMeasureSpec);
        if (specMode==MeasureSpec. EXACTLY){
            result=specSize;

        }
        else {
            result=getPaddingLeft()+getPaddingRight()+(int)Width;
            if (specMode==MeasureSpec. AT_MOST){
                result=Math.min(result,specSize);
            }
        }
        return  result;
    }

   //测量高度
    private int measureHeight(intheightMeasureSpec){
        int result=0;
        int specMode=MeasureSpec. getMode(heightMeasureSpec);
        int specSize=MeasureSpec. getSize(heightMeasureSpec);
        if (specMode==MeasureSpec. EXACTLY){
            result=specSize;
        }
        else {
            result=getPaddingBottom()+getPaddingTop()+(int)Height;
            if (specMode==MeasureSpec. AT_MOST){
                result=Math.min(result,specSize);
            }
        }
        return  result;
    }
    /**
     * 绘制
     * @paramcanvas
     */
    @Override
    protected void onDraw(Canvas canvas) {
        super .onDraw(canvas);
        int mutiple= 9 ; //设置温度偏移量为8，根据屏幕分辨率设置

        //以控件的中央为0摄氏度
        float h=trendHeight/2.0f;
        //计算文字的高度
        Paint.FontMetrics  fontMetrics= textPaint.getFontMetrics();
        float fontHeight=fontMetrics. bottom-fontMetrics.top;

        //最高温度线的文字位置
        float h1=h-fontHeight;
        //最低温度线的文字位置
        float h2=h+fontHeight;
        //最高温度线的绘制
        for (inti=0;i<maxTemps.size();i++){
            float point=-maxTemps.get(i)*mutiple;
            if (i!=( maxTemps.size()-1)){
                float pointNext=- maxTemps.get(i+1)*mutiple;
                canvas.drawLine(x[i],point+h,x[i+1],pointNext+h,maxLinePaint);
            }
            canvas.drawCircle(x[i],point+h,8f,mPointPaint);
            canvas.drawText( maxTemps.get(i)+"°",x[i],point+h1,textPaint);
        }
        //最低温度线的绘制
        for (inti=0;i<minTemps.size();i++){
            float point=-minTemps.get(i)*mutiple;
            if (i!=( minTemps.size()-1)){
                float pointNext=- minTemps.get(i+1)*mutiple;
                canvas.drawLine(x[i],point+h,x[i+1],pointNext+h,minLinePaint);
            }
            canvas.drawCircle(x[i],point+h,8f,mPointPaint);
            canvas.drawText( minTemps.get(i)+"°",x[i],point+h2,textPaint);
        }

    }

}