美文网首页
《第一行代码》笔记1-创建自定义控件

《第一行代码》笔记1-创建自定义控件

作者: 忧郁的小码仔 | 来源:发表于2017-09-17 10:35 被阅读67次

    新建一个工程,实现一个类iOS系统导航条样式的菜单
    1.在res layout目录下新建一个title.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="wrap_content"
                  android:background="#8F6D6D">
    
        <Button
            android:id="@+id/title_back"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:layout_margin="5dp"
            android:background="#59B08F"
            android:text="Back"
            android:textColor="#ffffff"/>
    
        <TextView
            android:id="@+id/title_text"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:layout_weight="1"
            android:gravity="center"
            android:text="Title Text"
            android:textColor="#ffffff"
            android:textSize="24sp"/>
    
        <Button
            android:id="@+id/title_edit"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:layout_margin="5dp"
            android:background="#CB2B2B"
            android:text="edit"
            android:textColor="#ffffff"/>
    </LinearLayout>
    
    1. 直接在activity_main.xml布局文件中通过include的方式把title布局引入:
    <?xml version="1.0" encoding="utf-8"?>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
                  android:orientation="vertical"
                  android:layout_width="match_parent"
                  android:layout_height="match_parent">
    
        <include layout="@layout/title" />
    </LinearLayout>
    
    1. 将系统自带的菜单隐藏掉:
    package com.example.customtitle;
    
    import android.support.v7.app.ActionBar;
    import android.support.v7.app.AppCompatActivity;
    import android.os.Bundle;
    
    public class MainActivity extends AppCompatActivity {
    
        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_main);
    
            // 隐藏掉系统自带的标题栏
            ActionBar actionBar = getSupportActionBar();
            if (actionBar != null) {
                actionBar.hide();
            }
    
        }
    }
    
    

    运行:

    Screenshot_2017-09-17-10-24-48-657_CustomTitle.png

    这样就实现了一个菜单栏,只需要在需要的布局中引入即可。
    但是这种include的方式有一个缺陷,一般菜单栏都是要响应一些事件的,比如返回按钮负责返回上一个activity等等。如果在每个引入的activity里都单独去实现这些方法会比较冗余。

    这种时候就需要自定义一个控件了。
    新建一个TitleLayout类继承自LinearLayout,并在该布局中加载title.xml资源,并定义相关的事件即可.

    package com.example.customtitle;
    
    import android.app.Activity;
    import android.content.Context;
    import android.support.annotation.Nullable;
    import android.util.AttributeSet;
    import android.view.LayoutInflater;
    import android.view.View;
    import android.widget.LinearLayout;
    import android.widget.Toast;
    
    /**
     * Created by archerlj on 2017/9/17.
     */
    
    public class TitleLayout extends LinearLayout {
    
        public TitleLayout(Context context, @Nullable AttributeSet attrs) {
            super(context, attrs);
            // this 表示R.layout.title的父布局,就是TitleLayout
            LayoutInflater.from(context).inflate(R.layout.title, this);
    
            // 返回按钮事件
            findViewById(R.id.title_back).setOnClickListener(new OnClickListener() {
                @Override
                public void onClick(View view) {
                    ((Activity)getContext()).finish();
                }
            });
    
            // 编辑按钮事件,这里弹出一个toast即可。
            findViewById(R.id.title_edit).setOnClickListener(new OnClickListener() {
                @Override
                public void onClick(View view) {
                    Toast.makeText(getContext(), "Eidt clicked", Toast.LENGTH_SHORT).show();
                }
            });
        }
    }
    
    

    2.定义好layout之后,只需要在需要的activity布局中像普通控件一样使用即可。打开activity_main.xml文件:

    <?xml version="1.0" encoding="utf-8"?>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
                  android:orientation="vertical"
                  android:layout_width="match_parent"
                  android:layout_height="match_parent">
    
        <!--<include layout="@layout/title" />-->
    
        <com.example.customtitle.TitleLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"></com.example.customtitle.TitleLayout>
    </LinearLayout>
    

    运行:
    点击back按钮即可退出程序,点击edit按钮可弹出一个toast。

    这样每当我们需要一个菜单栏的时候,直接在布局文件中引入即可,并且菜单中的事件也会自动实现了。

    相关文章

      网友评论

          本文标题:《第一行代码》笔记1-创建自定义控件

          本文链接:https://www.haomeiwen.com/subject/nggqsxtx.html