自定义view（一）----自定义TextView

自定义view也算是Android的一大难点，里面涉及到很多值得学习的地方，我会在接下来写一系列文章去介绍它，本篇文章以自定义一个TextView为例。
View的构造方法
自定义view之前我们先了解view的四个构造方法，自定义view无非就是新建一个类去继承View，为了阅读方便，我们采用Java代码进行分析，首先定义一个类TextView2继承View，按照提示实现所有构造方法。

public class TextView extends View {public TextView(Context context) {super(context);}public TextView(Context context, @Nullable AttributeSet attrs) {super(context, attrs);}public TextView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {super(context, attrs, defStyleAttr);}public TextView(Context context, @Nullable AttributeSet attrs, int defStyleAttr, int defStyleRes) {super(context, attrs, defStyleAttr, defStyleRes);}
}

需要实现它的四个构造方法，我在下面分别给出每个构造方法的调用时期。

1.TextView(Context context)

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

这个构造方法通过阅读源码注释加以理解可以知道，它是在new对象时简单调用的构造方法，其中参数context是视图运行的上下文，通过它可以访问当前的主题、资源等。
2.TextView2(Context context, @Nullable AttributeSet attrs)

public TextView(Context context, @Nullable AttributeSet attrs) {super(context, attrs);}

上面这个构造方法是当TextView2在layout布局中使用时调用，参数：
context-----视图运行的上下文，通过它可以访问当前的主题、资源等
attrs-----使视图膨胀的XML标记的属性

3.TextView(Context context, @Nullable AttributeSet attrs, int defStyleAttr)

  public TextView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {super(context, attrs, defStyleAttr);}

这个构造方法调用时期是在自定义样式时调用，比如我们在layout视图中使用了我们自定义的某个style，就会调用这个构造方法，参数：
context-----视图运行的上下文，通过它可以访问当前的主题、资源等
attrs-----使视图膨胀的XML标记的属性
defStyleAttr-----当前主题中的一个属性，它包含对为视图提供默认值的样式资源的引用

4.TextView(Context context, @Nullable AttributeSet attrs, int defStyleAttr, int defStyleRes)

 public TextView(Context context, @Nullable AttributeSet attrs, int defStyleAttr, int defStyleRes) {super(context, attrs, defStyleAttr, defStyleRes);}

最后这个方法是后面才加入的，也很少用到，它的作用是从XML执行膨胀，并从主题属性或样式资源应用特定于类的基样式。 View的这个构造函数允许子类在膨胀时使用自己的基样式。当确定一个特定属性的最终值时，有四个输入会起作用。

  • 给定AttributeSet中的任何属性值。
  • 在AttributeSet中指定的样式资源(名为“style”)。
  • defStyleAttr指定的默认样式。
  • defStyleRes指定的默认样式。
    关于这个构造函数在使用时发现会报错，具体什么原因后面会细讲，现在先卖个关子。
    我们一般会对前三个构造方法进行改造，方便我们使用其中任何一个构造方法都能遍历所有构造方法，比如可以在第一个构造方法中调用第二个，在第二个中调用第三个，这样不管使用哪个构造方法都能实现我们构造方法中的业务逻辑。改造如下
//在第一个构造方法中调用第二个构造方法public TextView(Context context) {this(context, null);}//在第二个构造方法中调用第三个构造方法public TextView(Context context, @Nullable AttributeSet attrs) {this(context, attrs, 0);}//通常在第三个构造方法中获取自定义属性public TextView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {super(context, attrs, defStyleAttr);}

自定义属性并获取自定义属性

接上文，我们自定义view入门就是自定义一个Textview，系统提供的TextView在布局中使用时基本上如下所示：

<com.example.viewday_01.TextViewandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:background="#FF0000"app:wqqinputType="number"app:wqqtext="我是安徽人"android:padding="50dp"app:wqqtextSize="20sp"/>

一个TextView必须具备的就是宽和高的指定，这个在在定义的下一部分会讲，还有就是后面三句，对wqqtext、wqqinputType和wqqtextSize进行了赋值，这三个就是view的属性，那我们在自定义view时属性也是需要自定义的，那怎么进行属性的自定义呢，我在这里将它分为以下几步。
1、创建自定义属性资源文件
在res文件夹下的value模块创建一个Values Resource File取名为attrs（可以自由取名），在内部实现三个自定义属性wqqtext、wqqinputType、wqqtextSize，如下：

<?xml version="1.0" encoding="utf-8"?>
<resources><declare-styleable name="TextView"><attr name="wqqtext" format="string"/><attr name="wqqtextcolor" format="color"/><attr name="wqqtextSize" format="dimension"/><attr name="wqqmaxLength" format="integer"/><attr name="wqqinputType"><enum name="number" value="1"></enum><enum name="text" value="1"></enum><enum name="password" value="1"></enum></attr></declare-styleable>
</resources>

现在就是已经自定义了三个属性wqqtext、wqqtextcolor、wqqtextSize，wqqmaxLength，wqqinputType分别是string型、color型、dimension型、integer型、枚举。值得注意的是在自定义属性时系统已经有的属性不能被重复定义，所以name不能用text、textColor和textSize，不然会被认定为重新定义系统属性而报错。
2、在布局文件中使用
接下来可以仿照TextView在布局文件中使用

<com.example.viewday_01.TextViewandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:background="#FF0000"app:wqqinputType="number"app:wqqtext="我是安徽人"android:padding="50dp"app:wqqtextSize="20sp"/>

注意：这里有个app的命名空间，需要添加在xml文件中：xmlns:app=“http://schemas.android.com/apk/res-auto”
我们使用了自定义的TextView，并将自定义属性赋值，但是运行还是没有效果，因为我们还需要将自定义的属性与原本的属性相关联。

3.获取自定义属性
一般在第三个构造方法中获取属性，整体代码如下，请看注释：

public class TextView extends View {private String mText;private int mTextSize = 15;private int mTextColor = Color.BLACK;private Paint mPaint;//在代码里面new的时候会调用该构造函数public TextView(Context context) {this(context, null);}//在布局里面调用public TextView(Context context, @Nullable AttributeSet attrs) {this(context, attrs, 0);}//在布局中调用，会有stylepublic TextView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {super(context, attrs, defStyleAttr);//获取自定义属性TypedArray array = context.obtainStyledAttributes(attrs, R.styleable.TextView);mText = array.getString(R.styleable.TextView_wqqtext);mTextColor = array.getColor(R.styleable.TextView_wqqtextcolor,mTextColor);mTextSize = array.getDimensionPixelSize(R.styleable.TextView_wqqtextSize, sp2px(mTextSize));//回收array.recycle();mPaint = new Paint();// 抗锯齿，这样画出来的不会模糊mPaint.setAntiAlias(true);//设置画笔字体的大小和颜色mPaint.setTextSize(mTextSize);mPaint.setColor(mTextColor);}
}

运行起来发现还是没有效果，因为还没有指定宽高和绘画，且往下看。

自定义View中的onMeaSure()

我们在上面实现的代码运行起来依旧一片空白，我也说了是因为没有指定宽高和进行绘画。

protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {super.onMeasure(widthMeasureSpec, heightMeasureSpec);//布局的宽高由这个方法指定//指定控件的宽高int widthMode = MeasureSpec.getMode(widthMeasureSpec);int heightMode = MeasureSpec.getMode(heightMeasureSpec);//1.确定的值，不需要计算，给的多少就是多少,比如match_parentint width = MeasureSpec.getSize(widthMeasureSpec);//2.wrap_content,需要计算if (widthMode == MeasureSpec.AT_MOST) {//计算的宽度与字体的长度 与字体的大小有关 用画笔来测量Rect bounds = new Rect();//获取文本的RectmPaint.getTextBounds(mText,0,mText.length(),bounds);width = bounds.width() + getPaddingLeft() + getPaddingRight();}int height = MeasureSpec.getSize(heightMeasureSpec);if (heightMode == MeasureSpec.AT_MOST) {//计算的宽度与字体的长度 与字体的大小有关 用画笔来测量Rect bounds = new Rect();//获取文本的RectmPaint.getTextBounds(mText,0,mText.length(),bounds);height = bounds.height() + getPaddingBottom() + getPaddingTop();}//设置控件的宽高setMeasuredDimension(width,height);}

如上面代码所示，getMode()能够获取到三个有效值，每个值对应哪种情况，值得注意的是确切值和match_parent都是对应MeasureSpec.EXACTLY，我看到好多博客都把match_parent写成对应MeasureSpec.UNSPECIFIED，这是错误的。
在了解三种测量模式后，我们就可以针对不同情况对view指定宽高，根据三种模式分为三种情况：

1、确切的值，不需要计算，给多少就是多少
2、给的是wrap_content，需要计算宽高，使用画笔进行计算

自定义View中的onDraw()

我们在上面实现计算控件宽高，但是显示不出文字，是因为还没进行绘画，所以还需要实现它的onDraw()方法。

protected void onDraw(Canvas canvas) {super.onDraw(canvas);//画文字 text x y paint// x:开始的位置 y:基线 baselinePaint.FontMetricsInt fontMetricsInt = mPaint.getFontMetricsInt();int dy = (fontMetricsInt.bottom - fontMetricsInt.top)/2 - fontMetricsInt.bottom;int baseLine = getHeight()/2 + dy;int x = getPaddingLeft();canvas.drawText(mText,x,baseLine, mPaint);}

下面借助一张图来解释一下为什么要这样算基线的值
在这里插入图片描述
如果我们想要文字竖直居中，那么基线位置如图中BaseLine一样，先来梳理一下现在的已知条件，
getHeight()/2------整个视图高度的一半
FontMetricsInt.top ----基线到文字顶部的距离，是一个负值
FontMetricsInt.bottom–基线到文字底部的距离，是一个正值
假设基线的值y=getHeight()/2+dy
dy表示基线与高度的一半之间的距离。
dy=(fontMetricsInt.bottom-fontMetricsInt.top)/2-fontMetricsInt.bottom
这样基线的值就可以计算出来了。
整个控件还是以控件的左上角为原点来进行坐标的映射的。故canvas.drawText(mText,x,baseLine, mPaint)的x，y是以坐标原点来算的。

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.hqwc.cn/news/28765.html

如若内容造成侵权/违法违规/事实不符，请联系编程知识网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！

相关文章

如何通过边缘智能网关实现暴雨灾害监测预警

如何通过边缘智能网关实现暴雨灾害监测预警

随着台风季来临&#xff0c;暴雨灾害也进入到频发阶段&#xff0c;给村镇和城市居民都造成诸多人身和财产损失。针对南方台风季的水灾防治&#xff0c;物联网技术派上大用场&#xff0c;本篇就基于边缘智能网关的数采方案&#xff0c;简单介绍对暴雨导致的洪涝、内涝的监测和预…
阅读更多...
解放研究者：GPT自动化科研

解放研究者：GPT自动化科研

GPT Researcher 是一个自主代理程序&#xff0c;旨在进行多种任务的全面在线研究。 该代理能够生成详细、事实性和公正的研究报告&#xff0c;并提供个性化选项&#xff0c;以便关注相关资源、大纲和教训。受到AutoGPT和最近的Plan-and-Solve论文的启发&#xff0c;GPT Researc…
阅读更多...
Revit防护栏怎么做？用栏杆族实现

Revit防护栏怎么做？用栏杆族实现

​　　做一些公路类似的项目&#xff0c;要做一些防护栏&#xff0c;我们该怎么做? 今天分享一下&#xff0c;如何造型及方便的去放置。我们都知道栏杆族的特性是可以沿线放置&#xff0c;那么好办。在了解了一些族特性后&#xff0c;我们就可以根据这些特性来做些文章。 第一…
阅读更多...
FiddlerScript修改指定参数的返回值

FiddlerScript修改指定参数的返回值

FiddlerScript修改指定参数的返回值 使用场景&#xff1a; api/Live/GetLiveList接口&#xff1a; &#xff08;1&#xff09;Type为1&#xff0c;接口返回直播列表 &#xff08;2&#xff09;Type为2&#xff0c;接口返回回放列表 现在想修改直播列表的返回值 思路&#…
阅读更多...
使用NRF52840 USB Dongle进行Wireshark蓝牙抓包

使用NRF52840 USB Dongle进行Wireshark蓝牙抓包

一、搭建软硬件环境 1.1、准备NRF52840 USB Dongle一个&#xff1a; 1.2、下载Wireshark软件 https://2.na.dl.wireshark.org/win64/Wireshark-win64-4.0.7.exe 1.3、下载Nodic官方解析工具包 nRF Sniffer for Bluetooth LE - Downloads - nordicsemi.com 1.4、下载Python P…
阅读更多...
如何实现CAN-SOME/IP通信路由测试

如何实现CAN-SOME/IP通信路由测试

区别于基于UDP的车内通信路由&#xff0c;基于SOME/IP协议的路由增加了服务发现&#xff08;Service Discovery&#xff09;和服务发布&#xff08;Service Publish&#xff09;&#xff0c;那对于测试工程师来说&#xff0c;怎么实现CAN-SOME/IP路由的测试呢&#xff1f; 01 …
阅读更多...
适用于 Type-C接口PD应用的智能二极管保护开关

适用于 Type-C接口PD应用的智能二极管保护开关

日前&#xff0c;集设计、研发、生产和全球销售一体的著名功率半导体、芯片及数字电源产品供应商Alpha and Omega Semiconductor Limited&#xff08;AOS, 纳斯达克代码:AOSL) 推出一款采用理想二极管运作进行反向电流保护的新型Type-C PD 高压电源输入保护开关。AOZ13984DI-02…
阅读更多...
为 GitHub 设置 SSH 密钥

为 GitHub 设置 SSH 密钥

1. 起因 给自己的 github 改个名&#xff0c;顺便就给原来 Hexo 对应的仓库也改了个名。然后发现 ubhexo clean && hexo generate && hexo deploy 失败了&#xff0c;报错如下&#xff1a; INFO Deploying: git INFO Clearing .deploy_git folder... INFO …
阅读更多...
【矩阵的基本操作】——MatLab基础

【矩阵的基本操作】——MatLab基础

目录索引 矩阵的基本操作&#xff1a;转置&#xff1a;矩阵的拼接&#xff1a;*横拼&#xff1a;**竖拼&#xff1a;* 矩阵的索引&#xff1a;取元素&#xff1a;*end():* 取区域&#xff1a;逻辑判断&#xff1a;逻辑取值&#xff1a;find()&#xff1a; 矩阵的基本操作&#…
阅读更多...
我在VScode学Java类与对象（Java显式参数和隐式参数、静态方法+main方法、Java访问修饰符、static关键字、Java的包、对象数组）第三辑

我在VScode学Java类与对象（Java显式参数和隐式参数、静态方法+main方法、Java访问修饰符、static关键字、Java的包、对象数组）第三辑

我的个人博客主页&#xff1a;如果’真能转义1️⃣说1️⃣的博客主页 关于Java基本语法学习---->可以参考我的这篇博客&#xff1a;《我在VScode学Java》 续《我在VScode学Java&#xff08;Java的类与对象&#xff09;》 方法会操作对象并访问他们的实例字段。 伍._. 显式参…
阅读更多...
爬虫与反爬虫的攻防对抗

爬虫与反爬虫的攻防对抗

一、爬虫的简介 1 概念 爬虫最早源于搜索引擎&#xff0c;它是一种按照一定的规则&#xff0c;自动从互联网上抓取信息的程序&#xff0c;又被称为爬虫&#xff0c;网络机器人等。按爬虫功能可以分为网络爬虫和接口爬虫&#xff0c;按授权情况可以分为合法爬虫和恶意爬虫。恶…
阅读更多...
【PDF】HTML通过dom节点生成pdf

【PDF】HTML通过dom节点生成pdf

1、简要描述 上一篇博客主要讲的是pdf文件转换成canvas&#xff0c;然后进行相关的画框截图操作。 【PDF】Canvas绘制PDF及截图 本篇博客主要讲html中dom如何生成pdf文件&#xff08;前端生成pdf&#xff09;&#xff0c;后端生成pdf当然也可以&#xff0c;原理也是将html网…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023