目录
一、实现一个登陆页面及操作
1.1 创建一个名为MyUIDesign工程，实现一个登陆界面，登陆后进入一个水果列表界面，具体内容如下。
1.2 首先实现一个app登陆页面的设计，包括的内容有：
（1）采用Empty Activity新建一个名为LoginActivity的活动，而布局文件命名为login_layout.xml。
（2）在AndroiManifest.xml中，将LoginActivity设置为应用启动默认启动的Activity。
（3）在布局文件login_layout.xml，采用LinearLayout布局进行设计，包含TextView、EditText、Button控件，分成三个子LinearLayout布局。
（4）多个TextView宽度相同，这里我设置为70dp。
（5）多个EditText自动拉伸占满屏幕宽度，文字对齐，输入框对齐，能够适配不同的屏幕宽度。
（6）实际效果
1.3 针对第2点内容的布局进行优化，最终实现的效果如下图所示
（1）所有的文字大小均改成24sp。
（2）前两个子LinearLayout的高度设置成80dp，添加gravity属性为bottom，左侧的TextView添加layout_marginLeft属性，右侧的EditText控件添加layout_marginRight属性。
（3）按钮所在的子LinearLayout添加gravity属性为center，两个按钮控件添加layout_margin属性。
（4）实际效果
1.4 admin账户成功登陆功能
（1）在布局文件login_layout中对两个EditText和登陆Button控件给定id属性。
（2）在LoginActivity代码中，实现登陆Button的点击监听。
（3）点击登陆Button，当输入的帐户为“admin”，密码为“123456”时，则判定成功登陆，并跳转到MainActivity。
（4）点击登陆Button，当输入帐户不为“admin”或密码不为“123456”时，则判定登陆失败，此时采用AlertDialog提醒“用户名或者密码输入错误”。
一、实现一个登陆页面及操作
1.1 创建一个名为MyUIDesign工程，实现一个登陆界面，登陆后进入一个水果列表界面，具体内容如下。
图1 创建MyUIDesign工程
1.2 首先实现一个app登陆页面的设计，包括的内容有：
（1）采用Empty Activity新建一个名为LoginActivity的活动，而布局文件命名为login_layout.xml。
图2 LoginActivity中的代码
（2）在AndroiManifest.xml中，将LoginActivity设置为应用启动默认启动的Activity。
添加<intent-filter>标签，写入
<action android:name="android.intent.action.MAIN"/>
<category android:name="android.intent.category.LAUNCHER"/>并且将exported改为true
图3 在AndroidManifest.xml中注册LoginActivity
（3）在布局文件login_layout.xml，采用LinearLayout布局进行设计，包含TextView、EditText、Button控件，分成三个子LinearLayout布局。
① 子LinearLayout布局一：用户名模块
图4 login_layout.xml中的代码
② 子LinearLayout布局二：密码模块
图5 login_layout.xml中的代码
③ 子LinearLayout布局三：登录和注册模块
图6 login_layout.xml中的代码
（4）多个TextView宽度相同，这里我设置为70dp。
① 用户名模块修改：
图7 login_layout.xml中的代码
② 密码模块修改：
图8 login_layout.xml中的代码
（5）多个EditText自动拉伸占满屏幕宽度，文字对齐，输入框对齐，能够适配不同的屏幕宽度。
将layout_width设置为0dp，并设置相同的layout_weight值，我这里都设置为1，这样EditText按layout_weight权值自动适配。
图9 login_layout.xml中的代码
图10 login_layout.xml中的代码
（6）实际效果
图11 页面实际效果截图
1.3 针对第2点内容的布局进行优化，最终实现的效果如下图所示
（1）所有的文字大小均改成24sp。
① 用户名模块（这里把TextView宽度修改为80dp，否则字体变大位置不够宽会换行）
图12 login_layout.xml中的代码
② 密码模块
图13 login_layout.xml中的代码
③ 登录和注册模块
图14 login_layout.xml中的代码
（2）前两个子LinearLayout的高度设置成80dp，添加gravity属性为bottom，左侧的TextView添加layout_marginLeft属性，右侧的EditText控件添加layout_marginRight属性。
① 设置子LinearLayout的高度和gravity属性为bottom
图15 login_layout.xml中的代码
图16 login_layout.xml中的代码
② 设置TextView 和 EditText 的属性
图17 login_layout.xml中的代码
图18 login_layout.xml中的代码
（3）按钮所在的子LinearLayout添加gravity属性为center，两个按钮控件添加layout_margin属性。
① 这里我给按钮的LinearLayout布局添加
android:layout_gravity="center"
图19 login_layout.xml中的代码
② 给按钮控件添加layout_margin属性
图20 login_layout.xml中的代码
（4）实际效果
图21 页面实际效果截图
1.4 admin账户成功登陆功能
（1）在布局文件login_layout中对两个EditText和登陆Button控件给定id属性。
① 用户名：
图22 login_layout.xml中的代码
② 密码
图23 login_layout.xml中的代码
（2）在LoginActivity代码中，实现登陆Button的点击监听。
这里我是用接口方式进行注册：
图24 LoginActivity中的代码
（3）点击登陆Button，当输入的帐户为“admin”，密码为“123456”时，则判定成功登陆，并跳转到MainActivity。
图25 LoginActivity中的代码
运行截图（输入正确用户名和密码）
图26 实际运行截图
提示登录成功！
图27 实际运行截图
（4）点击登陆Button，当输入帐户不为“admin”或密码不为“123456”时，则判定登陆失败，此时采用AlertDialog提醒“用户名或者密码输入错误”。
① 当没有输入用户名时，提示用户名不能为空。
图28 LoginActivity中的代码
运行截图：
图29 实际运行截图
② 当没有输入密码时，提示密码不能为空。
图30 LoginActivity中的代码
运行截图：
图31 实际运行截图
③ 当用户名和密码都输入错误时，弹窗提示用户名或密码错误。
图32 LoginActivity中的代码
运行截图：
图33 实际运行截图
水果列表界面请访问下一篇博客
【移动应用开发】界面设计（二）实现水果列表页面-CSDN博客