Android 开发：（十四）NavigationBar篇

Android 开发：（十四）NavigationBar篇"/>

Android 开发：（十四）NavigationBar篇

本篇记录了navigation bar顶部导航栏的自定义方法，抛砖引玉，简单实现了常用的布局，在此基础上可添加较复杂的布局。

第一步：新建NavigationBar文件，继承与FrameLayout。

第二步：设置系统AppTheme为NoActionBar

在res/values目录下style.xml文件：

<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar"><!-- Customize your theme here. --><item name="colorPrimary">@color/colorPrimary</item><item name="colorPrimaryDark">@color/colorPrimaryDark</item><item name="colorAccent">@color/colorAccent</item></style>

第三步： navigationbar.xml 布局

在navigationbar.xml文件中布局：
左边一个ImageView
中间TextView
右边一个ImageView

代码如下：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android=""android:layout_width="match_parent"android:layout_height="wrap_content"android:background="#303f9f"android:gravity="center_vertical"><ImageViewandroid:id="@+id/navigationbar_leftImage"android:layout_width="30dp"android:layout_height="30dp"android:layout_margin="10dp" /><TextViewandroid:id="@+id/navigationbar_title"android:layout_width="0dp"android:layout_height="wrap_content"android:layout_weight="1"android:gravity="center"android:textColor="@color/bg_white"android:textSize="20sp" /><ImageViewandroid:id="@+id/navigationbar_rightImage"android:layout_width="30dp"android:layout_height="30dp"android:layout_margin="10dp" /></LinearLayout>

第四步： NavigationBar文件

调用xml布局，并实现NavigationBar协议方法。

    private TextView tvTitle;private ImageView leftImage;private ImageView rightImage;public NavigationBar(@NonNull Context context) {super(context);initView(context);}public NavigationBar(@NonNull Context context, @Nullable AttributeSet attrs) {super(context, attrs);initView(context);}public NavigationBar(@NonNull Context context, @Nullable AttributeSet attrs, int defStyleAttr) {super(context, attrs, defStyleAttr);initView(context);}private void initView(Context context) {View view = inflate(context, R.layout.navigationbar, this);tvTitle    = view.findViewById(R.id.navigationbar_title);leftImage  = view.findViewById(R.id.navigationbar_leftImage);rightImage = view.findViewById(R.id.navigationbar_rightImage);}

此时已完成navigationbar的创建，但是为了统一维护，便于管理，再添加几个封装方法，以实现不同需求。

第五步： 封装公共方法

1. title赋值

 public void setTitle(String title) {tvTitle.setText(title);}

2. 对左侧图片赋值

public void setLeftImage(Integer image) {leftImage.setBackgroundResource(image);}

3. 左侧图片并添加点击事件和title字体

 public void init(String title, boolean isLeftVisiable, OnClickListener leftListener){tvTitle.setText(title);if (isLeftVisiable){leftImage.setVisibility(VISIBLE);leftImage.setOnClickListener(leftListener);}else {leftImage.setVisibility(INVISIBLE);}}

4. 右侧图片赋值并添加点击事件

 public void rightTabBar(boolean isRightVisiable, Integer image,  OnClickListener rightListener){rightImage.setBackgroundResource(image);if (isRightVisiable){rightImage.setVisibility(VISIBLE);rightImage.setOnClickListener(rightListener);}else {rightImage.setVisibility(INVISIBLE);}}