画一个 自定义控件 房子动态吹风

最新推荐文章于 2024-04-24 16:41:00 发布
最新推荐文章于 2024-04-24 16:41:00 发布
阅读量165 收藏
点赞数
分类专栏： 自定义控件 文章标签： android 算法
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_32903439/article/details/109182902
版权

最近有需求需要画一个房子，要求能表达通风 ，显示温度和时间，借此机会，搞一个自定义控件

先看效果图，废话少说进入正题

 

 

1 先继承View 创建一个自定义控件 





public class House extends View {
   

    public House(Context context) {
        super(context);
        init(context, null, 0);
    }

    public House(Context context, AttributeSet attrs) {
        super(context, attrs);
        init(context, attrs,0);
    }

    public House(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
        init(context, attrs, defStyle);
    }


    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
      
    }




    public void init(Context context, AttributeSet attrs, int defStyle){
      

    }


  @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);


    }

}

 1View的三个构造函数   2 onMeasure 3 onDraw 运行顺序依次123 

基础做好了，然后准备一个画笔，放在init里

Paint paint;
paint =  new Paint();
paint.setColor(Color.WHITE);
paint.setAntiAlias(true);//抗锯齿
paint.setTextSize(16);

然后准备三张图，可以构成动态图，放在init里，顺便把它们放在数组中

 bitmap1= BitmapFactory.decodeResource(getResources(), R.drawable.house1);
 bitmap2= BitmapFactory.decodeResource(getResources(), R.drawable.house2);
 bitmap3= BitmapFactory.decodeResource(getResources(), R.drawable.house3);


 data[0] = bitmap1; // 第一个元素
 data[1] = bitmap2; // 第二个元素
 data[2] = bitmap3;

计算控件大小 ，在onMeasure 方法中执行，单位是像素，可以自己打印出来增加印象

height = getDefaultSize(getSuggestedMinimumHeight(), heightMeasureSpec);
width = getDefaultSize(getSuggestedMinimumWidth(), widthMeasureSpec);

我们要求把动态图片摆放在控件的正中央这时候就要计算了。我们用的画图方法是

canvas.drawBitmap(Bitmap bitmap, float left, float top, @RecentlyNullable Paint paint);

第一个参数很简单，就是图片，第二个参数表示距离父布局左边多长， 第三个显然就是距离父布局上边沿多远 ，第四个参数为画笔

那么，我们需要把图片放在整个view中间，就需要知道图片的长宽多少，我们用到这个方法

bitmap1.getWidth()，
bitmap1.getHeight()

我们的View 大小为 

width 和 height

知道了两者的大小，根据canvas.drawBitmap 的参数说明可以计算得到 当

left = width / 2-(bitmap1.getWidth()/2)

top = height / 2-(bitmap1.getHeight()/2),时 图片会居中显示 

所以我们在

onDraw 这个方法里画上bitmap 
canvas.drawBitmap(data[position], width / 2-(bitmap1.getWidth()/2),  height / 2-(bitmap1.getHeight()/2), paint);

然后我们还需要时间和温度 

这时候需要用到  canvas.drawText （ String text, float x, float y,  Paint paint）这个方法

参数和上面差不多，就不多解释了 看代码

  paint.setTextSize(width/15);
  paint.setStyle(Paint.Style.STROKE);
        
 canvas.drawBitmap(data[position], width / 2-(bitmap1.getWidth()/2),  height / 2-(bitmap1.getHeight()/2), paint);
        
 canvas.drawText(Temp, width/2-paint.getTextSize(), height/2-paint.getTextSize(), paint);
        
 paint.setTextSize(width/20);
 canvas.drawText(TimeDate, width/2-( 3*paint.getTextSize()), height/2, paint);

上面代码可以看出文字在View居中。 值得注意的是下面这个乘以3 的，因为我们知道时间是  这个格式 

11:59 星期三

前面的11:59  大概有三个字的大小，所以要乘3 。这样我们就得到一开始的效果图了

还剩最后一个问题，怎么让图片动起来，像帧动画一样一帧一帧播放

这时候我们需要用到定时器Timer ，有个方法是

schedule(TimerTask task, long delay, long period)
//第一个参数代表 执行任务事件
//第二个参数代表 延时几秒开始操作 单位毫秒
//第三个参数代表 每间隔几秒开始就执行一次 单位毫秒

 

创建一个任务事件类

 private class InputCheckTimerTask extends TimerTask {
        @Override
        public void run() {
            position++;
            if (position>2){
                position=0;
            }
            invalidate();
        }
    }

然后再创建一个设置设置图片的方法 

 public   void  setPosition(){

        if (mTimer == null)
            mTimer = new Timer();
        //第一个参数代表 执行任务事件
        //第二个参数代表 延时几秒开始操作 单位毫秒
        //第三个参数代表 每间隔几秒开始就执行一次 单位毫秒
        mTimer.schedule(mTask, 0, 1000);

    }

顺便再创建两个方法，让时间和日期可以更改

 public   void  setTemp(String string){
        Temp = string;
        invalidate();
    }


    public   void  setTimeDate(String string){
        TimeDate = string;
        invalidate();
    }

这样就做完了一个简单的动态吹风的房间了，我们来看一下最终代码

package com.davell.ventilationSystem.view;

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.util.AttributeSet;
import android.util.Log;
import android.view.View;

import com.davell.ventilationSystem.R;

import java.util.Timer;
import java.util.TimerTask;

public class House extends View {
     int height;
     int width;
     Paint paint;
    Bitmap bitmap1,bitmap2,bitmap3;

    Bitmap data[] = new Bitmap[3];
    /**
     * 输入检查任务，即 要重复的事件
     */
    InputCheckTimerTask mTask= new InputCheckTimerTask();
    /**
     * 定时器
     */
    Timer mTimer = null;

    int position = 0;

    String Temp = "88°C";

    String TimeDate = "11:59 星期三";

    public House(Context context) {
        super(context);
        init(context, null, 0);
    }

    public House(Context context, AttributeSet attrs) {
        super(context, attrs);
        init(context, attrs,0);
    }

    public House(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
        init(context, attrs, defStyle);
    }


    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
        Log.e("House","onMeasure" );
          height = getDefaultSize(getSuggestedMinimumHeight(), heightMeasureSpec);
          width = getDefaultSize(getSuggestedMinimumWidth(), widthMeasureSpec);

    }




    public void init(Context context, AttributeSet attrs, int defStyle){
        Log.e("House","init" );


        paint =  new Paint();
        paint.setColor(Color.WHITE);
        paint.setAntiAlias(true);
        paint.setTextSize(16);


        bitmap1= BitmapFactory.decodeResource(getResources(), R.drawable.house1);
        bitmap2= BitmapFactory.decodeResource(getResources(), R.drawable.house2);
        bitmap3= BitmapFactory.decodeResource(getResources(), R.drawable.house3);


//        bitmap1.setHeight();

        data[0] = bitmap1; // 第一个元素
        data[1] = bitmap2; // 第二个元素
        data[2] = bitmap3;
        setPosition();
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        Log.e("House","onDraw" );

        paint.setTextSize(width/15);
        paint.setStyle(Paint.Style.STROKE);

        canvas.drawBitmap(data[position], width / 2-(bitmap1.getWidth()/2),  height / 2-(bitmap1.getHeight()/2), paint);

        canvas.drawText(Temp, width/2-paint.getTextSize(), height/2-paint.getTextSize(), paint);

        paint.setTextSize(width/20);
        canvas.drawText(TimeDate, width/2-( 3*paint.getTextSize()), height/2, paint);
    }


    public   void  setPosition(){

        if (mTimer == null)
            mTimer = new Timer();
        //第一个参数代表 执行任务事件
        //第二个参数代表 延时几秒开始操作 单位毫秒
        //第三个参数代表 每间隔几秒开始就执行一次 单位毫秒
        mTimer.schedule(mTask, 0, 1000);

    }


    public   int  getPosition(){
       return position;

    }

    private class InputCheckTimerTask extends TimerTask {
        @Override
        public void run() {
            position++;
            if (position>2){
                position=0;
            }
            invalidate();
        }
    }
    public   void  setTemp(String string){
        Temp = string;
        invalidate();
    }


    public   void  setTimeDate(String string){
        TimeDate = string;
        invalidate();
    }


}

有需要的小伙伴可以直接复制代码拿去用就行了

 

 

 

魏亚笛
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
为C#自定义控件添加自定义事件
12-22
这里的自定义控件是由普通控件组合而成的。 　　希望事件响应代码推迟到使用自定义控件的窗体里写。 　　步骤一：新建一个用户控件，放两个按钮，Tag分别是btn1，btn2. 　　这两个按钮的共用单击事件处理代码如下： using System; using System.Collections.Generic; using System.ComponentModel; using System.Drawing; using System.Data; using System.Linq; using System.Text; using System.Windows.Form
自定义控件画动态模型（GDI）
06-25
使用GDI 做了个动态 图的 自定义控件，可以根据value 值做动态显示
C#自定义分页控件动态绑定
06-09
内容概况：自定义分页控件，实现了对数据的实时绑定，DataGridView等控件实现了完美兼容及绑定，能实时显示当前页码，总页码，页码选中的状态会记录，打比方你选中了第一页，当你切换到下一组页码时，第一页的选中状态会被保留记录，当你切回来原始页码时，第一页又会被重新选中 适用人群：所有人~ 使用场景：对分页功能有需求的
C#自定义控件VS用户控件
12-31
C#中自定义控件VS用户控件大比拼 1 自定义控件与用户控件区别 WinForm中， 用户控件（User Control）：继承自 UserControl，主要用于开发 Container 控件，Container控件可以添加其他Controls控件 自定义控件（Custom Control）：继承自 Control，主要用于开发windows控件的最基本的类，比如 Text,Button 控件 2 要开发自己的控件的几种方法[1] 复合控件（Composite Controls）：将现有的各种控件组合起来，形成一个新的控件，来满足用户的需求。 扩展控件（Extended Controls）
asp.net动态加载自定义控件的方法
10-24
主要介绍了asp.net动态加载自定义控件的方法,涉及asp.net动态加载控件的相关技巧,具有一定参考借鉴价值,需要的朋友可以参考下
自定义View的绘制流程（让你深入理解自定义View）
Natty的博客
10-15 3902
自定义view是干嘛的呢？ 当我们不满足于Android提供的原生控件和布局时，就应该考虑到自定义view。 自定义View分为两大块: 自定义控件 和 自定义容器 自定义View必须重写两个构造方法 第一个是一个参数的上下文，用于在java代码中new对象使用 第二个是两个参数的一个上下文，一个AttributSet。 主要用于在xml中定义使用。 OnMesure 计算出控件的大小...
利用dynamic动态创建对象
weixin_33688840的博客
12-18 580
dynamic MyDynamic = new System.Dynamic.ExpandoObject(); MyDynamic.A = "A"; MyDynamic.B = "B"; MyDynamic.C = "C"; MyDynamic.Number = 12; MyDynamic.MyMethod = new Func<int>(() => { ...
自定义 View - onDraw 过程详解
u011371324的专栏
04-21 1531
之前两篇文章分析了 onMeasure 过程和 onLayout 过程，不熟悉的童鞋可以回头去复习下，本篇文章来分析绘制过程的最后一个 onDraw 过程。这个过程的绘制使用到的 Paint 和 Canvas 在之前也有讲解到，在本篇的练习代码中有使用到，不会具体讲解这些知识点，不熟悉的话可以看看我之前的文章 自定义 View - Paint 详解 自定义 View - Canvas 详解 Vie...
Android onDraw()绘制流程解析
weixin_43864176的博客
08-19 1675
Android onDraw()绘制流程解析 文章目录Android onDraw()绘制流程解析组件绘制的那些结论1. ViewRootImpl的performDraw()方法2. View 类的 draw(Canvas canvas) 方法解析 组件绘制的那些结论 先看结论再看分析 绘制流程开始于performDraw()方法，该方法会调用根View（DecorView，也就是FrameLayout）draw()方法，所以绘制流程开始于ViewGroup的draw()方法。 draw()方法负责
android监听ondraw方法,Android视图绘制流程之onDraw()
weixin_28487433的博客
05-25 459
measure和layout的过程都结束后，接下来就进入到draw的过程了。同样，根据名字你就能够判断出，在这里才真正地开始对视图进行绘制。ViewRoot中的代码会继续执行并创建出一个Canvas对象，然后调用View的draw()方法来执行具体的绘制工作。draw()方法内部的绘制过程总共可以分为六步，其中第二步和第五步在一般情况下很少用到，因此这里我们只分析简化后的绘制过程。代码如下所示：p...
android九宫格布局解锁,Android onDraw()--九宫格解锁
weixin_39656206的博客
05-26 173
onDraw这个方法在自定义中尤其重要，我们可以measure之后通过Canvas进行绘制，九宫格解锁这个View现在已经被人脸跟指纹给替代了，但是做起来还是有点东西的。下面就是做这个View的思路：九个格子的布局格子之间的连线格子之间的连线所要考虑的问题一 . 格子布局之前写过onlayout来进行View的排放，那要继承于ViewGroup，这次我继承之View来实现。在onDraw中进行位置...
MFC OnDraw()函数 画图
weixin_40007143的博客
07-06 3648
MFC OnDraw()函数 画图。 以及DrawText()函数的nFormat参数。
react-native开发安卓端app
m0_73872315的博客
04-24 576
总之，第一次app开发还是颇废了我一番功夫的，可以说红温了很多次，不过好在最终没有夭折。。。接下来要做点啥好像暂时还没有思路，正在思考我需要点啥中。。。。
安卓基础知识-跨进程通信IPC篇
qq_38496750的博客
04-22 720
安卓基础知识-跨进程通信IPC篇
Android 跨进程通信
最新发布
Yimi-依米 的博客
04-24 205
Android中常用的跨进程通信方法有以下几种： Intent、Binder、AIDL、Messenger、ContentProvider。
概念Android AMS
weixin_45681365的博客
04-20 410
Android的Activity Manager Service（AMS）是负责管理整个系统中Activity生命周期、任务栈、应用启动等核心功能的系统服务。它通过系统级别的进程间通信（IPC）机制与应用程序组件交互，确保应用程序的行为符合Android的多任务处理逻辑和用户的预期。AMS是Android系统架构中的一个关键服务，它通过Binder IPC机制为上层应用程序提供服务。
Android --- Activity
weixin_43244083的博客
04-17 1315
Activity 提供窗口，供应在其中多个界面。此窗口通常会填满屏幕，但也可能小于屏幕并浮动在其他窗口之上。大多数应用包含多个屏幕，这意味着它们包含多个 Activity。通常，应用中的一个 Activity 会被指定主 Activity，即用户启动应用时显示的第一个屏幕。然后，每个 Activity 都可以启动另一个活动，以执行不同的操作。Activity提供一个能让用户操作并与之交互的界面。
Android startForegroundService与startForeground
linchuanzhi_886的专栏
04-18 323
service启动有四种形式。1.显示启动(如直接按service的全路径启动)2.隐示启动(如通过intent-filter的action标签启动)3.通过bindservice显示启动。4.通过bindservice隐示启动。
Android Native Hook: 原理、方案对比与具体实现
陆业聪
04-21 900
本文探讨了Android Native Hook技术，包括原理、实现方式（Inline Hook和PLT/GOT Hook）及优化建议，旨在帮助开发者更有效地应用该技术。
qml 动态添加多个自定义控件
10-04
在QML中，你可以使用动态创建组件的方法来添加多个自定义控件。你可以使用Qt.createComponent()函数来动态创建组件实例，并使用createObject()函数来创建组件的多个实例。以下是一个示例代码： ``` import QtQuick ...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值