【Android Studio】简单的QQ登录界面
文章目录
- 1、头像设计
- 2、账号输入框
- 4、复选框
- 5、登录按钮
- 6、设置点击事件
- 7、总体效果:
- 源码:
- github源码地址:
注:实验环境 Android studio 2021.2.1
1、头像设计
- 首先在layout文件里面选择了RelativeLayout(相对布局)作为整个页面的布局。用下面的属性设置布局中子元素的排列方式为垂直排列;
android:orientation="vertical"
- 在顶端放置了一个ImageView控件,id设为“iv”,宽度和高度设置的都是70dp。设置为水平居中;
android:layout_centerHorizontal="true"
- 然后使头像在整个页面下调一点,不要紧贴着顶端,所以layout_marginTop设置为40dp。
最后选择drawable文件夹中的head文件作为头像。
2、账号输入框
- 利用LinearLayout(线性布局)作为账号输入框的外层布局,orientation设置的为水平排列。
- 放置了一个TextView控件,宽度和高度设置的wrap_content,即适应内容大小,显示文本“账号”。紧接着放置一个EditText控件,用于输入账号内容,使用layout_toRightOf属性定位于账号的右侧。
- 使用android:layout_marginLeft="5dp"和android:padding="10dp"进行微调,margin是外边距,padding是内边距。
3、密码输入框 - 最外层依旧是LinearLayout(线性布局),整体放置在上一个LinearLayout的下面,控件排列依然为horizontal(水平)。
- 放置一个TextView文本显示框,文本内容是“密码”,文本颜色为黑色,文本大小为20sp。
android:background="@null"去除了输入框的背景横线。 - 再放置一个EditText文本输入框,
inputType设置为textPassword
,输入时候会隐藏输入内容
,使用*** 代替。
4、复选框
- 在文本框和输入框下面,放置两个复选框,用来显示“自动登录”和"记住密码"这两个选项。另外还有TextView文本显示框,内容为找回密码。
5、登录按钮
最下面放置一个Button控件,文本内容为“登录”,文本颜色为蓝色,就是用来登录的。
6、设置点击事件
- 对登录按钮设置了setOnClickListener,即点击事件监听器。
- 在监听器里面重写了onClick方法,首先获取到输入框中的账号和密码
AlertDialog dialog;
声明一个对话框对象。
AlertDialog.Builder builder=new AlertDialog.Builder(MainActivity.this)
初始化该对象。
.setTitle("账号或密码错误")
设置了对话框的标题为。
.setIcon(R.mipmap.ic_launcher)
设置了对话框图标.
.setMessage("请输入正确的账号和密码")
设置了对话框的提示信息。
(由于这里没有设置登录之后的页面,所以这里将做输入的信息都视作账号或密码错误)
7、总体效果:
源码:
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"xmlns:app="http://schemas.android.com/apk/res-auto"xmlns:tools="http://schemas.android.com/tools"android:layout_width="match_parent"android:layout_height="match_parent"android:background="@drawable/bg"android:orientation="vertical"><ImageViewandroid:id='@+id/iv'android:layout_width="70dp"android:layout_height="70dp"android:layout_centerHorizontal="true"android:layout_marginTop="40dp"android:background="@drawable/head" /><LinearLayoutandroid:id="@+id/number_11"android:layout_width="match_parent"android:layout_height="wrap_content"android:layout_below="@id/iv"android:layout_centerVertical="true"android:layout_marginBottom="5dp"android:layout_marginLeft="10dp"android:layout_marginRight="10dp"android:layout_marginTop="15dp"android:background="#ffffff"android:orientation="horizontal"><TextViewandroid:id="@+id/tv_number"android:layout_width="wrap_content"android:layout_height="wrap_content"android:padding="10dp"android:text="账号:"android:textColor="#000"android:textSize="20sp" /><EditTextandroid:id="@+id/et_number"android:layout_width="match_parent"android:layout_height="wrap_content"android:layout_toRightOf="@id/tv_number"android:layout_marginLeft="5dp"android:background="@null"android:inputType="text"android:textCursorDrawable="@drawable/cursor"android:padding="10dp" /></LinearLayout><LinearLayoutandroid:id="@+id/password_11"android:layout_width="match_parent"android:layout_height="wrap_content"android:layout_below="@+id/number_11"android:layout_centerVertical="true"android:layout_marginLeft="10dp"android:layout_marginRight="10dp"android:background="#ffffff"android:orientation="horizontal"><TextViewandroid:id="@+id/tv_password"android:layout_width="wrap_content"android:layout_height="wrap_content"android:padding="10dp"android:text="密码:"android:textColor="#000"android:textSize="20sp" /><EditTextandroid:id="@+id/et_password"android:layout_width="match_parent"android:layout_height="wrap_content"android:layout_marginLeft="5dp"android:layout_toRightOf="@id/tv_password"android:background="@null"android:inputType="textPassword"android:textCursorDrawable="@drawable/cursor"android:padding="10dp"/></LinearLayout><RelativeLayoutandroid:layout_width="match_parent"android:layout_height="wrap_content"android:layout_marginTop="230dp"><CheckBoxandroid:id="@+id/checkBox2"android:layout_width="wrap_content"android:layout_height="wrap_content"android:textColor="@color/colorAccent"android:buttonTint="@color/colorAccent"android:text="自动登录" /><CheckBoxandroid:id="@+id/checkBox3"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_marginLeft="150dp"android:textColor="@color/colorAccent"android:buttonTint="@color/colorAccent"android:text="记住密码" /><TextViewandroid:id="@+id/tv_register"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_alignParentRight="true"android:layout_marginRight="20dp"android:layout_marginTop="5dp"android:text="找回密码"android:textColor="#FFFFFFFF" /><!--layout_weight="1" layout_width="0dp"实现均分效果--></RelativeLayout><Buttonandroid:id="@+id/btn_login"android:layout_width="match_parent"android:layout_height="wrap_content"android:layout_below="@+id/password_11"android:layout_alignParentStart="true"android:layout_alignParentLeft="true"android:layout_marginTop="38dp"android:background="#3C8DC4"android:text="登录"android:textColor="#ffffff"android:textSize="20sp" /><TextViewandroid:id="@+id/textView7"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_marginTop="360dp"android:layout_marginLeft="15dp"android:text="注册账号"android:textColor="#ffffff"/><CheckBoxandroid:id="@+id/checkBox4"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_marginTop="600dp"android:layout_marginLeft="100dp"android:buttonTint="@color/colorAccent"android:text="我已阅读并同意《隐私政策》"android:textColor="@color/colorAccent" />
</RelativeLayout>
MainActivity.java
package zj.dzh.qq;import androidx.appcompat.app.AppCompatActivity;import android.app.AlertDialog;
import android.content.DialogInterface;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;public class MainActivity extends AppCompatActivity {public Button btn;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);btn = (Button) findViewById(R.id.btn_login);//绑定登录按钮btn.setOnClickListener(new View.OnClickListener() {@Overridepublic void onClick(View v) {android.app.AlertDialog dialog;android.app.AlertDialog.Builder builder = new AlertDialog.Builder(MainActivity.this).setTitle("账号或密码错误") //设置对话框的标题.setIcon(R.mipmap.ic_launcher) //设置对话框标题图标.setMessage("请输入正确的账号和密码") //设置对话框的提示信息//添加"确定"按钮.setPositiveButton("确定", new DialogInterface.OnClickListener() {@Overridepublic void onClick(DialogInterface dialog, int which) {dialog.dismiss(); //关闭对话框MainActivity.this.finish(); //关闭MainActivity}})//添加“取消”按钮.setNegativeButton("取消", new DialogInterface.OnClickListener() {@Overridepublic void onClick(DialogInterface dialog, int which) {dialog.dismiss(); //关闭对话框}});dialog = builder.create();dialog.show();}});}
}
github源码地址:
https://github.com/xinyangwy/Android_QQ
(含有build、release文件夹,约60多M)
- 可以下载提取出来的APK直接运行在手机上体验:
- 链接:https://pan.baidu.com/s/1pbor5-NlBn7C2h_zK_O7_Q?pwd=5er0 提取码:5er0
–来自百度网盘超级会员V2的分享
【Android Studio】简单的QQ登录界面相关推荐
- android登录操作代码,Android Studio实现第三方QQ登录操作代码
来看看效果图吧 实现QQ登录了, 新建一个项目工程 ,然后把我们刚才下载的SDK解压将jar文件夹中的jar包拷贝到我们的项目libs中 导入一个下面架包就可以 项目结构如下 打开我们的清单文件And ...
- Android UI布局—— 仿QQ登录界面
最近,有点空闲的时间就拿QQ登录界面来模仿练手,做了个简单的登录界面.界面一般般吧,不算很漂亮,现在拿出来分享,希望大家一起学习与进步.有什么不足之处,请各位大侠多多赐教,谢谢.这个界面涉及到Line ...
- Android-使用Android Studio实现第三方QQ登录
现在的第三方登录很普遍如QQ,微博,微信,今天我们就来实现如何接入QQ登录到我们的项目中 要想使用QQ登录我们需要到腾讯开放平台注册账号获取开发者资格地址:(http://open.qq.com) 注 ...
- 在 Android Studio 中创建一个简单的 QQ 登录界面
一,创建一个新的 Android Studio 项目 打开 Android Studio,选择 "Start a new Android Studio project",然后填写应 ...
- Android 模仿QQ登录界面解决软键盘遮挡问题
Android 软件盘弹出可能会遮挡住界面上的某些控件.当 windowSoftInputMode 为 adjustPan 时,一般不会挡住 EditText,但是假如 EditText 下面是一个登 ...
- 【Android笔记12】使用Android实现QQ登录界面功能
这篇文章,主要利用前面学习的Android相关开发知识,模拟实现QQ登录界面的功能. 目录 一.效果展示 (1)登录界面布局分析 (2)具体实现效果 二.
- Android Studio 简单UI界面
Android Studio 简单UI界面 利用相对布局+线性布局进行设计,且支持国际化 运行效果图如下 实现过程: 1.将准备好的八个图标复制到res/drawable文件夹下 2.创建一个垂直的线 ...
- java qq登录成功界面_java实现简单QQ登录界面
本文实例为大家分享了java实现简单QQ登录界面的具体代码,供大家参考,具体内容如下 java在图形界面,不是太强项,但不是不可以做,它的开源是very nice! 实现代码如下(想实现完美的界面,可 ...
- java实现简单QQ登录界面验证_QQ登录界面实现
正版现货ui设计必修课sketch ue光盘 191.8元 包邮 (需用券) 去购买 > Java实现QQ登录界面 QQ登录界面也是界面的一种,在实现界面时我们需要一些界面开发包,如: pack ...
- Android Studio简单设置
2019独角兽企业重金招聘Python工程师标准>>> Android Studio 简单设置 界面设置 默认的 Android Studio 为灰色界面,可以选择使用炫酷的黑色界面 ...
最新文章
- 【开源推荐】AllJoyn:打造全球物联网的通用开源框架
- Python实现将图片转字符画
- QT的Q3DBars类的使用
- Mac-ios下JDK的安装路径(java)
- python打印99乘法表_Python 实例:九九乘法表
- java 定义xml_java中web.xml定义详解
- 在Ubuntu 13.10 下安装支持SSL的Apache
- RHEL7下Nginx配置文件详解(二)
- github第一次使用--创建hello-world
- [Windwos Phone 8]多个按钮的共用事件
- IOS版添加phonegap--美洽客服插件教程
- 采用邻接表表示法创建无向图
- Win10扬声器未插入怎么解决?
- 以太网通信连接不上自检步骤
- kk_想要学习的知识
- 全差分运放中CMFB方面的学习
- 服务器系统都有哪些?
- 1.OCR--文本检测算法FCENet
- 100多年前人们心中的2018年:部分预测已成现实
- 工具_本地安装chatgpt,openai