手记

使用Android Design中的TextInputLayout创建现在流行的账户登陆

TextInputLayout是一个能够把EditText包裹在当中的一个布局,当输入文字时,它可以把Hint文字飘到输入框的上方。

效果图如下:

1.添加依赖库:(红色)

dependencies {
    compile fileTree(dir: 'libs', include: ['*.jar'])
    testCompile 'junit:junit:4.12'
    compile 'com.android.support:appcompat-v7:23.4.0'
    compile 'com.android.support:design:23.0.1'
}

2.实现UI代码:(使TextInputLayout包裹EditText)

<RelativeLayout 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:wheel="http://schemas.android.com/apk/res-auto"
    android:orientation="vertical"
    android:background="@color/gray"
    >

    <RelativeLayout
        android:id="@+id/rl_title"
        android:background="@color/theme_color"
        android:layout_width="match_parent"
        android:layout_height="50dp">
        <TextView
            android:id="@+id/tv_back"
            android:gravity="center_vertical"
            android:textColor="@color/white"
            android:textSize="@dimen/normal_title_btn_textSize"
            android:layout_centerVertical="true"
            android:text="@string/back"
            android:drawableLeft="@drawable/back"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
        <TextView
            android:textSize="@dimen/normal_title_btn_textSize"
            android:textColor="@color/white"
            
            android:layout_centerInParent="true"
            android:text="@string/login"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
        <TextView
            android:layout_marginRight="@dimen/middle_space"
            android:layout_alignParentRight="true"
            android:id="@+id/tv_register"
            android:gravity="center_vertical"
            android:textColor="@color/white"
            android:textSize="@dimen/normal_title_btn_textSize"
            android:layout_centerVertical="true"
            android:text="@string/register"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />

    </RelativeLayout>
    <android.support.design.widget.TextInputLayout
        android:id="@+id/tl_name"
        android:layout_below="@+id/rl_title"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <EditText
            android:id="@+id/et_login_name"
            android:drawablePadding="@dimen/middle_space"
            android:drawableLeft="@drawable/hint_user"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:hint="@string/hint_username" />
    </android.support.design.widget.TextInputLayout>

    <android.support.design.widget.TextInputLayout
        android:id="@+id/tl_pwd"
        android:layout_below="@+id/tl_name"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <EditText
            android:id="@+id/et_login_pwd"
            android:drawablePadding="@dimen/middle_space"
            android:drawableLeft="@drawable/pwd_hint"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:hint="@string/et_pwd_hint" />
    </android.support.design.widget.TextInputLayout>

    <Button
        android:layout_below="@+id/tl_pwd"
        android:id="@+id/btn_login"
        android:background="@drawable/btn_login_background"
        android:textSize="@dimen/normal_textSize"
        android:textColor="@color/white"
        android:text="@string/login"
        android:layout_margin="@dimen/middle_space"
        android:padding="@dimen/middle_space"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

</RelativeLayout>

3.在activity中做逻辑判断和请求网络:(我用的是黄油刀butterknife,所以Id和OnClick都是直接生成的)

@OnClick(R.id.btn_login)
public void login() {
    wheel.spin();
    final String name = etName.getText().toString().trim();
    final String pwd = etPwd.getText().toString().trim();
    if (TextUtils.isEmpty(name)) {
        CampusUtils.showToast(LoginActivity.this, "用户名不能为空");
        return;
    }
    if (TextUtils.isEmpty(pwd)) {
        CampusUtils.showToast(LoginActivity.this, "密码不能为空");
        return;
    }
    Person.loginByAccount(this, name, pwd, new LogInListener<Person>() {
        @Override
        public void done(Person person, BmobException e) {
            MySP.setPASSWoRD(LoginActivity.this, pwd);
            MySP.setUSERNAME(LoginActivity.this, name);
            wheel.stopSpinning();
            CampusUtils.showToast(LoginActivity.this, "登录成功");
            Intent intent = new Intent(LoginActivity.this, MainActivity.class);
            startActivity(intent);
            finish();
            if (LoginActivity.instance != null) {
                LoginActivity.instance.finish();
            }
            if (PersonActivity.instance != null) {
                PersonActivity.instance.finish();
            }
            if (MainShowActivity.instance!=null){
                MainShowActivity.instance.finish();
            }
        }
    });
}

原文链接:http://www.apkbus.com/blog-784586-62434.html

0人推荐
随时随地看视频
慕课网APP