今天浏览简书发现还有人不会自定义组合view，所以写下这个简单示例，希望可以帮助到初学Android的同学
四步走
一、编辑你需要的组合view的xml文件
例如我想写个通用的页面头部，就像这样
统一样式的头部
<?xml version="1.0" encoding="utf-8"?>
<merge xmlns:android="http://schemas.android.com/apk/res/android">
<!-- 左图和右文本 设置高度及padding 获取较大的点击区域，方便用户点击 -->
<ImageView
android:id="@+id/iv_back"
android:layout_width="50dp"
android:layout_height="50dp"
android:padding="14dp"
android:src="@drawable/ic_back"/>
<TextView
android:id="@+id/tv_title"
android:layout_width="0dp"
android:layout_height="50dp"
android:layout_weight="1"
android:text="标题"
android:textColor="@color/white"
android:textSize="18sp"
android:textStyle="bold"
android:gravity="center"/>
<TextView
android:id="@+id/tv_operation"
android:layout_width="50dp"
android:layout_height="50dp"
android:text="筛选"
android:textSize="16sp"
android:textColor="@color/white"
android:textStyle="bold"
android:gravity="center"/>
</merge>
这里根布局是merge，不是通常的LinearLayout或其他ViewGroup，因为你所自定义的组合view就是一个ViewGroup，在xml中根布局能减少还是要减少的，少了一层嵌套，它不香吗，至于你需要在根布局设置的属性如水平垂直或重心等，你可以在你自定义的View中设置，请往下看
二、new 你需要的组合view 重写构造函数
class CustomViewGroup: LinearLayout {
constructor(context: Context): this(context, null)//注意this（）这调用了第二个构造函数
constructor(context: Context, attrs: AttributeSet?): this(context, attrs, 0)//注意this（）这调用了第三个构造函数
constructor(context: Context, attrs: AttributeSet?, defStyleAttr: Int): super(context, attrs, defStyleAttr) {}
}
三、编辑你需要的组合view的自定义属性
在res/values文件夹下找到attrs.xml，如果没有attrs.xml，右键values -> new -> Values Resource File，命名attrs即可，在attrs.xml文件中添加 declare-styleable
<?xml version="1.0" encoding="utf-8"?>
<resources>
// CustomViewGroup这个名字和第二步新建的view名字一致的
// 你可以加其他属性都可以，format支持很多类型的，比如color，drawable等你可以自己看一看
<declare-styleable name="CustomViewGroup">
<attr name="title" format="string"/>
<attr name="operation" format="string"/>
</declare-styleable>
</resources>
四、开始在你的自定义组合view中写你的代码
class CustomViewGroup: LinearLayout {
lateinit var title: TextView
lateinit var operation: TextView
constructor(context: Context): this(context, null)
constructor(context: Context, attrs: AttributeSet?): this(context, attrs, 0)
constructor(context: Context, attrs: AttributeSet?, defStyleAttr: Int): super(context, attrs, defStyleAttr) {
//因为我们引入的布局文件根布局是merge，而我们的CustomViewGroup又是继承LinearLayout，所以我们在这里设置几个属性
this.orientation = HORIZONTAL
this.gravity = Gravity.CENTER_VERTICAL
this.setBackgroundColor(ContextCompat.getColor(context, R.color.colorAccent))
init(context, attrs)
}
private fun init(context: Context, attrs: AttributeSet?) {
//加载你的组合布局文件到这个自定义的CustomViewGroup内
val inflate = LayoutInflater.from(context).inflate(R.layout.view_custom_viewgroup, this)
//利用findViewById找到你布局文件中的控件
val ivBack: ImageView = inflate.findViewById(R.id.iv_back)
//如返回键无特殊操作，可以直接finish()，如有其它操作可自定义其它操作方法
ivBack.setOnClickListener {(context as Activity).finish()}
title = inflate.findViewById(R.id.tv_title)
operation = inflate.findViewById(R.id.tv_operation)
//获取可配置的属性，设置给控件
val attr = context.obtainStyledAttributes(attrs, R.styleable.CustomViewGroup)
title.text = attr.getString(R.styleable.CustomViewGroup_title)
operation.text = attr.getString(R.styleable.CustomViewGroup_operation)
//用完要回收
attr.recycle()
}
/* 可以对外提供设置text方法 */
fun setTitle(s: String){
title.text = s
}
fun setOperation(s: String){
operation.text = s
}
//设置对右文本的点击监听
fun setOnOperationClickListener(listener: OnOperationClickListener){
operation.setOnClickListener {
listener.onClick()
}
}
}
interface OnOperationClickListener{
fun onClick()
}
使用
xml中
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical">
<!-- 就是你啊 -->
<com.limeng.thecreator.view.CustomViewGroup
android:id="@+id/cvg_title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:title="我是标题"
app:operation="筛选"/>
<Button
android:id="@+id/bt_change_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="改变标题"/>
<Button
android:id="@+id/bt_change_operation"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="改变右文本"/>
</LinearLayout>
在activity中
//cvg_title 就是 CustomViewGroup
//调用点击事件
cvg_title.setOnOperationClickListener(object : OnOperationClickListener{
override fun onClick() {
val makeText = makeText(this@CustomViewGroupActivity, "别打我", Toast.LENGTH_SHORT)
makeText.setGravity(Gravity.TOP,0,0)
makeText.show()
}
})
//调用setTitle
bt_change_title.setOnClickListener { cvg_title.setTitle("那我走") }
//调用setOperation
bt_change_operation.setOnClickListener { cvg_title.setOperation("你走") }
结束
就是这么简单，一看就会，有手就行
git地址：https://gitee.com/woslxm_limeng/charts_test.git
网友评论