安卓学习笔记---自定义app顶部标题栏

几乎每一个安卓应用在顶部都有一个标题栏，有返回，标题，编辑等其他显示的控件，这些控件在每一个页面都会显示，那么又是怎么实现的呢？

最笨的方法就是每一个页面都去重新写一遍，就有了大量重复的代码，也浪费了大量的时间，如果还有点击事件，那无疑在代码中又写了很多重复的代码，蓝瘦香菇有木有


比较好的方式就是我们只写一个文件，然后让其他的布局文件来引用即可，简单高效。

下面看看如何实现：借鉴郭神的思路

引入布局：

首先我们创建一个title_bar.xml文件，用来定义标题栏需要展示哪些控件，代码如下所示：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal" android:layout_width="match_parent"
android:layout_height="50dp"
android:background="#00ffff"
>
<Button
android:id="@+id/btnBack"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="返回"
android:layout_alignParentLeft="true"
/>
<TextView
android:id="@+id/tv_title"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:gravity="center"
android:text="标题"
android:layout_centerInParent="true"
/>

<Button
android:id="@+id/btnEdit"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="编辑"
android:layout_alignParentRight="true"
/>
</LinearLayout>

定义了两个按钮，一个显示标题的文本。

这样我们就可以在每个xml文件中来引入了，代码如下：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<include layout="@layout/title_bar"></include>

</LinearLayout>

运行之后，效果如下所示：

同时我们还看到了安卓自带了标题栏功能，这里我们使用代码先隐藏掉，代码如下所示：

android.support.v7.app.ActionBar actionBar=getSupportActionBar();
if(actionBar!=null)
{
actionBar.hide();
}

这里调用了getSupportActionBar()方法来获得ActivityBar的实例，然后在调用ActionBar的hide()方法将标题栏隐藏起来。再次运行程序，效果如下：



创建自定义控件

引入布局的技巧确实解决了重复编写布局代码的问题，但是如果布局中有一些控件要求能够响应事件，我们还是需要在每个活动中为这些控件单独编写一次事件注册代码。比如说标题栏中的返回按钮，其实不管是在哪个活动中，这个按钮功能都是相同的，即销毁当前活动。而如果在每一个活动中都需要重新注册一遍返回按钮的点击事件，无疑会增加很多重复代码，这种情况最好是使用自定义控件的方式解决。

代码如下：

/**
* 自定义标题栏
*/
public class TitleLayout extends LinearLayout{

private TextView tv_title;
public TitleLayout(Context context) {
super(context,null);
}

public TitleLayout(final Context context, AttributeSet attrs) {
super(context, attrs);

//引入布局
LayoutInflater.from(context).inflate(R.layout.title_bar,this);
Button btnBack=(Button)findViewById(R.id.btnBack);
Button btnEdit=(Button)findViewById(R.id.btnEdit);
btnBack.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View view) {
((Activity)getContext()).finish();
}
});

btnEdit.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View view) {
Toast.makeText(context,"编辑",Toast.LENGTH_SHORT).show();
}
});

tv_title=(TextView)findViewById(R.id.tv_title);

}

//显示活的的标题
public void setTitle(String title)
{
if(!TextUtils.isEmpty(title))
{
tv_title.setText(title);
}
}
}

给出了按钮的点击事件以及显示活动标题的方法，接下来如何使用呢？

首先来看xml文件：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="#ff00ff"
tools:context="com.test.helloworld.MainActivity">

<com.test.helloworld.view.TitleLayout
android:id="@+id/titlelayout"
android:layout_width="match_parent"
android:layout_height="wrap_content">
</com.test.helloworld.view.TitleLayout>

</LinearLayout>

添加自定义控件和添加普通控件的方式基本是一样的，只不过在添加自定义控件的时候，我们需要指明控件的完整类名，包名在这里是不可以省略的。

接下来我们就看在代码中如何使用：

public class SeconeActivity extends BaseActivity {
private TitleLayout titlelayout;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_secone);
//隐藏系统的标题栏
android.support.v7.app.ActionBar actionBar=getSupportActionBar();
if(actionBar!=null)
{
actionBar.hide();
}
titlelayout=(TitleLayout)findViewById(R.id.titlelayout);
//显示活动自定义标题
titlelayout.setTitle("第二个页面");
}
}

运行效果如下：



看到了吗，使用就是这么简单，赶快用上吧，减少很多代码呢。