Android 放图片背景的时钟

自定义View 时钟:可以用画布和画笔直接画时钟画刻度,画指针,但是,效果不是很好看,这篇文章主要介绍,两种采用背景图设置的时钟,包括表盘,指针,都是图片。

效果图:

                             


代码:

需要注意的是,指针放的位置,是根据指针图片资源而设置的,一定要注意,指针上得红点是在中心位置的,

放图片资源,有两种方法,

一种是:canvas.drawBitmap()这种方法只需确定图片的  左边和上边两个位置就好

第二种:dial.setBounds () 这种方法需要确定图片上下左右四边位置,画边界线

指针的旋转角度,逻辑都一样,都是先把指针放在零点方向,就是12点位置,然后根据时间算角度

最后是采用Handler 每隔一秒重新绘制时钟。。。。。。

View  1:


/**
 * Created by Megan on 16/3/29.
 */
public class ClockView extends View {

    //时钟图片
    private Bitmap mClock;
    //时
    private Bitmap mHourHand;
    //分
    private Bitmap mMinuteHand;
    //秒
    private Bitmap mSecondHand;

    private Calendar mCalendar;
    public static final int NEED_INVALIDATE = 0X23;

    //每隔一秒,在handler中调用一次重新绘制方法
    private Handler handler = new Handler() {
        @Override
        public void handleMessage(Message msg) {

            switch (msg.what) {
                case NEED_INVALIDATE:
                    mCalendar = Calendar.getInstance();
                    invalidate();//告诉UI主线程重新绘制
                    handler.sendEmptyMessageDelayed(NEED_INVALIDATE, 1000);
                    break;
                default:
                    break;
            }
        }
    };

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

    public ClockView(Context context, AttributeSet attrs) {
        super(context, attrs);

        mCalendar = Calendar.getInstance();
        Resources r = this.getContext().getResources();

        /**
         * 资源图片读取
         */
        mClock = BitmapFactory.decodeResource(r, R.drawable.clock_dial);
        mHourHand = BitmapFactory.decodeResource(r, R.drawable.clock_hour);
        mMinuteHand = BitmapFactory.decodeResource(r, R.drawable.clock_minute);
        mSecondHand = BitmapFactory.decodeResource(r, R.drawable.clock_second);
        handler.sendEmptyMessage(NEED_INVALIDATE);//向handler发送一个消息,让它开启重绘
    }


    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        int minute = mCalendar.get(Calendar.MINUTE);//得到当前分钟数
        int hour = mCalendar.get(Calendar.HOUR);//得到当前小时数
        int sec = mCalendar.get(Calendar.SECOND);//得到当前秒数
        Paint paint = new Paint();
        // TODO 时钟背景图
        canvas.drawBitmap(mClock, getWidth() / 2 - mClock.getWidth() / 2, getHeight() / 2 - mClock.getWidth() / 2, paint);
        canvas.save();//保存当前画布
        canvas.restore();

        // TODO 时针
        float hourDegree = (hour * 60 + minute) / 12f / 60 * 360;//得到时钟旋转的角度
        canvas.save();
        canvas.rotate(hourDegree, getWidth() / 2, getHeight() / 2);
        canvas.drawBitmap(mHourHand, getWidth() / 2-mHourHand.getWidth()/2, getHeight() / 2-mHourHand.getHeight()/2, paint);
        canvas.restore();

        // TODO 分针
        float minuteDegree = minute / 60f * 360;//得到分针旋转的角度
        canvas.save();
        canvas.rotate(minuteDegree, getWidth() / 2, getHeight() / 2);
        canvas.drawBitmap(mMinuteHand, getWidth()/2-mMinuteHand.getWidth()/2, getHeight()/2-mMinuteHand.getHeight()/2, paint);
        canvas.restore();

        // TODO 秒针
        float secDegree = sec / 60f * 360;//得到秒针旋转的角度
        canvas.save();
        canvas.rotate(secDegree, getWidth() / 2, getHeight() / 2);
        canvas.drawBitmap(mSecondHand, getWidth() / 2-mSecondHand.getWidth()/2, getHeight() / 2-mSecondHand.getHeight()/2, paint);
        canvas.restore();


    }
}

View 2:


/**
 * Created by Megan on 16/3/31.
 */
public class TimeView extends View {
    private static String TAG = "AbAnalogClock";
    private Drawable mHourHand;
    private Drawable mMinuteHand;
    private Drawable mSecondHand;
    private Drawable mDial;
    private Calendar mCalendar;
    public static final int NEED_INVALIDATE = 0X23;
    private Handler handler = new Handler(){
        @Override
        public void handleMessage(Message msg) {
            switch (msg.what) {
                case NEED_INVALIDATE:
                    mCalendar = Calendar.getInstance();
                    invalidate();//告诉UI主线程重新绘制
                    handler.sendEmptyMessageDelayed(NEED_INVALIDATE, 1000);
                    break;
                default:
                    break;
            }

        }
    };

    public TimeView(Context context, AttributeSet attrs) {
        super(context);
        mDial = this.getContext().getResources().getDrawable(R.drawable.clock_dial);
        mHourHand = this.getContext().getResources().getDrawable(R.drawable.clock_hour);
        mMinuteHand = this.getContext().getResources().getDrawable(R.drawable.clock_minute);
        mSecondHand = this.getContext().getResources().getDrawable(R.drawable.clock_second);
        mCalendar = Calendar.getInstance();
        handler.sendEmptyMessage(NEED_INVALIDATE);//向handler发送一个消息,让它开启重绘
    }

    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        int minute = mCalendar.get(Calendar.MINUTE);//得到当前分钟数
        int hour = mCalendar.get(Calendar.HOUR);//得到当前小时数
        int sec = mCalendar.get(Calendar.SECOND);//得到当前秒数

        int availableWidth = this.getRight() - this.getLeft();
        int availableHeight = this.getBottom() - this.getTop();
        int x = availableWidth / 2;
        int y = availableHeight / 2;
        Drawable dial = this.mDial;
        int w = dial.getIntrinsicWidth();
        int h = dial.getIntrinsicHeight();

        // TODO 时钟背景图
        if (availableWidth < w || availableHeight < h) {
            float hourHand = Math.min((float) availableWidth / (float) w, (float) availableHeight / (float) h);
            canvas.save();
            canvas.scale(hourHand, hourHand, (float) x, (float) y);
        }
        dial.setBounds(x - w / 2, y - h / 2, x + w / 2, y + h / 2);
        dial.draw(canvas);

        // TODO 时针
        canvas.save();
        canvas.rotate((hour * 60.0F + minute) /12 /60 * 360.0F, (float) x, (float) y);
        Drawable hourHand1 = this.mHourHand;
        w = hourHand1.getIntrinsicWidth();
        h = hourHand1.getIntrinsicHeight();
        hourHand1.setBounds(x - w / 2, y - h / 2, x + w / 2, y + h / 2);
        hourHand1.draw(canvas);
        canvas.restore();

        // TODO 分针
        canvas.save();
        canvas.rotate(minute / 60.0F * 360.0F, (float) x, (float) y);
        Drawable minuteHand = this.mMinuteHand;
        w = minuteHand.getIntrinsicWidth();
        h = minuteHand.getIntrinsicHeight();
        minuteHand.setBounds(x - w / 2, y - h / 2, x + w / 2, y + h / 2);
        minuteHand.draw(canvas);
        canvas.restore();

        // TODO 秒针
        canvas.save();
        canvas.rotate(sec / 60.0F * 360.0F, (float) x, (float) y);
        Drawable secondHand = this.mSecondHand;
        w = secondHand.getIntrinsicWidth();
        h = secondHand.getIntrinsicHeight();
        secondHand.setBounds(x - w / 2, y - h / 2, x + w / 2, y + h / 2);
        secondHand.draw(canvas);
        canvas.restore();

    }

}

源码: http://download.csdn.net/detail/qq55214/9479400





评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值