安卓开发:自定义组合控件布局(kotlin语言)

原创 已于 2023-04-06 12:01:52 修改 · 703 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#android #android studio #webview

于 2023-04-06 11:57:49 首次发布
本文介绍了如何在安卓开发中利用Kotlin语言创建自定义的组合控件布局。通过布局文件的设计，自定义布局类的编写，以及具体的使用示例，详细阐述了这一过程。

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

布局文件

<?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:id="@+id/idInputLayout"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:visibility="visible"
    tools:context=".MyInputNumberView">>

    <Button
        android:id="@+id/idInput0"
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:autoSizeTextType="uniform"
        android:text="0"
        app:cornerRadius="50dp"
        app:layout_constraintStart_toEndOf="@+id/idInput9"
        app:layout_constraintTop_toBottomOf="@+id/idInput5" />

    <Button
        android:id="@+id/idInput6"
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:autoSizeTextType="uniform"
        android:text="6"
        app:cornerRadius="50dp"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/idInput1" />

    <Button
        android:id="@+id/idInput7"
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:autoSizeTextType="uniform"
        android:text="7"
        app:cornerRadius="50dp"
        app:layout_constraintStart_toEndOf="@+id/idInput6"
        app:layout_constraintTop_toBottomOf="@+id/idInput2" />

    <Button
        android:id="@+id/idInput8"
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:autoSizeTextType="uniform"
        android:text="8"
        app:cornerRadius="50dp"
        app:layout_constraintStart_toEndOf="@+id/idInput7"
        app:layout_constraintTop_toBottomOf="@+id/idInput3" />

    <Button
        android:id="@+id/idInput9"
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:autoSizeTextType="uniform"
        android:text="9"
        app:cornerRadius="50dp"
        app:layout_constraintStart_toEndOf="@+id/idInput8"
        app:layout_constraintTop_toBottomOf="@+id/idInput4" />

    <Button
        android:id="@+id/idInput5"
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:autoSizeTextType="uniform"
        android:text="5"
        app:cornerRadius="50dp"
        app:layout_constraintStart_toEndOf="@+id/idInput4"
        app:layout_constraintTop_toTopOf="@+id/idInput3" />

    <Button
        android:id="@+id/idInput4"
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:autoSizeTextType="uniform"
        android:text="4"
        app:cornerRadius="50dp"
        app:layout_constraintStart_toEndOf="@+id/idInput3"
        app:layout_constraintTop_toTopOf="@+id/idInput3" />

    <Button
        android:id="@+id/idInput3"
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:autoSizeTextType="uniform"
        android:text="3"
        app:cornerRadius="50dp"
        app:layout_constraintStart_toEndOf="@+id/idInput2"
        app:layout_constraintTop_toBottomOf="@+id/idInputText" />

    <Button
        android:id="@+id/idInput2"
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:autoSizeTextType="uniform"
        android:text="2"
        app:cornerRadius="50dp"
        app:layout_constraintStart_toEndOf="@+id/idInput1"
        app:layout_constraintTop_toTopOf="@+id/idInput3" />

    <Button
        android:id="@+id/idInputDec"
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:autoSizeTextType="uniform"
        android:text="-"
        app:cornerRadius="5dp"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <Button
        android:id="@+id/idInputAdd"
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:autoSizeTextType="uniform"
        android:text="+"
        app:cornerRadius="5dp"
        app:layout_constraintStart_toEndOf="@+id/idInputText"
        app:layout_constraintTop_toTopOf="parent" />

    <Button
        android:id="@+id/idInput1"
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:autoSizeTextType="uniform"
        android:text="1"
        android:textAlignment="center"
        app:cornerRadius="50dp"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/idInputDec" />

    <EditText
        android:id="@+id/idInputText"
        android:layout_width="150dp"
        android:layout_height="50dp"
        android:autoSizeTextType="uniform"
        android:editable="true"
        android:ems="10"
        android:inputType="text"
        app:layout_constraintEnd_toStartOf="@+id/idInputAdd"
        app:layout_constraintStart_toEndOf="@+id/idInputDec"
        app:layout_constraintTop_toTopOf="parent" />

    <Button
        android:id="@+id/idInputDel"
        android:layout_width="70dp"
        android:layout_height="0dp"
        android:autoSizeTextType="uniform"
        android:text="del"
        app:cornerRadius="20dp"
        app:layout_constraintBottom_toTopOf="@+id/idInput5"
        app:layout_constraintStart_toEndOf="@+id/idInputAdd"
        app:layout_constraintTop_toTopOf="parent" />

    <Button
        android:id="@+id/idInputComfirm"
        android:layout_width="70dp"
        android:layout_height="0dp"
        android:autoSizeTextType="uniform"
        android:text="@string/str_confirm"
        android:textColor="@color/orange"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintStart_toEndOf="@+id/idInput0"
        app:layout_constraintTop_toBottomOf="@+id/idInputDel" />
</androidx.constraintlayout.widget.ConstraintLayout>

布局类

package xuganquan.app.topwisdom

import android.content.Context
import android.text.Editable
import android.text.TextWatcher
import android.view.LayoutInflater
import androidx.constraintlayout.widget.ConstraintLayout
import xuganquan.app.topwisdom.databinding.MylayoutInputNumberBinding

interface IOnMyInputChange{
    fun onMyInputChange(str: String)
}

class MyInputNumberView: ConstraintLayout {
    private lateinit var binding: MylayoutInputNumberBinding

    /*private var mDec:Button?= null
    private var mAdd:Button?= null
    private var mDel:Button?= null
    private var mConfirm:Button?= null
    private var mText:TextView?= null


    private var mInput1:Button?= null
    private var mInput2:Button?= null
    private var mInput3:Button?= null
    private var mInput4:Button?= null
    private var mInput5:Button?= null
    private var mInput6:Button?= null
    private var mInput7:Button?= null
    private var mInput8:Button?= null
    private var mInput9:Button?= null
    private var mInput0:Button?= null*/

    private var mValueStr:String= "0"
    public lateinit var mlistener:IOnMyInputChange

    constructor(context: Context):super(context){
        binding=MylayoutInputNumberBinding.inflate(LayoutInflater.from(context),this,true)
        binding.idInputText.setText("")  //.text baocuo
        setUpEvent()
    }


    init{
/*
        mDec=bindingView.findViewById<Button>(R.id.idInputDec)
        mAdd=bindingView.findViewById<Button>(R.id.idInputAdd)
        mDel=bindingView.findViewById<Button>(R.id.idInputDel)
        mConfirm=bindingView.findViewById<Button>(R.id.idInputComfirm)
        mText=bindingView.findViewById<TextView>(R.id.idInputText)


        mInput1=bindingView.findViewById<Button>(R.id.idInput1)
        mInput2=bindingView.findViewById<Button>(R.id.idInput2)
        mInput3=bindingView.findViewById<Button>(R.id.idInput3)
        mInput4=bindingView.findViewById<Button>(R.id.idInput4)
        mInput5=bindingView.findViewById<Button>(R.id.idInput5)
        mInput6=bindingView.findViewById<Button>(R.id.idInput6)
        mInput7=bindingView.findViewById<Button>(R.id.idInput7)
        mInput8=bindingView.findViewById<Button>(R.id.idInput8)
        mInput9=bindingView.findViewById<Button>(R.id.idInput9)
        mInput0=bindingView.findViewById<Button>(R.id.idInput0)*/

    }


    // 4. 处理事件
    private fun setUpEvent() {
        binding.idInputText.addTextChangedListener( object: TextWatcher {
            override fun afterTextChanged(s: Editable) {}
            override fun beforeTextChanged(
                s: CharSequence,
                start: Int,
                count: Int,
                after: Int
            ) {
            }

            override fun onTextChanged(
                s: CharSequence,
                start: Int,
                before: Int,
                count: Int
            ) {
               // listener?.onMyInputChange(mValueStr)
            }
        })

        binding.idInputDec.setOnClickListener {
            mValueStr=binding.idInputText.text.toString()
            var mValueInt=mValueStr.toIntOrNull()
            if(null==mValueInt)
                 mValueInt=0
            else
                mValueInt-=1
            mValueStr=mValueInt.toString()
            updateValueText()
        }
        binding.idInputAdd.setOnClickListener {
            mValueStr=binding.idInputText.text.toString()
            var mValueInt2=mValueStr.toIntOrNull()
            if(null==mValueInt2)
                mValueInt2=0
            else
                mValueInt2 += 1

            mValueStr=mValueInt2.toString()
            updateValueText()
        }
        binding.idInputDel.setOnClickListener {
            mValueStr=""
            updateValueText()
        }

        binding.idInputComfirm.setOnClickListener {
            mValueStr=binding.idInputText.text.toString()
            mlistener.onMyInputChange(mValueStr)
        }

        binding.idInput1.setOnClickListener {
            mValueStr=binding.idInputText.text.toString()
            mValueStr+="1"
            updateValueText()
        }
        binding.idInput2.setOnClickListener {
            mValueStr=binding.idInputText.text.toString()
            mValueStr+="2"
            updateValueText()
        }
        binding.idInput3.setOnClickListener {
            mValueStr=binding.idInputText.text.toString()
            mValueStr+="3"
            updateValueText()
        }
        binding.idInput4.setOnClickListener {
            mValueStr=binding.idInputText.text.toString()
            mValueStr+="4"
            updateValueText()
        }
        binding.idInput5.setOnClickListener {
            mValueStr=binding.idInputText.text.toString()
            mValueStr+="5"
            updateValueText()
        }
        binding.idInput6.setOnClickListener {
            mValueStr=binding.idInputText.text.toString()
            mValueStr+="6"
            updateValueText()
        }
        binding.idInput7.setOnClickListener {
            mValueStr=binding.idInputText.text.toString()
            mValueStr+="7"
            updateValueText()
        }
        binding.idInput8.setOnClickListener {
            mValueStr=binding.idInputText.text.toString()
            mValueStr+="8"
            updateValueText()
        }
        binding.idInput9.setOnClickListener {
            mValueStr=binding.idInputText.text.toString()
            mValueStr+="9"
            updateValueText()
        }
        binding.idInput0.setOnClickListener {
            mValueStr=binding.idInputText.text.toString()
            mValueStr+="0"
            updateValueText()
        }

    }
    private fun updateValueText() {
        binding.idInputText.setText(mValueStr)  //.textbaocuo
    }


}

使用示例

val inputView1 = MyInputNumberView(mLayout.context).apply {
    visibility = View.INVISIBLE
    id = mNewID++
    layoutParams = ConstraintLayout.LayoutParams(mWidth, mHeight).apply {

        startToStart = mID
        topToTop = mID
        //endToEnd = mID
        //bottomToBottom = mID

        leftMargin = mViewMargins[1][0]
        topMargin = mViewMargins[1][1]
        //rightMargin =mViewMargins[1][2]
        // bottomMargin=mViewMargins[1][3]

        //width = mViewSizes[1][0]
        //height = mViewSizes[1][1]

    }

    mLayout.addView(this)
    visibility = View.VISIBLE
}

大象abc
关注
移动开发领域，Kotlin的帧布局应用
移动开发前沿的博客
06-15 698
本文聚焦Android移动开发场景，重点讲解如何用Kotlin语言高效操作帧布局（FrameLayout）。内容覆盖帧布局的核心特性、Kotlin代码实现技巧、典型应用场景（如加载提示、徽章标记、多图层动画），以及性能优化注意事项，适合从初级到中级的Android开发者学习。本文将按照“生活场景引入→核心概念解析→Kotlin代码实战→典型场景应用→未来趋势”的逻辑展开，通过大量代码示例和类比说明，确保读者能轻松理解并上手使用。帧布局（FrameLayout）
深入移动开发领域，学习Kotlin的自定义控件开发
最新发布
移动开发前沿的博客
05-12 597
本文旨在为Android开发者提供全面的Kotlin自定义控件开发指南，涵盖从基础概念到高级技巧的全方位知识。Android View系统的核心机制使用Kotlin进行自定义控件开发的最佳实践性能优化和内存管理策略复杂交互和动画的实现方法介绍Android View系统的基本原理讲解自定义控件的核心概念和设计模式提供详细的代码实现示例分析性能优化策略探讨实际应用场景和最佳实践View: Android UI的基本构建块，表示屏幕上的一个矩形区域ViewGroup。
Kotlin 自定义view之实现标尺控件（选择身高、体重等）
05-13
详情请点击博客地址：https://blog.csdn.net/qq_20785431/article/details/80297962
Kotlin的自定义控件、Adapter
qq_44016573的博客
11-25 1986
引入布局的技巧解决了重复编写布局的问题，但如果遇到响应事件的情况时，仍然需要在每个Activity中重复编写这些响应事件。而这种情况我们最好使用自定义控件来解决。因为是使用系统现成的控件进行编写，在最开始是我们编写的自定义控件，需要继承系统的控件。//TitleLayout的主构造函数，在布局中引入该控件时就会调用这个方法//init的初始化代码块，在创建类实例对象时执行init {现在自定义控件已经创建好了，让我们在布局文件中引用它，修改init {//返回按钮的点击事件。
Android自定义控件 -- 仿书签（Kotlin）
opLW的博客
01-09 1133
模仿课本书签制作的书签
android kotlin 引人自定义控件
julicliy的博客
10-15 1040
kotlin, bug,
Kotlin写一个自定义的菜单控件
android_hdh的博客
07-26 2769
首先贴一下效果图 思路：菜单控件分两部分，一是点击的子按钮（RecordButton），二是包裹着子按钮的容器（RecordMenu）。 子按钮负责显示文字及背景颜色和点击事件，父容器主要控制子控件的位置和动画显示。 实现： 子按钮，先贴代码 class RecordButton : RelativeLayout { /** 控件显示的文本*/ lateinit v...
Kotlin 第一弹：自定义 ViewGroup 实现流式标签控件
热门推荐
frank 的专栏
05-24 1万+
古人学问无遗力， 少壮工夫老始成。纸上得来终觉浅， 绝知此事要躬行。 – 陆游 《冬夜读书示子聿》 上周 Google I/O 大会的召开，宣布了 Kotlin 语言正式成为了官方开发语言。一时间 Android 开发者的圈子炸开了锅，各种关于 Kotlin 的资料介绍也如雨后春笋不断的冒出。大家都对这比较关心，我觉得最大的原因是，当初宣布 Android Studio 成为官方 IDE 后，很多开
【Android自定义控件】Kotlin实现滚动效果的数字加减控件
Ho博客
08-31 1853
本篇文章所实现的自定义效果难度并不大，自定义ViewGroup、使用，结合View的方法实现数字滚动效果。
Kotlin自定义菜单控件
01-20
在Android开发中，自定义控件常常用于满足特定的界面设计和交互需求。本文将详细介绍如何使用Kotlin创建一个自定义菜单控件。这个控件包括两个主要部分：子按钮（RecordButton）和容器（RecordMenu）。 首先，我们...
自定义View—RadioGroup(kotlin版)
06-21
借助LinerLayout实现RadioGroup效果，kotlin编码，菜单图标使用Iconfont
Android 使用Kotlin自定义View的方法教程
01-05
前言 随着google宣布kotlin作为官方开发语言，在Android中使用kotlin的趋势也越来越明显，最近被kotlin的文章轰炸了，所以决定上手试一下，试过之后，感觉靠它灵简直有魔性。特别是一句话写出一个复杂的循环的时候，简直被惊呆。而且使用AS，Java代码可以直接转成Kotlin。 效果图如下： 首先是这次自定义View的效果图，是一张饼图。如果是用java写的话也就几十行，觉得换成Kotlin的话可能会更少。 示例代码 主要的功能是可以任设定数据的个数，我这里是4个数据，可以任意设定每个数据的颜色。 #####首先上Kotlin代码##### package top.
自定义组合控件实现
08-03
NULL 博文链接：https://wangjie2013.iteye.com/blog/2000473
使用 Kotlin 实现 Y 组合子（Y-Combinator）
AI天才研究院
07-28 8546
使用 Kotlin 实现 Y 组合子（Y-Combinator） 《Kotlin极简教程》正式上架： 点击这里 &gt; 去京东商城购买阅读 点击这里 &gt; 去天猫商城购买阅读 非常感谢您亲爱的读者，大家请多支持！！！有任何问题，欢迎随时与我交流~ 我们可以使用 Kotlin FP (Lambda, function) 写一个 Y-comb...
安卓从入门到放弃（三） 简单的自定义控件(kotlin)
小李的博客
07-26 892
本次以一个的定义title为例 一、新建一个activity_title.xml 设计布局 <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientat...
Kotlin-->自定义评分控件RatingBar
<angcyo>菜鸟视角
09-19 1260
首先了解下, 自定义View的三部曲.1:onMeasure方法此方法主要目的, 就是根据xml的 android:layout_width="wrap_content" android:layout_height="wrap_content"wrap_content match_parent 这2个属性, 来确定测量自身的大小. 当然, 这2个值, 只是parent告诉你,
kotlin实践：自定义控件和动画
孔乙己大叔的博客
09-21 607
首先，我们定义一个自定义的View类，它继承自View类。init {// 初始化时设置默认的动画控制器) {// 提供一个方法来更换动画控制器invalidate() // 重新绘制视图。
自定义组合控件
gwz10250330的博客
06-23 431
简介 这段为了工作的需要写了下自定义的组合控件，因为页面比较多而且还非常相识，为了 再xml里面用的方便就用了自定义的组合控件，下面为大家那个例子简单的给大家介绍 一下，应该看完我的实例以后大家对自定义组合控件会有更一步的了解，我会给大家 分步骤讲解： 第一步 首先我们就是先定义一个我们想要的布局样式，今天我就拿我们最常见的一条前后 有字加横线为例，下面是我在xml文件定义的样式：...
Android Studio：自定义控件的两种方法——布局引用实战
总结来说，使用引入布局的方法可以创建并重用自定义控件，提高开发效率，而深入定制的自定义控件则需要根据项目需求选择合适的方法。在Android Studio中，熟练掌握这两种方法是构建高质量应用的关键。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值