Android studio实现app登录界面
时间：2023-01-01 12:42:40|栏目：Android代码|点击： 次
本文实例为大家分享了Android studio设计app登录界面，供大家参考，具体内容如下
UI界面设计
在设计登录界面时，可以使用不同布局方式来实现该功能，通常情况下使用的是LinearLayout(线性布局)和TableLayout(表格布局)，在本文中使用线性布局。登陆界面需要几项必不可少的控件，如下所示：
1、TextView：用于显示标题和“用户名"和"密码"的提示;
标题设置
<TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="登录页面" android:textSize="30dp" android:textColor="@android:color/black" android:layout_gravity="center_horizontal"/>
"用户名"提示
<TextView android:layout_width="65dp" android:layout_height="wrap_content" android:text="用户名：" android:textSize="16dp" android:textColor="@android:color/black"/>
"密码"提示:
<TextView android:layout_width="65dp" android:layout_height="wrap_content" android:text="密码：" android:textSize="16dp" android:textColor="@android:color/black"/>
2、EditView:用于输入"用户名"和"密码"；
"用户名"输入框：
<EditText android:layout_width="264dp" android:layout_height="wrap_content" android:id="@+id/ed1" android:hint="请输入用户名" android:textColor="@android:color/black"/>
"密码"输入框：
<EditText android:layout_width="264dp" android:layout_height="wrap_content" android:id="@+id/ed2" android:hint="请输入密码" android:textColor="@android:color/black"/>
3、Button:用于控制登录。
Button登录按钮:
<Button android:layout_width="285dp" android:layout_height="wrap_content" android:text="登录" android:textSize="20dp" android:id="@+id/bt" android:layout_gravity="center_horizontal" />/>
本文使用三层LinearLayout互相嵌套，第一层LinearLayout中包括标题(TextView)和第二层LinearLayout以及登录按钮(Button)。第一层LinearLayout使用垂直分布，即android:orientation=“vertical”。
第二层LinearLayout中嵌套两个第三层LinearLayout，且第二层LinearLayout为垂直分布，即android:orientation=“vertical”。
第三层的两个LinearLayout中各包含一个TextView和一个EditView，第三层LinearLayout为水平分布，即android:orientation=“horizontal”。
总的UI设计如下所示。
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:id="@+id/activity_main" android:layout_width="match_parent" android:layout_height="match_parent" android:paddingBottom="@dimen/activity_vertical_margin" android:paddingLeft="@dimen/activity_horizontal_margin" android:paddingRight="@dimen/activity_horizontal_margin" android:paddingTop="@dimen/activity_vertical_margin" tools:context="com.example.activities.MainActivity" android:orientation="vertical" android:weightSum="1"> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="登录页面" android:textSize="30dp" android:textColor="@android:color/black" android:layout_gravity="center_horizontal"/> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="vertical" android:gravity="center" android:layout_weight="0.55"> <LinearLayout android:layout_width="300dp" android:layout_height="wrap_content" android:orientation="horizontal"> <TextView android:layout_width="65dp" android:layout_height="wrap_content" android:text="用户名：" android:textSize="16dp" android:textColor="@android:color/black"/> <EditText android:layout_width="264dp" android:layout_height="wrap_content" android:id="@+id/ed1" android:hint="请输入用户名" android:textColor="@android:color/black"/> </LinearLayout> <LinearLayout android:layout_width="300dp" android:layout_height="wrap_content" android:orientation="horizontal"> <TextView android:layout_width="65dp" android:layout_height="wrap_content" android:text="密码：" android:textSize="16dp" android:textColor="@android:color/black"/> <EditText android:layout_width="264dp" android:layout_height="wrap_content" android:id="@+id/ed2" android:hint="请输入密码" android:textColor="@android:color/black"/> </LinearLayout> </LinearLayout> <Button android:layout_width="285dp" android:layout_height="wrap_content" android:text="登录" android:textSize="20dp" android:id="@+id/bt" android:layout_gravity="center_horizontal" />/> </LinearLayout>
效果如图所示。
Java代码编写
若用户输入用户名或密码有误时，弹窗提示“用户名或密码输入有误，请更正后重新输入！”。
若用户没有输入用户名或密码，弹窗提示“用户名与密码不能为空！”。
当用户名与密码同时输入正确是，方可进入系统。
package com.example.activities;
import android.content.Intent;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.EditText;
import android.widget.Toast;
public class MainActivity extends AppCompatActivity {
private EditText usertext;
private EditText passtext;
private Button loginbutton;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
usertext=(EditText)this.findViewById(R.id.ed1);
passtext=(EditText)this.findViewById(R.id.ed2);
loginbutton=(Button)this.findViewById(R.id.bt);
loginbutton.setOnClickListener(new ButtonListener());
}
private class ButtonListener implements View.OnClickListener{
@Override
public void onClick(View v){
String user=usertext.getText().toString();
String pass=passtext.getText().toString();
if (user.equals("")||pass.equals("")){
Toast.makeText(MainActivity.this,"用户名与密码不能为空！",Toast.LENGTH_SHORT).show();
}
else if (user.equals("denglu")&&pass.equals("0000")){
Toast.makeText(MainActivity.this,"登陆成功",Toast.LENGTH_SHORT).show();
Intent intent=new Intent(MainActivity.this,TwoActivity.class);
startActivity(intent);
}
else{
Toast.makeText(MainActivity.this,"用户名或密码输入有误，请更正后重新输入！",Toast.LENGTH_SHORT).show();
}
}
}
}
点击登录按钮之后，进入下一个界面，这时需在Manifest中添加第二个Activity的名称
<?xml version="1.0" encoding="utf-8"?> <manifest xmlns:android="http://schemas.android.com/apk/res/android" package="com.example.activities"> <application <activity android:name=".MainActivity"> <intent-filter> <action android:name="android.intent.action.MAIN" /> <category android:name="android.intent.category.LAUNCHER" /> </intent-filter> </activity> <activity android:name=".TwoActivity"></activity> </application> </manifest>
第二个界面的Activity需调用第二个xlm的layout，如下所示
package com.example.myapplication;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
public class TwoActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.twoactivity);
}
}
