组合控件(功能条)

效果图

实现这样一个功能条

---

布局文件的代码量

    <com.example.yx.customitem.MyView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:mv_left_image="@drawable/phone"
        app:mv_text="拨打电话"
        app:mv_right_image="@drawable/more"
        />

---

步骤

1. 定制自己的myItem.xml,相当于做了一个模板
2. 新建attrs.xml,定义属性
3. 新建MyView类继承LinearLayout
4. 在布局文件中进行引用

---

第一步

在layout文件下新建myitem.xml

我事先放了几张张图片在drawable下的

我定制的模板是这个样子

模板代码如下

<?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="wrap_content"
    android:gravity="center_vertical"
    android:orientation="horizontal"
    android:paddingBottom="8dp"
    android:paddingTop="8dp">

    <ImageView
        android:id="@+id/iv_left_image"
        android:layout_width="25dp"
        android:layout_height="25dp"
        android:layout_marginLeft="32dp"
        android:background="@drawable/email" />

    <TextView
        android:id="@+id/tv_text"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginLeft="16dp"
        android:layout_weight="1"
        android:text="发送短信"
        android:textSize="16sp" />

    <ImageView
        android:id="@+id/iv_right_image"
        android:layout_width="25dp"
        android:layout_height="25dp"
        android:layout_marginRight="32dp"
        android:background="@drawable/more" />
</LinearLayout>

---

第二步

在values文件夹下新建attrs.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <declare-styleable name="MyView">
        <attr name="mv_left_image" format="reference" />
        <attr name="mv_text" format="string" />
        <attr name="mv_right_image" format="reference" />
    </declare-styleable>
</resources>

---

第三步

新建MyView类,继承于LinearLayout

public class MyView extends LinearLayout {
    private final View view;

    private ImageView left_image;//左边图片
    private TextView text;//中间文字
    private ImageView right_image;//右边图片

    @RequiresApi(api = Build.VERSION_CODES.JELLY_BEAN)
    public MyView(Context context) {
        this(context, null);
    }

    @RequiresApi(api = Build.VERSION_CODES.JELLY_BEAN)
    public MyView(Context context, @Nullable AttributeSet attrs) {
        this(context, attrs, 0);
    }

    @RequiresApi(api = Build.VERSION_CODES.JELLY_BEAN)
    public MyView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        view = LayoutInflater.from(context).inflate(R.layout.myitem, this, true);

        //初始化attrs
        TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.MyView, defStyleAttr, 0);
        Drawable mv_left_image = typedArray.getDrawable(R.styleable.MyView_mv_left_image);
        String mv_text = typedArray.getString(R.styleable.MyView_mv_text);
        Drawable mv_right_image = typedArray.getDrawable(R.styleable.MyView_mv_right_image);

        //初始化view
        left_image = (ImageView) view.findViewById(R.id.iv_left_image);
        text = (TextView) view.findViewById(R.id.tv_text);
        right_image = (ImageView) view.findViewById(R.id.iv_right_image);

        //设置值
        left_image.setBackground(mv_left_image);
        text.setText(mv_text);
        right_image.setBackground(mv_right_image);
    }
}

---

第四步

在布局文件中进行引用

<?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"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <com.example.yx.customitem.MyView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:mv_left_image="@drawable/phone"
        app:mv_right_image="@drawable/more"
        app:mv_text="拨打电话"/>

</LinearLayout>

---

https://blog.csdn.net/weixin_39460667/article/details/80669210