自定义天气View控件

最新推荐文章于 2024-05-21 09:40:13 发布

huxingnong

最新推荐文章于 2024-05-21 09:40:13 发布

阅读量488

点赞数

分类专栏：进阶前夕文章标签：自定义view

本文链接：https://blog.youkuaiyun.com/huxingnong/article/details/52783089

版权

本文介绍了如何模仿天气图片实现自定义view，遵循分析属性、定义XML属性、选择父类、重写onMeasure和onDraw方法的步骤。重点在于onDraw方法中利用数学知识绘制圆形。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

有段时间没有写博客了，由于国庆节和工作的原因，停了一周，继续捡起来。
这段时间学习了很多关于自定义view的知识，大多是学习zhy的教程。上周看到过朋友在朋友圈晒图，晒出一张老家的天气图片。看了一下，就模仿实现了下面的效果。首先上效果图：
这里写图片描述

首先分享一下我自己对自定义view步骤理解
（1）分析需要实现的view有哪些需要自定义的属性
（2）在attr.xml文件中定义需要实现的属性
（3）选择最合适的父类（这里很大可能是View，但是也可以是比较高级的view的子类，比如progressBar，TextView等）
（4）重写onMeasure方法（这里面主要是实现对xml布局文件中wrap_content和match_parent的处理）
（5）重写onDraw()方法，这个函数主要是利用了paint和canvas的一些api，具体可以参考[之前的一篇文章]。(http://blog.youkuaiyun.com/huxingnong/article/details/52486519)

下面介绍一些本次需要实现的过程：
本次继承的父类为View

public class WeatherView extends View
{
   

    /**
     * 一些非属性变量
     */
    private final Context mContext;
    private Paint mPaint;
    private Rect mBound;

    /**
     * 自定义的一些属性变量
     */
    private int mNormalColor = 0xaaffffff, mValueColor = Color.RED;
    private int mRadius = dp2Px(100);
    private int mLineWidth = dp2Px(15);
    private String mTemperature = "10°", mTip = "黄色暴风预警";
    private int mTemperatureSize = sp2Px(26), mTemperatureColor = 0xffff0000,
            mTipSize = sp2Px(14), mTipColor = 0x99ffffff;

    /**
     * 可以暴露给用户设置的接口，实现温度的变化
     */
    private final int mMaxValue = 30, mMinValue = 9;

    private Bitmap mBitmap;

    public WeatherView(Context context)
    {
        this(context, null);
    }

    public WeatherView(Context context, AttributeSet attrs)
    {
        this(context, attrs, 0);
    }

    public WeatherView(Context context, AttributeSet attrs, int defStyleAttr)
    {
        super(context, attrs, defStyleAttr);
        mContext = context;
        init(context, attrs);
    }

    /**
     * 初始化操作 包含画笔等的初始化 获得自定义的属性值
     * 
     * @param context
     * @param attrs
     */
    private void init(Context context, AttributeSet attrs)
    {
        mPaint = new Paint();
        mBound = new Rect();

        TypedArray taArray = context.ob

最低0.47元/天解锁文章