The first day of rookie notes, custom View (combination control)

~~~~ The new year has begun, everyone has made their own life plans and started a new voyage. Looking back, I found that I have been a programmer for four or five years, but I ask myself, I have not evolved from a rookie to a great master. So while I was still young, I decided to change my current state of life, and I hoped to become great by writing articles as Hongshen said.
Have you noticed that we use many technical points very well, but we always encounter strange bugs or problems. During the interview, if the interviewer asks you to talk about it, it is very likely that it will be finished in two or three minutes. , and the answer is not ideal. The most fundamental reason is that we do not fully get this point. If you go to research, there will definitely be unexpected gains.
After talking nonsense for so long, let's get to the point.


Android自定义View主要包括3种实现方式:组合控件、绘制控件、继承控件。
那今天我呢就主要来聊一下组合控件吧~

第一步,当然是画布局页面了
<?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"
    android:paddingLeft="@dimen/ds_30"
    android:paddingRight="@dimen/ds_30"
    android:layout_marginBottom="@dimen/ds_3"
    android:gravity="center_vertical"
    android:orientation="horizontal"
    android:background="#fff">

    <ImageView
        android:id="@+id/mine_item_img"
        android:layout_width="@dimen/ds_81"
        android:layout_height="@dimen/ds_81"
        android:background="@mipmap/ic_launcher"
        android:layout_centerVertical="true" />

    <TextView
        android:id="@+id/mine_item_title"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:layout_centerVertical="true"
        android:layout_marginLeft="@dimen/ds_30"
        android:layout_toRightOf="@+id/mine_item_img"
        android:text="标题"
        android:textColor="#333"
        android:textSize="@dimen/fs_45" />
    <TextView
        android:id="@+id/mine_item_count"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerVertical="true"
        android:layout_marginLeft="@dimen/ds_30"
        android:layout_toRightOf="@+id/mine_item_img"
        android:text="1"
        android:textColor="#999"
        android:textSize="@dimen/fs_42" />

    <ImageView
        android:id="@+id/mine_item_next"
        android:layout_width="@dimen/ds_42"
        android:layout_height="@dimen/ds_42"
        android:layout_alignParentRight="true"
        android:layout_centerVertical="true"
        android:background="@mipmap/icon_more" />

</LinearLayout>
四个元素横向排布,分别是菜单图标、标题、标签、进入图标,这个不多说

第二步,values目录下创建一个属性文件attrs.xml,并创建标签添加自定义属性,这里我自定义了菜单图标、标题和数量,当然我们还可以自定义字号、颜色等等:
    <declare-styleable name="MineItemView">
        <attr name="leftImg" format="reference"/>
        <attr name="title" format="string"/>
        <attr name="count" format="string"/>
    </declare-styleable>
第三步,创建一个类 MineItemView.class,继承该布局的父布局类型,从自定义的属性文件中取值并给控件赋值:
public class MineItemView extends LinearLayout {

    private TextView countView;
    //构造方法
    public MineItemView(Context context) {
        super(context);
    }

    public MineItemView(Context context, AttributeSet attrs) {
        super(context, attrs);
        initView(context, attrs);
    }

    public MineItemView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        initView(context, attrs);
    }
    //初始化View
    private void initView(Context context, AttributeSet attrs) {
        LayoutInflater inflater = (LayoutInflater) context
                .getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        View view = inflater.inflate(R.layout.widget_mine_item, this, true);
        ImageView leftImg = (ImageView) view.findViewById(R.id.mine_item_img);
        TextView titleView = (TextView) view.findViewById(R.id.mine_item_title);
        countView = (TextView) view.findViewById(R.id.mine_item_count);
        TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.MineItemView);
        Drawable leftDrawable = typedArray.getDrawable(R.styleable.MineItemView_leftImg);
        String title = typedArray.getString(R.styleable.MineItemView_title);
        String count = typedArray.getString(R.styleable.MineItemView_count);
        typedArray.recycle();
        if(leftDrawable == null){
            leftDrawable = ContextCompat.getDrawable(context, R.mipmap.ic_launcher);
        }
        leftImg.setBackground(leftDrawable);
        if(TextUtils.isEmpty(title)){
            title = "";
        }
        titleView.setText(title);
        if(TextUtils.isEmpty(count)){
            count = "";
        }
        countView.setText(count);
    }
第四步,在我们的主页面布局中引入自定义属性,添加自定义控件并给自定义的属性赋值:
<?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.bryan.app.MineItemView
        android:layout_width="match_parent"
        android:layout_height="@dimen/ds_144"
        app:leftImg="@mipmap/ic_launcher"
        app:count="8"
        app:title="我的消息" />
<LinearLayout />

Note: "app" in xmlns:app="http://schemas.android.com/apk/res-auto" can be named arbitrarily, just need to correspond to it in the control. The code is here, let's have a cup of coffee first and see how it works:

running result


很轻松愉快的我们就完成了一个实用的自定义View,当然我们可以用同样的方式做一些更复杂的View,今天就到这里吧~

*初来乍到,一心向学,如有问题,烦请指正。*

Guess you like

Origin http://43.154.161.224:23101/article/api/json?id=325856804&siteId=291194637