—— 你不能把这个世界让给你所鄙视的人
前几篇我们讲了基本控件和常用布局的基本用法,这里来从整体上看看他们的继承关系。
可以看到,我们所用的控件最终都是继承自View,View是Android中最基本的用户界面组件,它占据屏幕上的一块矩形区域,并且负责绘图和事件处理。我们所用的常用布局是继承自ViewGroup,ViewGroup是一种特殊的View,它包含了多个拥有LayoutParams属性的View。
引入布局
如果你经常使用APP你会发现,很多APP的界面顶部都会有一个标题栏,标题栏左右是一个返回图标,中间是当前页面的名字。对于这种多个页面都有的样式,如果在每个布局中都编写一遍同样的标题栏样式,明显就会导致代码的大量重复并且不好维护,比如以后改变需求,需要在最右边增加一个分享图标,那岂不是每个都要去修改一遍。这个时候我们可以使用引入布局的方式来解决这个问题,新建一个布局 layout_mytitle.xml,代码如下:
| 123456789101112131415161718192021222324252627282930313233 | <?``xml version``=``"1.0" encoding``=``"utf-8"``?>``<``androidx.constraintlayout.widget.ConstraintLayout xmlns:android``=``"http://schemas.android.com/apk/res/android"`` ``xmlns:app``=``"http://schemas.android.com/apk/res-auto"`` ``xmlns:tools``=``"http://schemas.android.com/tools"`` ``android:layout_width``=``"match_parent"`` ``android:layout_height``=``"match_parent"`` ``tools:context``=``".MainActivity"``>`` ``<``FrameLayout`` ``android:layout_width``=``"match_parent"`` ``android:layout_height``=``"wrap_content"`` ``app:layout_constraintEnd_toEndOf``=``"parent"`` ``app:layout_constraintStart_toStartOf``=``"parent"`` ``app:layout_constraintTop_toTopOf``=``"parent"``>`` ``<``ImageView`` ``android:id``=``"@+id/img_back"`` ``android:layout_width``=``"wrap_content"`` ``android:layout_height``=``"wrap_content"`` ``android:padding``=``"10dp"`` ``android:src``=``"@drawable/back_black1" />`` ``<``TextView`` ``android:id``=``"@+id/tv_title"`` ``android:layout_width``=``"wrap_content"`` ``android:layout_height``=``"wrap_content"`` ``android:layout_gravity``=``"center"`` ``android:text``=``"标题"`` ``android:textColor``=``"#222222"`` ``android:textSize``=``"16sp" />`` ``</``FrameLayout``>``</``androidx.constraintlayout.widget.ConstraintLayout``> |
|---|
然后在每个需要用到此标题栏的布局里引入就可以了,如下:
| 12345678910 | <?``xml version``=``"1.0" encoding``=``"utf-8"``?>``<``androidx.constraintlayout.widget.ConstraintLayout 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"`` ``tools:context``=``".MainActivity"``>`` ``<``include layout``=``"@layout/layout_mytitle" />``</``androidx.constraintlayout.widget.ConstraintLayout``> |
|---|
运行看看效果:
创建自定义控件
引入布局的技巧确实解决了重复编写布局代码的问题,但是如果布局中有一些控件要求能够响应事件,我们还需要在每个Activity中为这些控件单独编写一次事件注册的代码。比如说标题栏中的返回图标,其实不管是在哪一个活动中,这个按钮的功能都是相同的,即退出当前活动。而如果在每一个活动中都需要重新注册一遍返回按钮的点击事件,无疑又是增加了很多重复代码,这种情况最好是使用自定义控件的方式来解决。
新建 MyTitleLayout 继承自 FramLayout,让它成为我们自定义的标题栏控件,代码如下:
| 123456789101112131415161718192021 | import android.content.Context;``import android.util.AttributeSet;``import android.view.LayoutInflater;``import android.view.View;``import android.widget.FrameLayout;``import android.widget.Toast;``public class MyTitleLayout ``extends FrameLayout {`` ``public MyTitleLayout(Context context, AttributeSet attr) {`` ``super``(context, attr);`` ``View view = LayoutInflater.from(context).inflate(R.layout.layout_mytitle, ``this``);`` ``view.findViewById(R.id.img_back).setOnClickListener(``new OnClickListener() {`` ``@Override`` ``public void onClick(View v) {`` ``Toast.makeText(context, ``"点击了返回图标"``, Toast.LENGTH_SHORT).show();`` ``}`` ``});`` ``}``} |
|---|
首先我们重写了 FrameLayou中的带有两个参数的构造函数,这样我们在布局中引入 MyTitleLayout控件就会调用这个构造函数。然后在构造函数中需要对标题栏布局进行动态加载,这就要借助 LayoutInflater 来实现了。通过 LayoutInflater 的 from()方法可以构建出一个LayoutInflater 对象,然后调用 inflate()方法就可以动态加载一个布局文件,inflate()方法接收两个参数,第一个参数是要加载的布局文件的 id,这里我们传入 R.layout.layout_mytitle,第二个参数是给加载好的布局添加一个父布局,这里我们想要指定为 MyTitleLayout,于是直接传入 this。
现在自定义控件已经创建好了,然后我们需要在布局文件中添加这个自定义控件,修改activity_main.xml:
| 12345678910111213141516 | <?``xml version``=``"1.0" encoding``=``"utf-8"``?>``<``androidx.constraintlayout.widget.ConstraintLayout 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"`` ``xmlns:app``=``"http://schemas.android.com/apk/res-auto"`` ``tools:context``=``".MainActivity"``>`` ``<``com.example.myapplication1.MyTitleLayout`` ``android:layout_width``=``"match_parent"`` ``android:layout_height``=``"wrap_content"`` ``app:layout_constraintEnd_toEndOf``=``"parent"`` ``app:layout_constraintStart_toStartOf``=``"parent"`` ``app:layout_constraintTop_toTopOf``=``"parent" />``</``androidx.constraintlayout.widget.ConstraintLayout``> |
|---|
添加自定义控件和添加普通控件的方式基本是一样的,只不过在添加自定义控件的时候我们需要指明控件的完整类名,包名在这里是不可以省略的。
重新运行程序,你会发现此时效果和使用引入布局方式的效果是一样的。