前面我们学习了Android中常见的控件的基本布局,当系统自带的控件不满足我们的需求时,我们可不可以自己创建呢?当然可以,我们先来学习如何引用布局吧!
引用布局
首先我们创建一个新项目,然后我们新建一个标题栏布局吧,引用布局的目的就是为了避免代码重复,如果人一个程序中很多活动都需要这样一个标题栏,一遍一遍的写未免太麻烦,这时候我们就可以用引用布局的方式来解决问题。新建一个布局title.xml,设置两个按钮,一个返回,一个编辑,和一个文本标题。
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@drawable/title_bg">
<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="@drawable/title_back" //背景图
android:text="Back" //显示文字
android:textColor="#fff" //文字颜色
/>
<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="#fff"
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="@drawable/title_edit"
android:text="Edit"
android:textColor="#fff"
/>
</LinearLayout>
android:background属性用于为布局或控件指定一个背景,可以用颜色或图片来填充。
android:layout_margin="5dp"属性可以指定控件在上下左右方向上偏移的距离。
上面代码只是标题栏的布局,那么我们如何在程序中使用这个标题栏呢?修改activity_main.xml中代码:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<include layout="@layout/title"/>
</LinearLayout>
我们只需要通过一行include语句将标题栏布局引用进来就可以了。还需要在MainActivity中将系统中自带的标题栏隐藏掉,代码如下:
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();
}
}
}
这里我们调用了getSupportActionBar()方法来获取 ActionBar实例,再调用hide()方法将标题隐藏。
运行结果如下:我的这个界面是一个特别丑的例子,找图标的大小不合适,而且字体颜色也不合适,但是这个写标题栏的方法是没错的,这是一个不美观的示例:(懒得改了,就是个小例子)
创建自定义控件
引入布局解决了重复编写布局代码的问题,但是如果布局中有一些控件能够响应事件,我们还是需要在每个火哦东中为这些控件单独编写一次事件注册的代码。例如标题栏中的返回按钮,在哪一个活动中它的作用都是一样的,即销毁当前活动,如果在每个活动中都需要重新注册一遍返回按钮的点击事件,那也增加了许多重复代码,这个时候我们就使用自定义控件的方式来解决。
新建TitleLayout继承自LinearLayout,让它成为我们自定义的标题栏控件:
public class TitleLayout extends LinearLayout{
public TitleLayout(Context context, AttributeSet attrs){
super(context,attrs);
LayoutInflater.from(context).inflate(R.layout.title,this);
}
}
在这里我们重写了LinearLayout中带有两个参数的构造函数,通过LayoutInflater的from()方法可以构建一个LayoutInflater对象,调用inflate()方法就可以动态加载一个布局文件,该方法接收两个参数,一个使要加载布局的id,一个是给加载好的布局再添加一个父布局。
现在自定义控件已经创建好了,我们需要在布局文件中添加这个自定义控件,修改代码:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.example.uicustomviews.TitleLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
</LinearLayout>
添加自定义控件和普通控件的方法一样,只不过在添加自定义控件的时候,我们需要指明控件的完整类名,包名也不可以省略。下面我们为标题栏中的按钮注册点击事件。
public class TitleLayout extends LinearLayout{
public TitleLayout(Context context, AttributeSet attrs){
super(context,attrs);
LayoutInflater.from(context).inflate(R.layout.title,this);
Button titleBack = (Button) findViewById(R.id.title_back);
Button titleEdit = (Button) findViewById(R.id.title_edit);
titleBack.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
((Activity) getContext()).finish();
}
});
titleEdit.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
Toast.makeText(getContext(),"You clicked Edit button",
Toast.LENGTH_SHORT).show();
}
});
}
}
那我们来看一下运行结果,依旧是那个很丑的标题栏: