Android标题栏和列表item的通用封装

版权声明：天际流火叩响大地之门，岁月星辰刻画沧桑年轮！ https://blog.csdn.net/ytfunnysite/article/details/82590830

自定义标题栏和item的布局文件

<?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:orientation="vertical">

    <!--item的上分割线-->
    <View
        android:id="@+id/divider_top"
        android:layout_width="fill_parent"
        android:layout_height="1px"
        android:background="#efefef" />

    <!--item内容部分的容器-->
    <LinearLayout
        android:id="@+id/ll_root"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@android:color/white"
        android:gravity="center_vertical"
        android:orientation="horizontal"
        android:paddingBottom="10dp"
        android:paddingLeft="20dp"
        android:paddingRight="20dp"
        android:paddingTop="10dp">

        <!--item左边的Icon-->
        <ImageView
            android:id="@+id/iv_left_icon"
            android:layout_width="20dp"
            android:layout_height="20dp" />

        <!--item中间部分的文字-->
        <TextView
            android:id="@+id/tv_text_content"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_marginLeft="12dp"
            android:layout_weight="1"
            android:textSize="14sp" />

        <!--item 中间部分的输入框（有则显示五则隐藏）-->
        <EditText
            android:id="@+id/edit_content"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="2"
            android:background="@android:color/transparent"
            android:lines="1"
            android:maxLines="1"
            android:textSize="14sp" />

        <!--item右边的文字-->
        <TextView
            android:id="@+id/tv_right_text"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textSize="14sp" />

        <!--item右边的Icon 默认是向右的箭头-->
        <ImageView
            android:id="@+id/iv_right_icon"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:paddingLeft="10dp"
            android:src="@mipmap/homepage_right_arrow" />
    </LinearLayout>

    <!--item的下分割线-->
    <View
        android:id="@+id/divider_bottom"
        android:layout_width="fill_parent"
        android:layout_height="1px"
        android:background="#efefef" />

</LinearLayout>

自定义一个class，成为容器

Xml布局写好之后我们还需要一个Java类，取名为MyOneLineView.class
该类继承LinearLayout或RelativeLayout，使其成为一个容器。
然后，通过LayoutInflater将我们前面写好的布局进入MyOneLineView容器中

/**
 * @author ytf
 */
public class MyOneLineView extends LinearLayout {

    /**
     * 上下分割线，默认隐藏上面分割线
     */
    private View dividerTop, dividerBottom;

    /**
     * 最外层容器
     */
    private LinearLayout llRoot;
    /**
     * 最左边的Icon
     */
    private ImageView ivLeftIcon;
    /**
     * 中间的文字内容
     */
    private TextView tvTextContent;

    /**
     * 中间的输入框
     */
    private EditText editContent;

    /**
     * 右边的文字
     */
    private TextView tvRightText;

    /**
     * 右边的icon 通常是箭头
     */
    private ImageView ivRightIcon;


    /**
     * 整个一行被点击
     */
    public static interface OnRootClickListener {
        void onRootClick(View view);
    }


    /**
     * 右边箭头的点击事件
     */
    public static interface OnArrowClickListener {
        void onArrowClick(View view);
    }

    public MyOneLineView(Context context) {
        super(context);
    }

    public MyOneLineView(Context context, AttributeSet attrs) {
        super(context, attrs);

    }

    /**
     * 初始化各个控件
     */
    public MyOneLineView init() {
        LayoutInflater.from(getContext()).inflate(R.layout.layout_my_one_line, this, true);
        llRoot = (LinearLayout) findViewById(R.id.ll_root);
        dividerTop = findViewById(R.id.divider_top);
        dividerBottom = findViewById(R.id.divider_bottom);
        ivLeftIcon = (ImageView) findViewById(R.id.iv_left_icon);
        tvTextContent = (TextView) findViewById(R.id.tv_text_content);
        editContent = (EditText) findViewById(R.id.edit_content);
        tvRightText = (TextView) findViewById(R.id.tv_right_text);
        ivRightIcon = (ImageView) findViewById(R.id.iv_right_icon);
        return this;
    }

    /**
     * 文字 + 箭头

     * @param textContent
     * @return
     */
    public MyOneLineView init(String textContent) {
        init();
        setTextContent(textContent);
        showEdit(false);
        setRightText("");
        showLeftIcon(false);
        return this;
    }

    /**
     * 默认情况下的样子  icon + 文字 + 右箭头 + 下分割线
     *
     * @param iconRes     icon图片
     * @param textContent 文字内容
     */
    public MyOneLineView init(int iconRes, String textContent) {
        init();
        showDivider(false, true);
        setLeftIcon(iconRes);
        setTextContent(textContent);
        showEdit(false);
        setRightText("");
        showArrow(true);
        return this;
    }

    /**
     * 我的页面每一行  icon + 文字 + 右箭头（显示/不显示） + 右箭头左边的文字（显示/不显示）+ 下分割线
     *
     * @param iconRes     icon图片
     * @param textContent 文字内容
     */
    public MyOneLineView initMine(int iconRes, String textContent, String textRight, boolean showArrow) {
        init(iconRes, textContent);
        setRightText(textRight);
        showArrow(showArrow);
        return this;
    }


    /**
     * icon + 文字 + edit + 下分割线
     *
     * @return
     */
    public MyOneLineView initItemWidthEdit(int iconRes, String textContent, String editHint) {
        init(iconRes, textContent);
        showEdit(true);
        setEditHint(editHint);
        showArrow(false);
        return this;
    }

    //---------------------下面是对每个部分的一些设置     上面是应用中常用场景封装-----------------------//

    /**
     * 设置root的paddingTop 与 PaddingBottom 从而控制整体的行高
     * paddingLeft 与 paddingRight 保持默认 20dp
     */
    public MyOneLineView setRootPaddingTopBottom(int paddintTop, int paddintBottom) {
        llRoot.setPadding(DensityUtils.dp2px(getContext(), 20),
                DensityUtils.dp2px(getContext(), paddintTop),
                DensityUtils.dp2px(getContext(), 20),
                DensityUtils.dp2px(getContext(), paddintBottom));
        return this;
    }

    /**
     * 设置root的paddingLeft 与 PaddingRight 从而控制整体的行高
     * <p>
     * paddingTop 与 paddingBottom 保持默认 15dp
     */
    public MyOneLineView setRootPaddingLeftRight(int paddintTop, int paddintRight) {
        llRoot.setPadding(DensityUtils.dp2px(getContext(), paddintTop),
                DensityUtils.dp2px(getContext(), 15),
                DensityUtils.dp2px(getContext(), paddintRight),
                DensityUtils.dp2px(getContext(), 15));
        return this;
    }

    /**
     * 设置上下分割线的显示情况
     *
     * @return
     */
    public MyOneLineView showDivider(Boolean showDividerTop, Boolean showDivderBottom) {
        if (showDividerTop) {
            dividerTop.setVisibility(VISIBLE);
        } else {
            dividerTop.setVisibility(GONE);
        }
        if (showDivderBottom) {
            dividerBottom.setVisibility(VISIBLE);
        } else {
            dividerBottom.setVisibility(GONE);
        }
        return this;
    }

    /**
     * 设置上分割线的颜色
     *
     * @return
     */
    public MyOneLineView setDividerTopColor(int dividerTopColorRes) {
        dividerTop.setBackgroundColor(getResources().getColor(dividerTopColorRes));
        return this;
    }

    /**
     * 设置上分割线的高度
     *
     * @return
     */
    public MyOneLineView setDividerTopHigiht(int dividerTopHigihtDp) {
        ViewGroup.LayoutParams layoutParams = dividerTop.getLayoutParams();
        layoutParams.height = DensityUtils.dp2px(getContext(), dividerTopHigihtDp);
        dividerTop.setLayoutParams(layoutParams);
        return this;
    }

    /**
     * 设置下分割线的颜色
     *
     * @return
     */
    public MyOneLineView setDividerBottomColor(int dividerBottomColorRes) {
        dividerBottom.setBackgroundColor(getResources().getColor(dividerBottomColorRes));
        return this;
    }

    /**
     * 设置上分割线的高度
     *
     * @return
     */
    public MyOneLineView setDividerBottomHigiht(int dividerBottomHigihtDp) {
        ViewGroup.LayoutParams layoutParams = dividerBottom.getLayoutParams();
        layoutParams.height = DensityUtils.dp2px(getContext(), dividerBottomHigihtDp);
        dividerBottom.setLayoutParams(layoutParams);
        return this;
    }

    /**
     * 设置左边Icon
     *
     * @param iconRes
     */
    public MyOneLineView setLeftIcon(int iconRes) {
        ivLeftIcon.setImageResource(iconRes);
        return this;
    }

    /**
     * 设置左边Icon显示与否
     *
     * @param showLeftIcon
     */
    public MyOneLineView showLeftIcon(boolean showLeftIcon) {
        if (showLeftIcon) {
            ivLeftIcon.setVisibility(VISIBLE);
        } else {
            ivLeftIcon.setVisibility(GONE);
        }
        return this;
    }

    /**
     * 设置右边Icon 以及Icon的宽高
     */
    public MyOneLineView setLeftIconSize(int widthDp, int heightDp) {
        ViewGroup.LayoutParams layoutParams = ivLeftIcon.getLayoutParams();
        layoutParams.width = DensityUtils.dp2px(getContext(), widthDp);
        layoutParams.height = DensityUtils.dp2px(getContext(), heightDp);
        ivLeftIcon.setLayoutParams(layoutParams);
        return this;
    }


    /**
     * 设置中间的文字内容
     *
     * @param textContent
     * @return
     */
    public MyOneLineView setTextContent(String textContent) {
        tvTextContent.setText(textContent);
        return this;
    }

    /**
     * 设置中间的文字颜色
     *
     * @return
     */
    public MyOneLineView setTextContentColor(int colorRes) {
        tvTextContent.setTextColor(getResources().getColor(colorRes));
        return this;
    }

    /**
     * 设置中间的文字大小
     *
     * @return
     */
    public MyOneLineView setTextContentSize(int textSizeSp) {
        tvTextContent.setTextSize(textSizeSp);
        return this;
    }

    /**
     * 设置右边文字内容
     *
     * @return
     */
    public MyOneLineView setRightText(String rightText) {
        tvRightText.setText(rightText);
        return this;
    }


    /**
     * 设置右边文字颜色
     *
     * @return
     */
    public MyOneLineView setRightTextColor(int colorRes) {
        tvRightText.setTextColor(getResources().getColor(colorRes));
        return this;
    }

    /**
     * 设置右边文字大小
     *
     * @return
     */
    public MyOneLineView setRightTextSize(int textSize) {
        tvRightText.setTextSize(textSize);
        return this;
    }

    /**
     * 设置右箭头的显示与不显示
     *
     * @param showArrow
     */
    public MyOneLineView showArrow(boolean showArrow) {
        if (showArrow) {
            ivRightIcon.setVisibility(VISIBLE);
        } else {
            ivRightIcon.setVisibility(GONE);
        }
        return this;
    }

    /**
     * 获取右边icon
     */
    public MyOneLineView setIvRightIcon(int iconRes) {

        ivRightIcon.setImageResource(iconRes);

        return this;
    }

    /**
     * 获取右边icon
     */
    public ImageView getIvRightIcon() {

        return ivRightIcon;
    }


    /**
     * 设置中间的输入框显示与否
     *
     * @param showEdit
     * @return
     */
    public MyOneLineView showEdit(boolean showEdit) {
        if (showEdit) {
            editContent.setVisibility(VISIBLE);
        } else {
            editContent.setVisibility(GONE);
        }
        return this;
    }


    /**
     * 设置中间的输入框 是否可输入
     *
     * @param editable
     * @return
     */
    public MyOneLineView setEditable(boolean editable) {
        editContent.setFocusable(editable);
        return this;
    }


    /**
     * 设置中间的输入框hint内容
     *
     * @param showEditHint
     * @return
     */
    public MyOneLineView setEditHint(String showEditHint) {
        editContent.setHint(showEditHint);
        return this;
    }

    /**
     * 设置中间的输入框内容
     *
     * @param s
     * @return
     */
    public MyOneLineView setEditContent(String s) {
        editContent.setText(s);
        return this;
    }

    /**
     * 获取Edit输入的内容
     *
     * @param s
     * @return
     */
    public String getEditContent(String s) {
        return String.valueOf(editContent.getText());

    }


    /**
     * 设置 edit 颜色
     *
     * @param colorRes
     * @return
     */
    public MyOneLineView setEditColor(int colorRes) {
        editContent.setTextColor(getResources().getColor(colorRes));
        return this;
    }

    /**
     * 设置 edit 字体大小
     *
     * @param editSizeSp
     * @return
     */
    public MyOneLineView setEditSize(int editSizeSp) {
        editContent.setTextSize(editSizeSp);
        return this;
    }
    //----------------------下面是一些点击事件

    public MyOneLineView setOnRootClickListener(final OnRootClickListener onRootClickListener, final int tag) {
        llRoot.setOnClickListener(new OnClickListener() {
            @Override
            public void onClick(View v) {
                llRoot.setTag(tag);
                onRootClickListener.onRootClick(llRoot);
            }
        });
        return this;
    }

    public MyOneLineView setOnArrowClickListener(final OnArrowClickListener onArrowClickListener, final int tag) {

        ivRightIcon.setOnClickListener(new OnClickListener() {
            @Override
            public void onClick(View v) {
                ivRightIcon.setTag(tag);
                onArrowClickListener.onArrowClick(ivRightIcon);
            }
        });
        return this;
    }

}

java代码中使用

public class MainActivity extends AppCompatActivity implements MyOneLineView.OnRootClickListener, MyOneLineView.OnArrowClickListener {

    LinearLayout llRoot;

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

        //使用示例，通过Java代码来创建MyOnelineView

        llRoot = (LinearLayout) findViewById(R.id.ll_root);

        //icon + 文字 + 箭头
        llRoot.addView(new MyOneLineView(this)
                .initMine(R.mipmap.ic_launcher, "第一行", "", true)
                .setOnRootClickListener(this, 1));
        //icon + 文字 + 文字 + 箭头
        llRoot.addView(new MyOneLineView(this)
                .initMine(R.mipmap.ic_launcher, "第二行", "第二行", true)
                .setOnArrowClickListener(this, 2));
        //icon + 文字 + 输入框
        llRoot.addView(new MyOneLineView(this)
                .initItemWidthEdit(R.mipmap.ic_launcher, "第三行", "这是一个输入框")
                .setRootPaddingTopBottom(20, 20));
    }

    @Override
    public void onRootClick(View view) {

        int position = 0;
        switch ((int) view.getTag()) {
            case 1:
                position = 1;
                Toast.makeText(this, "点击了第" + position + "行", Toast.LENGTH_SHORT).show();
                startActivity(new Intent(this,Main2Activity.class));
                break;
            case 2:
                position = 2;
                Toast.makeText(this, "点击了第" + position + "行", Toast.LENGTH_SHORT).show();
                break;
        }
//        Toast.makeText(this, "点击了第" + position + "行", Toast.LENGTH_SHORT).show();
    }

    @Override
    public void onArrowClick(View view) {

        int position = 0;
        switch ((int) view.getTag()) {
            case 1:
                position = 1;
                Toast.makeText(this, "点击了第" + position + "行右边的箭头", Toast.LENGTH_SHORT).show();
                break;
            case 2:
                position = 2;
                Toast.makeText(this, "点击了第" + position + "行右边的箭头", Toast.LENGTH_SHORT).show();
                break;
        }
//        Toast.makeText(this, "点击了第" + position + "行右边的箭头", Toast.LENGTH_SHORT).show();
    }
}

在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"
    android:orientation="vertical"
    tools:context="com.chx.myonelineview.Main2Activity">


    <com.chx.myonelineview.MyOneLineView
        android:id="@+id/one_item"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

    </com.chx.myonelineview.MyOneLineView>

    <com.chx.myonelineview.MyOneLineView
        android:id="@+id/two_item"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

    </com.chx.myonelineview.MyOneLineView>

    <com.chx.myonelineview.MyOneLineView
        android:id="@+id/there_item"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

    </com.chx.myonelineview.MyOneLineView>
</LinearLayout>

public class Main2Activity extends AppCompatActivity {

    MyOneLineView oneItem, twoItem, thereItem;

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

        //在xml布局中使用MyOneLineView
        oneItem = (MyOneLineView) findViewById(R.id.one_item);
        twoItem = (MyOneLineView) findViewById(R.id.two_item);
        thereItem = (MyOneLineView) findViewById(R.id.there_item);

        oneItem.initMine(R.mipmap.ic_launcher, "第一行", "", true);
        twoItem.initMine(R.mipmap.ic_launcher, "第二行", "第二行", false);
        thereItem.initMine(R.mipmap.ic_launcher, "第三行", "这是一个输入框", false);

    }
}