Android Studio实现简单的QQ登录界面

一、项目概述
QQ是我们日常生活使用最多的软件之一,包含登录界面和进入后的聊天界面、好友列表界面和空间动态界面等。登录界面的制作比较简单,主要考验布局的使用,是实现QQ项目的第一步。现在APP开发的首要工作都是实现登录页面,所以学会了QQ登录界面对以后的软件开发有着很重要的作用。

二、开发环境

三、详细设计
1、头像设计
首先在layout文件里面选择了RelativeLayout(相对布局)作为整个页面的布局。

在顶端放置了一个ImageView控件,宽度和高度设置的都是70dp,水平居中设置为true。

然后使头像在整个页面下调一点,不要紧贴着顶端,所以layout_marginTop设置为40dp。

最后选择drawable文件夹中的head文件作为头像。代码如下:

2、账号输入框
利用LinearLayout(线性布局)作为账号输入框的外层布局,orientation设置的为水平排列。

放置了一个TextView控件,宽度和高度设置的wrap_content,即适应内容大小,显示文本“账号”。

紧接着放置一个EditText控件,用于输入账号内容,使用layout_toRightOf属性定位于账号的右侧。

3、密码输入框
最外层依旧是LinearLayout(线性布局),整体放置在上一个LinearLayout的下面,控件排列依然为horizontal(水平)。

放置一个TextView文本显示框,文本内容是“密码”,文本颜色为黑色,文本大小为20sp。

再放置一个EditText文本输入框,inputType设置为textPassword,输入时候会隐藏输入内容,使用*** 代替。

4、登录按钮
在账号密码框下方放置一个Button控件,文本内容为“登录”,文本颜色为蓝色。

5、按钮点击事件
在MainActivity里面先声明了btn这个变量,并与刚刚设置的登录按钮进行绑定。

然后使用了setOnClickListener按钮点击事件监听器,在监听器里面声明了onClick方法,在里面声明了dialog变量,即显示对话框。

setTitle( )设置了对话框的标题为“账号或密码不能为空”,setIcon( )设置了对话框标题图标,setMessage( )设置对话框的提示信息为”请输入账号和密码” 。

最后添加了”确定”按钮和“取消”按钮,点击按钮都会调用dialog.dismiss()方法关闭对话框。

四、项目效果
1、用模拟器运行。

2、输入账号不输入密码,点击登录按钮会显示提醒对话框。

3、输入账号和密码。

五、项目总结
本次项目属于比较基础的内容,希望初学者通过这次项目熟练掌握界面布局和控件的使用,为以后的项目开发打下坚实的基础。本次项目文件的百度网盘链接如下:百度网盘链接 提取码:x3mp

抛弃时间的人,时间也抛弃他。————莎士比亚

发表评论

文章信息
字数 335
价格 免费
购买人数 0
作者信息
吾生也有涯,而知也无涯。——庄子