Android开发技巧——自定义控件之组合控件

Android开发技巧——自定义控件之组合控件

我准备在接下来一段时间,写一系列有关Android自定义控件的博客,包括如何进行各种自定义,并分享一下我所知道的其中的技巧,注意点等。

还是那句老话,尽管我知道会被爬虫机器给过滤掉。

本文原创,转载请注明在CSDN博客上的出处:

http://blog.csdn.net/maosidiaoxian/article/details/49884261

今天写第一篇,就先写一下最简单的,也就是我们大概最早接触的一类自定义——组合控件。

这里仅讨论使用布局文件来进行组合控件。

为什么不用Java代码来写布局?原因是没有布局文件直观明了,能预览,好维护。

下面来看一个例子。

假如我们在一个界面当中的某部分布局,在另外一个界面中也会用到。

Android开发技巧——自定义控件之组合控件

例如如上图所示,圈起来的内容,可能除了在支付界面上用到,在记录界面上也会用到,那么,你会如何处理这种情况呢?。我们先把布局实现一下:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:paddingLeft="16dp"
                android:paddingRight="16dp"
                android:background="#494949">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_toLeftOf="@+id/login_register"
        android:text="@string/login_guide_text"
        android:textColor="@color/white"
        android:textSize="@dimen/text_28pt"/>

    <TextView
        android:id="@+id/login_register"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:text="@string/u_login_or_register"
        android:textColor="@color/font_span"
        android:textSize="@dimen/text_28pt"/>
</RelativeLayout>

接着:

直接复制代码

最新手的做法是,选中,复制,到另一个布局文件粘贴。然后会发现,要改一下界面的时候,要两边跟着改。直到我们学习了<include>标签之后。

使用<include>标签

于是,我们把这部分界面给抽出来,到一个新的布局文件中。然后在两个布局当中都include一下。现在如果要改这部分的界面,我们只需要改抽出来的那个文件即可,如果不涉及到所include的布局本身的属性的话。

现在看来是不是好多了?尽管只看布局代码是这样的,但是——

通常我们都不是写一个界面就这样了事了,我们还要在Java代码上,对一些控件设置一些文字,背景色,或是设置点击事件等等。而这部分的界面相同,它们的UI逻辑通常情况下也是相同的。显然,同样的代码要写两遍,作为一个有着懒惰习惯的程序员来说,当然是极极不情愿的。

自定义组合控件

于是我们定义一个类,继承自ViewGroup的子类,因为我们这里是组合一些控件,这些控件是要放在一个控件的容器里,所以不能是继承自View。我们把这个类命名为 LoginTipView,代码如下:

import android.app.Activity;
import android.content.Context;
import android.util.AttributeSet;
import android.view.Gravity;
import android.view.View;
import android.widget.RelativeLayout;
import android.widget.TextView;

/**
 * 提示去登录注册的View
 * @author Geek_Soledad
 * @since 15-5-26
 */
public class LoginTipView extends RelativeLayout implements View.OnClickListener{
    private TextView mLogin;

    public LoginTipView(Context context, AttributeSet attrs) {
        super(context, attrs);
        addView(View.inflate(context, R.layout.view_login_tip, null));
        mLogin = (TextView) findViewById(R.id.login_register);
        mLogin.setOnClickListener(this);
    }

    @Override
    public void onClick(View v) {
        getContext().startActivity(new Intent(getContext(), LoginActivity.class));
    }
}

看这一行代码:

        addView(View.inflate(context, R.layout.view_login_tip, null));

我们把一个布局,通过View.inflate()方法加载出来,并且通过调用addView方法,把它加到我们的LoginTipView中。

然后在我们其他使用到这部分界面的布局代码中这样引用:

    <com.parkingwang.widget.LoginTipView
        android:id="@+id/login_view"
        android:layout_width="match_parent"
        android:layout_height="42dp"
        android:layout_alignParentBottom="true"
        tools:visibility="visible"
        android:visibility="gone"/>

并且由于我们的登录的点击事件写在了LoginTipView里,所以我们甚至不需要在其他的Java代码里来设这个点击事件。

但是上面的代码还是有很大的优化余地的。最主要的是,我们的LoginTipView本身就继承自RelativeLayout,而它里面又放了一个我们从布局文件中加载的RelativeLayout,显然这部分内容可以合并。下面开始优化:

优化

首先,我们把布局代码的根元素改为`标签:

<?xml version="1.0" encoding="utf-8"?>
<merge xmlns:android="http://schemas.android.com/apk/res/android">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_toLeftOf="@+id/login_register"
        android:text="@string/login_guide_text"
        android:layout_alignParentLeft="true"
        android:textColor="@color/white"
        android:textSize="@dimen/text_28pt"/>

    <TextView
        android:id="@+id/login_register"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:text="@string/u_login_or_register"
        android:textColor="@color/font_span"
        android:textSize="@dimen/text_28pt"/>
</merge>

然后LoginTipView代码改为如下:

public class LoginTipView extends RelativeLayout implements View.OnClickListener{
    private TextView mLogin;

    public LoginTipView(Context context, AttributeSet attrs) {
        super(context, attrs);
        LayoutInflater.from(context).inflate(R.layout.view_login_tip, this, true);
        this.setGravity(Gravity.CENTER_VERTICAL);
        int padding = getResources().getDimensionPixelSize(R.dimen.padding_common);
        this.setPadding(padding, 0, padding, 0);
        mLogin = (TextView) findViewById(R.id.login_register);
        mLogin.setOnClickListener(this);
        this.setBackgroundResource(R.color.bg_login_tip_view);
    }

    @Override
    public void onClick(View v) {
        LoginMainActivity.showWithClosable((Activity) getContext());
    }
}

注意,我们现在加载布局的代码改为了LayoutInflater.from(context).inflate(R.layout.view_login_tip, this, true);,当然,使用View.inflate(context, R.layout.view_login_tip, this);也是一样的,后者在方法里面也是在调用前者的方法。然后,因为我们已经改为<merge>标签了,所以要把公共的属性写到我们的LoginTipView代码里(当然,你也可以不写,那你就需要在引用这个控件的布局代码里设置其对应属性)。

我们的优化过程是,使用<merge>标签,并在inflate时传入一个ViewGroup对象,使布局文件<merge>里的控件直接加载到这个ViewGroup里,减少层级。

对于这种自定义控件,其实可以说是对组合使用的控件的封装。需要注意的是,这时候你在<merge>元素本身定义的布局属性都是无效的。而这些你需要设定的属性,比如上面例子中的背景色,你可以写在你所封装的控件里,也是写在引用它的布局里。

下篇预告:

应该会讲一下onDraw(Canvas)来实现自定义吧。

上一篇:ASP.NET ZERO 学习 HangFire的使用


下一篇:一则利用内核漏洞获取root权限的案例【转】