Android简单登录界面设计一个登陆界面:允许用户输入用户名,密码;用户点击“Login”之后,如果用户名为admin, 密码为123则显示“登陆成功”;如果用户名密码其中之一不正确,红色字体显示“登陆失败!”首先我们来建立一个新的项目:图标那一步就随便选吧,下一步:这一步与上次有点不同,这次我们不要ADT 帮我们创建任何的Activity,我们只需要一个空的项目。
点击Finish后,我们会发现,项目文件视图下,与上次的不一样,src, res/layout 是空的,这次需要我们自己去添加了。
首先来明确一下我们现在的目标:建立一个包含登录框的界面,并将它显示在我们的手机(模拟器)上。
建立一个界面的主要步骤是什么呢主要有以下几步:在res/layout下创建布局文件;在src下创建Activity子类,并将布局文件与这个Activity联系起来。
在程序配置文件中,添加Activity的声明。
我们先来1. 创建布局文件:在Eclipse项目文件中选中layout 文件夹,在工具栏里点击下面图标在弹出的窗口,填上这个xml布局文件的文件名,Root Element 根节点就选择Linearlayout即可点击下一步,这一步是选择更多配置属性的,暂且不用理会,直接点击Finish。
我们发现,在res/layout 下面多了一个文件,同时Android 的Layout 编辑器也把它打开了。
切换到“source”代码视图,今天我们不用“所见即所得”的傻瓜拖拽方式。
我们看到xml代码是这样的:<xml version="" encoding="utf-8"><LinearLayout xmlns:android=""android:layout_width="match_parent"android:layout_height="match_parent"android:orientation="vertical"></LinearLayout>根节点是LinearLayout,即线性布局,所谓线性布局,有点像J2SE上的流式布局,就是其中的UI元素,会按水平或者垂直方向顺序地铺开。
LinearLayout有个xml属性:android:orientation,它有两个可选值:vertical和horizontal,指明该线性布局中的元素,是以垂直(vertical)还是水平(horizontal)方向排列。
下面是两种方式的示意图:接下来,我们要添加两个文本输入框,让用户输入用户名,密码。
输入框使用的是EditText, 我们在LinearLayout中添加两个EditText<xml version="" encoding="utf-8"><LinearLayout xmlns:android=""android:layout_width="match_parent"android:layout_height="match_parent"android:orientation="vertical"><EditTextandroid:id="@+id/login_username"android:layout_width="300dp"android:layout_height="wrap_content"android:hint="Type name here...."android:text=""></EditText><EditTextandroid:id="@+id/login_password"android:layout_width="300dp"android:layout_height="wrap_content"android:hint="Type password here...."android:inputType="textPassword"android:text=""></EditText></LinearLayout>对比每个节点属性,我们发现,不管是LinearLayout还是EditText,都会至少包含android:layout_widthandroid:layout_height不管是android:layout_width还是android:layout_height 都有四种可选填的值:wrap_contentfill_parentmatch_parent具体数值具体数值可以填像素px,如300px, 也可以填dp. dp(也写作dip)是Android平台上特有的长度计量单位,它是与设备屏幕无关的单位,强烈建议我们在设计界面元素时,都使用dp,而非px!原因这里不多拓展,以后会详细描述。
还有一个重要的属性是:android:id,它是UI元素的唯一标识,格式为@+id/XXXXXXX保存之后,我们会发现,在gen文件夹下面,ADT为我们自动生成了代码:他们都是静态且final 的类或者成员。
它的作用是,为资源建立索引,以便代码中或者layout中方便的引用。
public final class R {public static final class attr {}public static final class drawable {public static final int ic_launcher=0x7f020000;}public static final class id {public static final int login_password=0x7f060001;public static final int login_username=0x7f060000;}public static final class layout {public static final int login=0x7f030000;}public static final class string {public static final int app_name=0x7f040000;}public static final class style {public static final int AppTheme=0x7f050000;}}接下来我们再添加一个用于提交的按钮,以及用于显示结果的文本:<Buttonandroid:id="@+id/login_submit"android:layout_width="wrap_content"android:layout_height="wrap_content"android:text="登录"/><TextViewandroid:id="@+id/login_result"android:layout_width="match_parent"android:layout_height="wrap_content"android:hint="用于显示登录的结果"/>android:hint是用于提示文本,当android:text有值时,会被替换。
切换回“所见即所得”的图形编辑视图预览一下:布局文件创建完成,我们进行第二步:2. 编写代码在src右键New->Class->需要注意的是,该LoginActivity类必须继承自Activity类public class LoginActivity extends Activity {/*** 必须重载父类的onCreate*/@Overrideprotected void onCreate(Bundle savedInstanceState) {(savedInstanceState);将布局文件与代码关联起来oString();String password = ().toString();if("admin".equals(userName) && "123".equals(password)){("恭喜您,登录成功!");}else{("登录失败,用户名或密码不正确!");}}});}}注意以下几点:必须重载onCreate()方法,而且必须首先调用一次父类的方法(savedInstanceState);setContentView()方法用于关联布局文件,应该在onCreate中先调用,后面才能获取到UI元素的对象。
因为要供OnClickListener匿名内部类调用,所以局部变量要声明为final.()方法返回的是Editable对象,而不是String,需要调用toString();3. 声明activity所有的Activity定义好了之后,只有在中声明过,才会有效。
在application节点中添加:<activity android:name="LoginActivity"><intent-filter><action android:name=""/><category android:name=""/></intent-filter></activity>android:name对应的是代码中Activity的类名,因为前面有程序默认包声明“package=""”,所以可以省略包名直接写类名,或者写错.类名。
如果Activity类所在的包不是默认包,则需要添加包名作为前缀。
所以这个例子中LoginActivity或者.LoginActivity都是正确的。
保存,编译完成之后,我们就可以开始运行代码了。