Android studio 初级登录界面
Android studio 初级登录界面文章目录Android studio 初级登录界面主页面的展示编写展示账号密码正确的账号密码才能登录成功掌握Android中的线性布局。掌握Android TextView、Button、EditText、CheckBox控件。主页面的展示编写编写一个初级登录的界面需要几个基本的元素:(1)用户名:+用户名填写框(2)密码:+密码填写框(3)记住账号密码(
Android studio 初级登录界面
掌握Android中的线性布局。
掌握Android TextView、Button、EditText、CheckBox控件。
主页面的展示编写
编写一个初级登录的界面需要几个基本的元素:
- 用户名:+用户名填写框
- 密码:+密码填写框
- 记住账号密码
- 登录按钮
我们需要用到的控件:
(1)TextView:+EditText
(3)CheckBox
(2)Button
除了这些必要的控件外,我们还需要处理界面的布局设置,
要完成初级的登录界面,我们还需要采用线性布局——LinearLayout
这是我们学习的关键
我们需要在头文件添加设置:
android:orientation="vertical" //垂直排列
android:orientation="horizontal" //水平排列
这两条设置相互搭配才能得到我们需要的效果,在整体页面上我们选择垂直排列
<LinearLayout 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"
tools:context=".MainActivity"
android:orientation="vertical">
//在这其中设置布局
</LinearLayout>
在控件整体上,我们选择水平分布,达到
(1)用户名:+用户名填写框
(2)密码:+密码填写框
的效果
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
//在这其中添加控件
</LinearLayout>
账号密码的文字表达和填写框我们需要用到
TextView:+EditText
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="用户名:"
android:layout_marginTop="30dp" //距离顶部
android:textSize="25sp" //字体大小
android:textColor="#000000" //字体颜色
android:layout_weight="1"/> //占1/3空间
<EditText
android:id="@+id/edit_userName"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:hint="请输入用户名"
android:layout_marginTop="30dp"
android:textSize="25sp"
android:textColor="#2196F3"
android:layout_weight="2"/> //占2/3空间
效果展示:
密码行也类似操作:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="密码:"
android:textSize="25sp"
android:layout_marginTop="30dp"
android:textColor="#000000"
android:layout_weight="1"/>
<EditText
android:id="@+id/edit_password"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="30dp"
android:hint="请输入密码"
android:textSize="25sp"
android:textColor="#2196F3"
android:layout_weight="2"
android:inputType="textWebPassword"/> //隐藏密码*****
</LinearLayout>
完整效果:
现在我们还缺记住账号密码的选项和登录按钮
记住账号密码我们需要用到CheckBox空间,这个控件的作用是单选
登录采用的就是最常用的Button (按钮)
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<CheckBox
android:id="@+id/remember"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:text="记住账号密码" />
</LinearLayout>
<Button
android:id="@+id/login"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="登录"
android:textAllCaps="false"
android:textColor="#EE4000"
android:layout_marginLeft="30dp"
android:layout_marginRight="30dp"
android:layout_marginTop="30dp"
android:textSize="25sp" />
现在我们就完成了初级登录界面的布局:
展示账号密码
完成了界面是不够的,我们还要完成他的功能性,登录界面的功能是登录,
当然简单的使用跳转是可以完成登录的初步实现,但我们想要知道我们的账号密码信息是不是一致的,我们就要增加一个功能
在跳转页面展示我们的账号密码
我们要在MainActivity中对我们前面的空间进行定义和调用
buttonLogin.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
final EditText editTextUerName=findViewById(R.id.edit_userName);
final EditText editTextPassword=findViewById(R.id.edit_password);
String userName = editTextUerName.getText().toString();
String password = editTextPassword.getText().toString();
{
Intent intent = new Intent(MainActivity.this, ServerActivit.class);
intent.putExtra("userName", userName);
intent.putExtra("password", password);
startActivity(intent);
}}});}
除此之外我们还要新建一个Activity来承载信息
TextView textView =findViewById(R.id.textData);
Intent intent =getIntent();
String userName =intent.getStringExtra("userName");
String password =intent.getStringExtra("password");
textView.setText("登录数据:"+"用户名:"+userName+"密码:"+password); //文字输出用户名和密码
看看初步效果:
尝试一下无账号密码跳转:
到目前位置我们已经完成了登录见面的布局,任何账号密码均可登录跳转
正确的账号密码才能登录成功
这一步我们需要完成几个工作:
(1)无账号密码不跳转,并提示:账号密码不能为空
(2)账号密码错误不跳转,并提示:账号密码错误
(3)正确的账号密码跳转,并在输出端展示账号密码
要完成这三个工作我们需要用到一条逻辑语句:
if(){}
else if(){}
else{}
我们要如何检测我们的账号密码是否为空能?
这条语句是关键:
TextUtils.isEmpty(editTextUerName.getText().toString()) || TextUtils.isEmpty(editTextPassword.getText().toString()) //TextUtils.isEmpty检测是否为空, || 采用或逻辑,全真为真
那我们要怎样确定我们需要的账号密码了?
目前仅采用一个账号密码,后期我们学习了SQL数据库后,可采用导用数据库数据验证。
boolean name = userName.equals("CSDN"); //设置规定的账号
boolean pass = password.equals("12345678"); //设置规定的密码
//boolean 布尔型,在此处使用为读写数据
账号密码错误,只需要通过逻辑语句输出即可
else{
Toast.makeText(MainActivity.this, "用户名或者密码错误", Toast.LENGTH_SHORT).show();
}
通过调整,我们完成了我们需要的功能,完整代码如下
Button buttonLogin=(Button) findViewById(R.id.login);
buttonLogin.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
final EditText editTextUerName=findViewById(R.id.edit_userName);
final EditText editTextPassword=findViewById(R.id.edit_password);
String userName = editTextUerName.getText().toString();
boolean name = userName.equals("CSDN");
String password = editTextPassword.getText().toString();
boolean pass = password.equals("12345678");
if (TextUtils.isEmpty(editTextUerName.getText().toString()) || TextUtils.isEmpty(editTextPassword.getText().toString())) {
Toast.makeText(MainActivity.this, "用户名或者密码不能为空", Toast.LENGTH_SHORT).show();
} else if (name&&pass) {
Intent intent = new Intent(MainActivity.this, ServerActivit.class);
intent.putExtra("userName", userName);
intent.putExtra("password", password);
startActivity(intent);
}
else{
Toast.makeText(MainActivity.this, "用户名或者密码错误", Toast.LENGTH_SHORT).show();
}}});}
到现在为止,我们所需要的界面、功能大部分都完成了,认真看到此处的同学,
应该会有一个疑问:那你的记住账号密码按钮有什么用呢?
对的,到目前为止,我们并没有用到这个单选按钮,他的逻辑作用,我们留到下次再讲,再会
大家关注一下秃头大学生好不好
开放原子开发者工作坊旨在鼓励更多人参与开源活动,与志同道合的开发者们相互交流开发经验、分享开发心得、获取前沿技术趋势。工作坊有多种形式的开发者活动,如meetup、训练营等,主打技术交流,干货满满,真诚地邀请各位开发者共同参与!
更多推荐
所有评论(0)