自定义温度显示控件(一)

立即下载用AI写一个

发布时间：2022-10-18

0人 | 浏览：1308次 | 收藏 |

技术：Android

运行环境：androidstudio

概述

自定义一个数值，小数点，温度符号均可灵活自定义的温度显示控件

详细

### 前言
在Android开发过程中，我们有时会涉及到自定义显示控件，那么今天就让我们来学习一个自定义温度显示控件吧。

今天涉及内容：
1. 为什么一个温度显示控件要自定义
2. 自定义温度显示控件`TempView`的几个方法
3. `TempView`在`MainActivity`中使用
4. 效果图和项目结构图

效果图如下：
![](/contentImages/image/20221018/4wKutN5kKW1708PwAq1.gif)

#### 一. 为什么一个温度显示控件要自定义
首先需要说明的是，这个自定义温度显示控件需要显示的内容只有一个温度数值和温度单位，类似：18.5°。很多人会疑问这不很简单吗？一个`TextView`表示就可以了，温度单位也可以用一个特殊符号表示，还需要自定义温度显示控件吗？
在实际开发中，特别是`UI`显示一块，可能温度单位显示的位置需要调整，或者温度值的整数部分，小数点，小数部分的大小，颜色，是否加粗等都需要给一个特定值，所以才出现了这篇文章，用于自定义定制显示温度数据的每一部分信息。
#### 二. 自定义温度显示控件TempView的几个方法
这里我自定义了一个温度显示控件`TempView`,其继承自`View`,如下：
```
public class TempView extends View {
     //其他代码省略
     //......
}
```
其主要用到的方法有两个，均是用于更新数据显示：
```
    /**刷新温度值**/
    public void updateView(String temp, String tempSub)

/**刷新温度值**/
    public void updateView(float temp)
```
#### 三. TempView在MainActivity中使用
在`MainActivity`对应布局`activity_main.xml`中引用 `TempView `控件:
```
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

<com.pain.testdemo.function.TempView
        android:id="@+id/temp_view"
        android:layout_width="@dimen/dp_100"
        android:layout_height="@dimen/dp_40"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/btn_test2"
        android:layout_marginTop="@dimen/dp_20"
        app:TempInt="@dimen/dp_30"
        app:TempDegreeStoken="1.5dp"
        app:TempDegreeRadius="2dp"
        app:TempDegreeSpace="1.5dp"
        app:TempPointRadius="1.5dp" />

</androidx.constraintlayout.widget.ConstraintLayout>
```
在`MainActivity`中使用`TempView`控件示例如下：
```
package com.pain.testdemo;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.TextView;

import com.pain.testdemo.function.TempView;
import com.pain.testdemo.util.MyUtil;

public class MainActivity extends AppCompatActivity implements View.OnClickListener{

private TextView mTv;
    private Button mBtn;
    private Button mBtn2;

private TempView mTempView;

@Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

MyUtil.i("=======onCreate======");

initView();
        initData();
        setListener();
    }

private void initView() {
        mTv = findViewById(R.id.tv_text);
        mBtn = findViewById(R.id.btn_test);
        mBtn2 = findViewById(R.id.btn_test2);
        mTempView = findViewById(R.id.temp_view);

}

private void initData() {

}

private void setListener() {
        mBtn.setOnClickListener(this);
        mBtn2.setOnClickListener(this);
    }

@Override
    public void onClick(View v) {
        switch (v.getId()) {
            case R.id.btn_test:
                MyUtil.i("=======test======");

//刷新温度
                mTempView.updateView(18.5f);
                break;
            case R.id.btn_test2:
                MyUtil.i("=======test2=====");

//刷新温度
                mTempView.updateView("27","");
                break;
            default:
                break;
        }

}

}
```
#### 四. 效果图和项目结构图
![](/contentImages/image/20221018/4wKutN5kKW1708PwAq1.gif)

![](/contentImages/image/20221018/FtDOvqPVvsNpZk4oTDx.png)

ok，今天关于自定义温度显示控件的知识就介绍到这里了。

本实例支付的费用只是购买源码的费用，如有疑问欢迎在文末留言交流，如需作者在线代码指导、定制等，在作者开启付费服务后，可以点击“购买服务”进行实时联系，请知悉，谢谢

感谢

手机上随时阅读、收藏该文章？请扫下方二维码

自定义温度显示控件(一)

概述

详细

相似例子推荐

评论

作者

评分详细

作者例子