一、创建一个XML布局文件用于存放自定义控件的布局
layout_item.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/layout_item"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="50dp"
android:background="#000">
<ImageView
android:id="@+id/im_1"
android:layout_width="0dp"
android:layout_height="40dp"
android:layout_weight="1"
android:src="@drawable/btn_menu"
android:gravity="center_vertical"
android:scaleType="centerInside"
android:layout_gravity="center_vertical"
/>
<TextView
android:id="@+id/tv_1"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="5"
android:text="ITEM_1"
android:textColor="#fff"
android:textSize="30sp"
android:gravity="center_vertical"
/>
</LinearLayout>
二、创建一个attrs.xml文件,用于设置自定义属性,之后绑定到自定义控件上,可以在调用自定义控件时候,通过自定义属性直接设置自定义控件的属性
attrs.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<declare-styleable name="ItemLaydout">
<attr name="text" format="string"/>
<attr name="icon" format="reference"/>
</declare-styleable>
</resources>
三、创建自定义控件类ItemLayout.java
ItemLayout.java
import android.content.Context;
import android.content.res.TypedArray;
import android.util.AttributeSet;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.FrameLayout;
import android.widget.ImageView;
import android.widget.TextView;
import androidx.annotation.NonNull;
import androidx.annotation.Nullable;
public class ItemLayout extends FrameLayout {
private View mView; //界面控件
private TextView textView;
private ImageView imageView;
public ItemLayout(@NonNull Context context) {
this(context,null);
}
public ItemLayout(@NonNull Context context, @Nullable AttributeSet attrs) {
this(context, attrs,0);
}
public ItemLayout(@NonNull Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
init(context,attrs);
Log.d("ItemLayout","ItemLayout");
}
//初始化界面
private void init(Context context,AttributeSet attrs)
{
LayoutInflater inflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
mView = inflater.inflate(R.layout.layout_item, this, true);//加载布局文件
//获取布局中的控件
textView = (TextView)mView.findViewById(R.id.tv_1);
imageView = (ImageView)mView.findViewById(R.id.im_1);
//加载属性文件
TypedArray a = context.obtainStyledAttributes(attrs, R.styleable.ItemLaydout);
//从属性文件中获取资源值,设置到布局中的控件上
setImageView(a.getResourceId(R.styleable.ItemLaydout_icon,10000));
setTextView(a.getString(R.styleable.ItemLaydout_text));
}
public void setImageView(int im_id) {
this.imageView.setImageResource(im_id);
}
public void setTextView(String tv_str) {
this.textView.setText(tv_str);
}
}
至此,自定义控件已经设置完成
四、使用自定义控件,在MainActivity的xml文件中调用
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
android:orientation="vertical"
android:background="#333333"
>
<com.skypan.customviewpro.ItemLayout
android:layout_width="match_parent"
android:layout_height="55dp"
app:text = "Item1"
app:icon = "@drawable/btn_menu"
android:background="#000"
/>
<Space
android:layout_width="match_parent"
android:layout_height="10dp"
/>
<com.skypan.customviewpro.ItemLayout
android:layout_width="match_parent"
android:layout_height="55dp"
app:text = "Item2"
app:icon = "@drawable/btn_search"
android:background="#000"
/>
<com.skypan.customviewpro.ItemLayout
android:layout_width="match_parent"
android:layout_height="55dp"
app:text = "Item3"
app:icon = "@drawable/find"
android:background="#000"
/>
<com.skypan.customviewpro.ItemLayout
android:layout_width="match_parent"
android:layout_height="55dp"
app:text = "Item4"
app:icon = "@drawable/friend"
android:background="#000"
/>
<com.skypan.customviewpro.ItemLayout
android:layout_width="match_parent"
android:layout_height="55dp"
app:text = "Item5"
app:icon = "@drawable/wechat"
android:background="#000"
/>
</LinearLayout>