Android登陆界面


  

                                   
Android
手机登陆界面              

首先让我们来看一下,最基本的一个手机登陆界面图:

 

 

 

下面让我们通过以下步骤来制作出这个界面。

一、创建Android项目

 

配制好以上信息,创建好项目。在Package Explorer面板中可以看到刚创建的项目

具体看一下目录中,哪些是我们需要使用到的文件



 

 

 

 

 

根据上图我们可以看到:MainBody.java          Main.xml              Strings.xml            AndroidManifest.xml     这四个文件。我们需要知道这四个文件的具体作用是什么,才好接着做下面的工作。

MainBody.java——这是我们创建的java文件,他主要是实现项目的功能。

Main.xml       ——实现窗体界面的布局和显示。

Strings.xml——这是Main.xml程序中的变量登记表。

AndroidManifest.xml——这是窗体页面登记表。

以上只是简单的介绍其主要功能,接下来我们在具体的应用中来认识这几个文件。

 

二、显示窗体

1、打开Main.xml 文件,默认会默示如下:

 

 

如果了解超文本标记语言<HTML>,对上面的代码就会觉得很熟悉了,所以让我们主要看一下这几个标签具体代表什么意思:

LinearLayout表示一行的布局。这整个窗体布局器中只有一行,可见这个界面就只有一行,即整块手机屏幕区域。

TextView表示一个组件,用于显示一个文本区域,并且可以看到,这个文本是来看hello这个变量。

android:layout_width="fill_parent" 表示设置宽度,为充满整个窗体。

android:layout_height="wrap_content" 表示设置高度,为默认尺寸。

那么根据这个布局器的特点我们可以创建出我们想要的登陆界面。

 

Android中的窗体布局方式也和在java里面窗体布局方式是类似的,可以使用嵌套布局,就好像大盒子套用小盒子,从上面的代码中可以看出,整个屏幕是一行,在这一行中又分出了三行,分别为“帐户区”、“密码区”、“按钮区”。然后在三个区域中又添加了各种组件;<TextView>表示显示文本,<Edit Text>表示文本输入框,<Button>表示按钮。每行都设置了按行居中。需要注意设置组件的尺寸!

完成以上步骤就可以启动模拟器,查看一下自己设计的界面的效果。

 

看到效果后我们会发现,“Hello World, MainBody!”不是我们想要的,那么就让我们改正过来吧!

打开String.xml文件,可以看到在在Main.xml布局管理器中,hello变量的值<string name="hello">Hello World, MainBody!</string> ,其实我们也可以在这里创建变量和赋值,在Main.xml中去使用,但我们在这里可以改变hello变量的值,<string name="hello">用户登陆</string>。这样我们的基本界面就完成了。

 

三、添加功能

界面出来了,但你会发现窗体上的组件没有任何作用,所以接下来我们就需要为窗体上的组件添加上相应的功能。

登陆界面的功能是当我们输入正确的帐户和密码之后,自动将页面跳转到新的页面中去。即接下来要实现的就是从输入框中获取信息,按登陆按钮时自动核对信息。

这时我们需要在MainBody.java文件中来实现这些功能。以下为默认内容。

 

onCreate()就是我们的主程序入口,相当于Main()函数,在程序中第一个执行的主线程。也许我们会产生疑问,我们刚刚编写的窗体界面是如何与这个功能程序关联的呢?细心的人可以看到setContentView(R.layout.main);这句代码,正是这个代码确定了本程序的具体布局也是显示窗体的功能。

下面让我们来添加窗体的按钮的监听器,监听屏幕上对象。当按下按钮时产生相应的功能。



 

 

 

我们使用命名内部类的方式创建Lister监听对象,OnClickListener是一个接口,创建对象后还需要实现它里面的方法体,该接口中只有一个方法体onClickView v);接下来实现监听器内的方法麻烦就来了,如何知道窗体上点中的是哪个按钮呢?如何获得在Main.xml布局管理器中创建的组件呢?这时我们可以回到第二步“显示窗体”中或查看我们的Main.xml文件中,我们会发现,在我们创建组件时,都加上了android:id="@+id/person_name"这样一段代码,只是斜杠后面的名称都不一样,这就是我们给每个组件设置的ID号,这个ID号会在R.java文件中自动注册,并且全部是静态变量,既然是静态变量,那我们就可以跨类使用R.java文件中注册的ID号来对Main.xml中的对象操作了,如果我这样说不能明白,那只要知道我们可以通过使用对象的ID号来对组件操作就行了。

好啦!那我们从View V这个窗体对象中来获取被操作的对象ID,通过v.getId()方法来获得一个整形数值;用switch()语句来判断相应的操作,对应的值就是R.id.名称。通过这种方式我们就可以确定在窗体上点击了什么按钮,当然还需要对按钮对象加上这个监听方法就OK了。接着我们完善一下当按下“登陆”按钮时,触发的下一事件,即判断帐户和密码输入框中是否有内容以及内容是否正确。

我们知道了如何获取按钮的操作方法了,那么文本输入框的操作方法获取方式是否以前面一样呢?如果我们尝试后会知道,我们虽然可以通过ID获取文本输入框这个对象,却无法通过这种方法获取文本输入框中的内容。那么这里我们就需要把这个ID的对象实例化了,根据它的ID来实例化这个对象,如下图所示:

 

其实每个组件都可以被实例化,这里我们也看到了,需要通过实例化后的组件对象才能添加刚才我们创建的监听方法,这里需要注意,帐户和密码输入框两个组件都定义成了全局变量,这样方便在监听方法中直接引用。

好啦!我们又回来登陆操作上来,用判断语句来"dongjie".equals(person_password.getText().toString()判断是不是正确的用户名,toString是把getText()方法中获取的信息转化成字符串来比较;这样如果成立就继续判断密码,如果密码也成立就跳转页面(实现跳转页面的方法在第四步)。如果输入有误,那么我们可以在手机屏幕上出现错误提示信息Toast.makeText(iPhoneI.this, "帐户名有误!", 3).show();

“注册”按钮由于时间的原因没有去实现,其实注册很简单,创建一个队列,可以把用户信息保存起来,再在登陆时从队列中取出数据来比对就OK了。

“重置”按钮,就是当点击这个按钮时,自动把两个输入框中的内容自动清除;这个实现也很简单,只要把Text中的内容设为空字符就OK啦!

好!功能基本上都实现啦,最后一步,很多人一不小心就会忘记,我们还没有在主程序入口中调用获取组件的方法。再完成下面页面跳转的操作就大功告成了。

 

 

四、页面跳转

这个操作相对来说复杂一点点,不过也很简单三个步骤可以迅速完成。

1、  再新建一个java程序

新建一个新类也就是新页面,例如:“Page_One.java”,新建完以后把这个类继承Activity这个类,因为Android开发,Activity是所有类和接口的父类,就相当于java里面的Obejcet一样。这里就不多说了,在类中仍然在创建主程序入口:

 

 

 

2、再新建一个布局管理器

这里的setContentView设置的布局管理器就不再是R.layout.Main了,而是需要我们重新创建新一个布局管理器。名称可以自拟,我这里命名为“page_one”,在这里我们暂时只将这个页面设置一下背景,至于跳转后的页面需要做什么,那么可以往后再继续。新建布局可以复制一份Main.xml把名字改变一下就可以了,然后把里面的组件可以去掉,只设置一下背景就OK啦!如下代码:

 

关键代码:android:background="@drawable/hehe’

hehe是一个图片文件名,drawable是默认的目录,保存后OK

如果这个时候你去测试,当你输入帐户和密码后你会发生,程序跳出警告信息,自动终止程序。出现这个情况就对了,这里确实还有一步没有完成。

3、注册登记这个页面

刚才我们提到四个文件,现在我们只剩下一个文件没有接触了,这个文件就是AndroidManifest.xml,在这里我们需要把Page_One.java这个新页面登记到这个文件中。



 

从上图中可以看到,这整个工程的一些基本配置信息,但此时我们不用去在意,我们只需要在<application>标签之间添加一个<activity android:name=".Page_One" />就行了,这样我们就全部完成了。

好啦!测试一下吧!

 



 

登陆之前

 



 

登陆之后

猜你喜欢

转载自sean2012.iteye.com/blog/1633292