Android用户注册界面简单设计

本文实例为大家分享了Android用户注册界面的设计,供大家参考,具体内容如下

I. 实例目标
设计一个用户注册界面,在其中要使用到一些基础控件,如 文本框、编辑框、按钮、复选框等控件

II. 技术分析
首先在布局文件中使用控件的标记来配置所需要的各个控件,然后在 主Activity中获取到该控件,给其添加监听器来监听其操作,最后在控制台输出所操作的内容。

III. 实现步骤
在Eclipse中创建 Android项目,名称为 TestUserRegister 。设计一个用户注册界面,在其中要使用到 文本框、编辑框、按钮、单选按钮、复选框、列表选择框、列表视图、图片视图 等控件。

(1)在项目 res 目录下的 drawable_ldpi 文件夹中,放入两张名称分别为 logo5.jpg 和 background3.jpg 的图片,用于作为显示的 logo 图片和背景图片。

(2)在项目的res/values 目录中新建数组资源文件 arrays.xml ,在该文件中添加两个字符串数组,名称分别为 type 和 care,代码如下

<?xml version="1.0" encoding="utf-8"?>
<resources>
  <string-array name = "type">
    <item>学生</item>
    <item>老师</item>
    <item>白领</item>
    <item>工程师</item>
    <item>其他</item>
  </string-array>

  <string-array name = "care">
    <item>1.保护用户个人信息</item>
    <item>2.用户在本网站上不得发布违法信息</item>
    <item>3.保护个人账号和密码安全</item>
    <item>4.本网站所有权和解释权归本网站拥有</item>
  </string-array>

</resources>

(3)在项目的res/layout 目录下修改 activity _main.xml 文件,首先将界面整体布局改为表格布局,并设置背景,之后添加一个图像视图作为 logo 图像显示,代码如下:

<TableLayout 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="@drawable/background3">

  <ImageView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:src="@drawable/logo5"
    android:id="@+id/imageView02"
    android:layout_margin="5dp"
    android:adjustViewBounds="true"
    android:maxWidth="75dp"
    android:maxHeight="60dp"/>
</TableLayout>

上述代码中,android:adjustViewBounds 属性用于设置 ImageView 是否调整自己的边界来保持所需显示图片的长度变化,为 true 时表示调整自己的边界来保持所需显示图片的长度变化; android:maxWidth 和 android:maxHeight 分别表示 ImageView 的最大宽度和最大高度。

(4)添加三个 TableRow 表格行,并在其中添加 3 个 文本框(TextView) 和 编辑框控件(EditText) ,用来显示和填写 用户名、密码 和 确认密码。具体代码如下:

<TableRow>

    <TextView
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="用户名:"
      android:layout_marginLeft="5dp"/>

    <EditText
      android:layout_width="250dp"
      android:layout_height="wrap_content"
      android:hint="请输入用户名"
      android:id="@+id/editText01"
      android:singleLine="true"
      android:inputType="textPersonName"/>

  </TableRow>

  <TableRow>
    <TextView
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="密码:"
      android:layout_marginLeft="5dp"/>

    <EditText
      android:layout_width="250dp"
      android:layout_height="wrap_content"
      android:hint="请输入密码"
      android:id="@+id/editText02"
      android:singleLine="true"
      android:inputType="textPassword"/>
  </TableRow>

  <TableRow>
    <TextView
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="确认密码:"
      android:layout_marginLeft="5dp"/>

    <EditText
      android:layout_width="250dp"
      android:layout_height="wrap_content"
      android:hint="请输入密码"
      android:id="@+id/editText03"
      android:singleLine="true"
      android:inputType="textPassword"/>
  </TableRow>

在上述代码中,EditText 控件中的 android:singleLine = “true” 表示单行输入文本, android:inputType=”textPersonName” 表示输入类型为用户名。 android:inputType=”textPassword” 表示输入的内容为密码,将用 “ . ” 代替输入的内容,避免密码泄露。

(5)添加一个线性布局,在其中添加一个文本框控件(TextView)和一个单选按钮组(RadioGroup) , 其中在单选按钮组中添加两个单选按钮控件,其中线性布局的 android:orientation 属性设置为 “horizontal”,具体代码如下

<LinearLayout
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:orientation="horizontal"
      android:layout_marginTop="10dp">

    <TextView
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_marginLeft="5dp"
      android:layout_gravity="center_vertical"
      android:text="请选择您的性别" />

    <RadioGroup

       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:orientation="horizontal"
       android:id="@+id/sex">

      <RadioButton
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:text="男"
         android:id="@+id/radioButton1"/>

      <RadioButton
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:text="女"
         android:id="@+id/radioButton2"/>
    </RadioGroup>

  </LinearLayout>

(6)添加一个线性布局,在其中添加一个文本框(TextView) 和 一个列表选择框控件(Spinner),线性布局的 android:orientation 属性设置为 “horizontal” ,其中列表选择框的 android:entries 属性为 “@array/type”,代码如下

<LinearLayout
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:orientation="horizontal"
     android:layout_marginTop="10dp">

    <TextView
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="请选择您的身份"
      android:layout_marginLeft="5dp"/>

    <Spinner
      android:entries="@array/type"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:id="@+id/spinner"/>

  </LinearLayout>

(7)添加一个文本框控件(TextView) 、列表视图控件(ListView) 、 复选框控件(CheckBox) 和 一个普通按钮控件(Button) ,代码如下

<TextView
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="服务条款"
      android:textSize="27sp"
      android:gravity="center_horizontal"/>

  <ListView
      android:id="@+id/listView"
      android:entries="@array/care"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"/>

  <CheckBox
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:id="@+id/checkBox"
      android:text="我同意上述条款"/>

  <Button
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:id="@+id/reg"
      android:text="注册"
      android:gravity="center_horizontal"
      android:visibility="invisible"/>

上述代码中,TextView控件的 android:gravity=”center_horizontal” 表示文本框控件在屏幕中水平放置;普通按钮中的 android:visibility 属性表示该控件是否可见,在这里设置的是不可见。

(8)activity_main.xml文件完整代码

<TableLayout 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="@drawable/background3">

  <ImageView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:src="@drawable/logo5"
    android:id="@+id/imageView02"
    android:layout_margin="5dp"
    android:adjustViewBounds="true"
    android:maxWidth="75dp"
    android:maxHeight="60dp"/>

  <TableRow>

    <TextView
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="用户名:"
      android:layout_marginLeft="5dp"/>

    <EditText
      android:layout_width="250dp"
      android:layout_height="wrap_content"
      android:hint="请输入用户名"
      android:id="@+id/editText01"
      android:singleLine="true"
      android:inputType="textPersonName"/>

  </TableRow>

  <TableRow>
    <TextView
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="密码:"
      android:layout_marginLeft="5dp"/>

    <EditText
      android:layout_width="250dp"
      android:layout_height="wrap_content"
      android:hint="请输入密码"
      android:id="@+id/editText02"
      android:singleLine="true"
      android:inputType="textPassword"/>
  </TableRow>

  <TableRow>
    <TextView
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="确认密码:"
      android:layout_marginLeft="5dp"/>

    <EditText
      android:layout_width="250dp"
      android:layout_height="wrap_content"
      android:hint="请输入密码"
      android:id="@+id/editText03"
      android:singleLine="true"
      android:inputType="textPassword"/>
  </TableRow>

  <LinearLayout
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:orientation="horizontal"
      android:layout_marginTop="10dp">

    <TextView
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_marginLeft="5dp"
      android:layout_gravity="center_vertical"
      android:text="请选择您的性别" />

    <RadioGroup

       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:orientation="horizontal"
       android:id="@+id/sex">

      <RadioButton
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:text="男"
         android:id="@+id/radioButton1"/>

      <RadioButton
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:text="女"
         android:id="@+id/radioButton2"/>
    </RadioGroup>

  </LinearLayout>

  <LinearLayout
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:orientation="horizontal"
     android:layout_marginTop="10dp">

    <TextView
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="请选择您的身份"
      android:layout_marginLeft="5dp"/>

    <Spinner
      android:entries="@array/type"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:id="@+id/spinner"/>

  </LinearLayout>

  <TextView
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="服务条款"
      android:textSize="27sp"
      android:gravity="center_horizontal"/>

  <ListView
      android:id="@+id/listView"
      android:entries="@array/care"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"/>

  <CheckBox
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:id="@+id/checkBox"
      android:text="我同意上述条款"/>

  <Button
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:id="@+id/reg"
      android:text="注册"
      android:gravity="center_horizontal"
      android:visibility="invisible"/>

</TableLayout>

(9)在MainActivity.java 文件中,获取到复选框控件、普通按钮控件、单选按钮组控件和列表选择框控件,并为它们添加监听器,代码如下

import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.AdapterView;
import android.widget.AdapterView.OnItemSelectedListener;
import android.widget.ArrayAdapter;
import android.widget.Button;
import android.widget.CheckBox;
import android.widget.CompoundButton;
import android.widget.CompoundButton.OnCheckedChangeListener;
import android.widget.EditText;
import android.widget.ListView;
import android.widget.RadioButton;
import android.widget.RadioGroup;
import android.widget.Spinner;
import android.app.Activity;

public class MainActivity extends Activity {

  private Button reg = null;
  private int location = -1;
  private Spinner spinner = null;
  private CheckBox checkBox = null;
  private EditText editText01 = null ;
  private EditText editText02 = null;
  private EditText editText03 = null;
  private RadioButton radio =null ;
  private ListView listView = null;
  private RadioGroup sex;

  protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    //找到关心的控件
    reg = (Button) findViewById(R.id.reg);
    spinner = (Spinner) findViewById(R.id.spinner);
    checkBox = (CheckBox) findViewById(R.id.checkBox);
    editText01 = (EditText) findViewById(R.id.editText01);
    editText02 = (EditText) findViewById(R.id.editText02);
    editText03  = (EditText) findViewById(R.id.editText03);

    listView = (ListView) findViewById(R.id.listView);
    sex = (RadioGroup) findViewById(R.id.sex);

    ArrayAdapter<CharSequence> adapter = ArrayAdapter.createFromResource(this, R.array.care, android.R.layout.simple_spinner_item);
    listView.setAdapter(adapter);//适配器与列表视图关联
    //为复选框控件添加监听器
    checkBox.setOnCheckedChangeListener(new checkBoxOnCheckedChangeListener ());

    sex.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener() {

      public void onCheckedChanged(RadioGroup group, int checkedId) {

          radio = (RadioButton) findViewById(checkedId);

      }
    });

    spinner.setOnItemSelectedListener(new spinnerOnItemSelectedListener());

    reg.setOnClickListener(new regOnClickListener());

  }

  class regOnClickListener implements OnClickListener{

    public void onClick(View v) {

      Log.i("您输入的用户名为:", editText01.getText().toString());
      Log.i("您输入的密码为:", editText02.getText().toString());
      Log.i("您输入的确认密码为:", editText03.getText().toString());

      if (radio != null) {
        Log.i("您选择的性别为:", radio.getText().toString());
      }else {
        Log.i("您选择的性别为:", "无");
      }

      Log.i("您选择的身份为:", spinner.getItemAtPosition(location).toString());

    }

  }

  class spinnerOnItemSelectedListener implements OnItemSelectedListener{

    public void onItemSelected(AdapterView<?> parent, View view,
        int position, long id) {

      //获取下拉列表框控件选中的位置
      location = position;      

    }

    public void onNothingSelected(AdapterView<?> parent) {
    }

  }

  //复选框控件监听器
  class checkBoxOnCheckedChangeListener implements OnCheckedChangeListener{

    public void onCheckedChanged(CompoundButton buttonView,
        boolean isChecked) {

      if (isChecked) {
        reg.setVisibility(View.VISIBLE);
      }else {
        reg.setVisibility(View.INVISIBLE);
      }

    }

  }

}

在上述代码中,通过下拉列表框控件的监听器来获取所选内容的位置,然后赋值给 location 变量;在复选框控件的监听器中,如果该复选框被选中,则注册按钮显示可见,否则不可见。

IV. 运行

未填写信息前

填写信息并点击注册后

控制台输出信息

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持我们。

(0)

相关推荐

  • Android用户注册界面

    推荐阅读:Android如何通过手机获取验证码来完成注册功能 先给大家展示下界面效果图,感觉满意,请参考实现代码. Main.xml源码 <?xml version="1.0" encoding="utf-8"?> <TableLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_par

  • Android手机号注册、绑定手机号获取短信验证码实例

    本文写了一个常见的功能--手机app中注册或绑定手机号的获取验证码的功能,也就是短信验证功能 具体效果就是,你在注册界面填写手机号,点击获取验证码按钮,---然后会收到验证短信,填入验证码后点击注册按钮,如果验证正确就可以跳转到另外一个界面 1.首先大家需要在mob官网注册一个账号,mob是一个免费的短信验证平台 2.在mob.com后台创建应用 3.下载对应的sdk 4.将sdk作为一个library导入到你的项目中 5.现在就可以在你的项目中编写代码使用mob提供的这个功能了 具体代码如下:

  • Android注册登录实时自动获取短信验证码

    android应用的自动化测试必然会涉及到注册登录功能,而许多的注册登录或修改密码功能常常需要输入短信验证码,因此有必要能够自动获得下发的短信验证码. 主要就是实时获取短信信息. android上获取短信信息主要有BroadcastReceiver方式与数据库方式,要实时的话就BroadcastReceiver比较方便,分享一篇文章大家可以查看一下,点击. public class SMSReceiver extends BroadcastReceiver{ private String ver

  • Android实现QQ新用户注册界面遇到问题及解决方法

    在上篇文章给大家介绍了Android实现QQ登录界面遇到问题及解决方法,本篇文章继续给大家介绍有关android qq界面知识. 先给大家展示下效果图: 问题: 1.下拉列表(因为还没看到这里...) 2.标题栏显示问题 3.按钮的 Enable 设置 以下是代码: 布局 fragment_main(问题1) <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools

  • Android QQ新用户注册界面绘制

    先看看效果图: 问题: 1.下拉列表(因为还没看到这里...) 2.标题栏显示问题 3.按钮的 Enable 设置 .......... 以下是代码: 布局 fragment_main(问题1) <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layo

  • Android客户端实现注册、登录详解(1)

    我们在开发安卓App时难免要与服务器打交道,尤其是对于用户账号信息的注册与登录更是每个Android开发人员必须掌握的技能,本文将对客户端的注册/登录功能的实现进行分析,不到之处还请指出. 在这里我们仅讨论客户端如何请求服务器进行注册,而服务器在收到客户端请求后进行的一系列操作并不在本文所述范围内,有兴趣大家可以参考 请求服务器 客户端在进行用户信息的注册和登录时一般使用post请求(携带参数)去服务器.以volley框架请求服务器为例,真正与服务器进行交互的就是如下代码: StringRequ

  • Android开发中实现用户注册和登陆的代码实例分享

    在android的应用中越来越多的包含了网络互动功能,这就带来了注册,登陆账号功能.本文完整的介绍对话框的方式实现用户登陆功能. 登陆效果: 应用程序判断当前用户还未登陆,弹出登陆对话框,用户输入账号和密码信息后,传到服务器验证,验证成功后,现实Toast 成功信息,并转到其他界面. 注册效果:用户如没有账号,则点击登陆对话框的 "没有账号,快速注册账号", 弹出注册界面,用户输入注册信息,点击注册按钮,注册成功后,弹出toast信息"注册成功",完成注册后,转到其

  • Android设计登录界面、找回密码、注册功能

    本文实例为大家分享了Android 登录.找回密码.注册功能的实现代码,供大家参考,具体内容如下 1.数据库的设计 我在数据库中添加了两张表,一张表用来存储用户信息,诸如用户名,密码,手机号等,可任意添加.另一张表用来存储上一个登录用户的账户信息,我是为了方便才另外创建了一张表去存储,而且这张表我设计了它只能存储一条信息,每次的存储都是对上一条记录的覆盖.事实上,我尝试过在存储用户信息的那张表内添加一个标识,用来标记上一次登录的是哪一个帐号,但是这样做的话,每次改变标识都需要遍历整张表,十分的麻

  • Android注册广播的两种方法分析

    本文实例分析了Android注册广播的两种方法.分享给大家供大家参考,具体如下: 1. 在AndroidManifest.xml文件中注册. 好处:一旦应用程序被安装到手机里,BroadCast Receiver就开始生效.无论应用程序进程是否运行,运用程序是否在开启状态下都可以接受到广播事件. <receiver android:name=".receiver.SMSReceiver" > <intent-filter android:priority="

  • Android实现带头像的用户注册页面

    1.首先是注册页面的布局: <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent"

随机推荐