这是我参与「第四届青训营」笔记创作活动的第2天。

主要记录一下自定义标题栏的使用方法，这样不用在不同的页面重复书写代码，起到一个代码复用的效果。直接在相关的页面xml文件中直接引用即可。
1、设计出标题栏的布局样式
(略显简陋，不要在意)

<?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">

    <Button
        android:id="@+id/focus_back"
        android:layout_width="50dp"
        android:layout_height="51dp"
        android:background="@drawable/back"
        android:layout_gravity="center_horizontal"/>
    <Button
        android:id="@+id/focus_friend"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="朋友"
        android:layout_gravity="center_horizontal"
        />
    <Button
        android:id="@+id/focus_focus"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="关注"
        android:layout_gravity="center_horizontal"
        />
    <Button
        android:id="@+id/focus_fans"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="粉丝"
        android:layout_gravity="center_horizontal"
        />

    <Button
        android:id="@+id/focus_new_friend"
        android:layout_width="52dp"
        android:layout_height="49dp"
        android:layout_gravity="center_horizontal"
        android:background="@drawable/user"

        />


</LinearLayout>

2、设计一个标题栏类，将每一个按钮绑定事件
重写了linearlayout中带有两个参数的构造函数，在布局中引入titlelayout就会自动调用构造函数，对标题栏布局进行动态加载，借助LayoutInFlater实现 LayoutInFlater的from方法构造出一个LayoutInFlater对象，调用inflate 方法动态加载布局文件，inflate方法接受两个参数
第一个：要加载布局的id 2：给加载好的布局再加入一个父布局，直接this

注意：该类应该转移到ui包内
一个标题类，包含关注页面标题栏的基本内容

package com.bytedance.focustest;


import android.app.Activity;
import android.content.Context;
import android.util.AttributeSet;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.Button;
import android.widget.LinearLayout;
import android.widget.Toast;

public class TitleLayout extends LinearLayout {
    public TitleLayout(Context context, AttributeSet attrs){
        super(context,attrs);
        LayoutInflater.from(context).inflate(R.layout.focus_title,this);
        Button titleFocusBack=(Button) findViewById(R.id.focus_back);
        Button titleFocusFriend=(Button) findViewById(R.id.focus_friend);
        Button titleFocusFocus=(Button) findViewById(R.id.focus_focus);
        Button titleFocusFans=(Button) findViewById(R.id.focus_fans);
        Button titleFocusNewFriend=(Button) findViewById(R.id.focus_new_friend);
        titleFocusBack.setOnClickListener(new OnClickListener() {
            @Override
            public void onClick(View view) {

                    ((Activity)getContext()).finish();
                }
            });

       titleFocusFriend.setOnClickListener(new OnClickListener() {
           @Override
           public void onClick(View view) {
               Toast.makeText(getContext(),"去朋友列表",Toast.LENGTH_SHORT).show();
           }
       });
        titleFocusFocus.setOnClickListener(new OnClickListener() {
            @Override
            public void onClick(View view) {
                Toast.makeText(getContext(),"去关注列表",Toast.LENGTH_SHORT).show();
            }
        });
      titleFocusFans.setOnClickListener(new OnClickListener() {
            @Override
            public void onClick(View view) {
                Toast.makeText(getContext(),"去粉丝列表",Toast.LENGTH_SHORT).show();
            }
        });
      titleFocusNewFriend.setOnClickListener(new OnClickListener() {
            @Override
            public void onClick(View view) {
                Toast.makeText(getContext(),"去发现新用户列表",Toast.LENGTH_SHORT).show();
            }
        });
    }
}

3、最后一步，在需要用到该标题栏的布局xml文件中加入该标题栏

<com.bytedance.focustest.TitleLayout

    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    />

4、小工具：搜索栏的实现
SearchView是Android原生的搜索框控件，它提供了一个用户界面，用于用户搜索查询。
SearchView默认是展示一个search的icon，点击icon展开搜索框，如果你想让搜索框默认就展开，可以通过setIconifiedByDefault(false);实现。
使用SearchView时可使用如下常用方法。

setIconifiedByDefault(Boolean iconified)：设置该搜索框默认是否自动缩小为图标。

setSubmitButtonEnabled(Boolean enabled)：设置是否显示搜索按钮。

setQueryHint(CharSequence hint)：设置搜索框内默认显示的提示文本。

setOnQueryTextListener(SearchView.OnQueryTextListener listener)：为该搜索框设置事件监听器。

如果为SearchView增加一个配套的ListView，则可以为SearchView增加自动完成功能。

<SearchView
    android:id="@+id/searchView"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:iconifiedByDefault="false"
    android:queryHint="搜索内容" />

记得在build.gradle中加入依赖呀~

implementation 'androidx.appcompat:appcompat:1.5.0'

UI设计探索之标题栏、搜索的使用 | 青训营笔记

这是我参与「第四届青训营」笔记创作活动的第2天。