本文的目标是支持线下Android开发课程的学员完成课堂练习,或是在课后回顾课程内容时复盘整个练习。所以在本文中不会讲解Android的运行原理,这些可以参考本站的其它文章。
新建项目
在 Android Studio 的启动窗口中选择”Start a new Android Studio project” 或是从 File 菜单中选择 New -> New Project 来新建一个项目。在随后的新建项目向导中依次选择:
- Choose your project - 选择 Empty Activity
- 在 Name 中填入项目名称:TodoApp, Package name 填入: cn.com.hohistar.tutorial.todoapp, 语言选择使用 Java。 其它不选项不改变
然后选择 Finish , Android Studio 会更加以上信息构建一个基本的项目。
等构建完成后(第一次建项目花的时间比较长,中间可能还会不断的从网络下载相关的依赖包),点击右上角,绿色的运行按钮运行程序。
如果环境配置没问题,运行的结果是在模拟器或是真机上显示一个白底的界面,中间有一段文字: “Hello World”。
构建登录界面 Layout
选择并打开 res/layout/activity_main.xml 文件,这是 Android Studio 帮助我们构建的 Activity 所使用的界面描述文件。
删除屏幕中的”Hello World”, 那实际上是一个 TextView 控件。
在屏幕中添加依次添加:
- 一个 EditText (Plain Text), 并将其id定义为: txtUserId
- 一个 EditText (Password), id 定义为: txtPwd
- 一个 Button, id 定义为: btnLogin
然后简单的设置布局约束,让三个控件从上到下依次、据中排列。
最后的xml文件如下:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45
| <?xml version="1.0" encoding="utf-8"?> <androidx.constraintlayout.widget.ConstraintLayout 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">
<EditText android:id="@+id/txtUserId" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginStart="198dp" android:layout_marginLeft="198dp" android:layout_marginTop="120dp" android:layout_marginEnd="198dp" android:layout_marginRight="198dp" android:ems="10" android:inputType="textPersonName" android:text="Name" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toTopOf="parent" />
<EditText android:id="@+id/txtPwd" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginTop="18dp" android:ems="10" android:inputType="textPassword" app:layout_constraintEnd_toEndOf="@+id/txtUserId" app:layout_constraintStart_toStartOf="@+id/txtUserId" app:layout_constraintTop_toBottomOf="@+id/txtUserId" />
<Button android:id="@+id/btnLogin" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginTop="20dp" android:text="@string/loginPage_btn_login" app:layout_constraintEnd_toEndOf="@+id/txtPwd" app:layout_constraintStart_toStartOf="@+id/txtPwd" app:layout_constraintTop_toBottomOf="@+id/txtPwd" /> </androidx.constraintlayout.widget.ConstraintLayout>
|
实现简单的登录处理
打开 java 目录中的 MainActivity.java 文件,该文件在 cn.com.hohistar.tutorial.todoapp 包中。
- 定义字段绑定,以编译在运行时获取用户在输入框中输入的值:
1 2 3 4 5 6 7 8 9
| private EditText txtUserId;
private EditText txtPwd;
txtUserId = (EditText)findViewById(R.id.txtUserId);
txtPwd = (EditText)findViewById(R.id.txtPwd);
|
- 在 MainActivity 中声明一个 Button 属性,并为其绑定单击事件:
1 2 3 4 5 6 7
| private Button btnLogin;
btnLogin = (Button)findViewById(R.id.btnLogin); btnLogin.setOnClickListener(v -> { });
|
- 在按钮事件中实现一个实验性的登录逻辑
1 2 3 4 5 6 7 8 9 10 11 12 13
| btnLogin.setOnClickListener(v -> {
String userId = txtUserId.getText().toString(); String pwd = txtPwd.getText().toString();
if ("tom".equals(userId) && "123".equals(pwd)) { Toast toast = Toast.makeText(getApplicationContext(), "登录成功", Toast.LENGTH_LONG); toast.show(); } else { Toast toast = Toast.makeText(getApplicationContext(), "登录失败", Toast.LENGTH_LONG); toast.show(); } });
|
在现阶段的逻辑实现中,我们先 hard code 用户名和密码。然后根据用户的输入情况显示不同的 Toast。
修改完以后,再次运行,就可以看到app运行的结果了。
完整的 MainActivity.java 文件供参考
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39
| public class MainActivity extends AppCompatActivity {
private static final String TAG = MainActivity.class.getSimpleName();
private EditText txtUserId;
private EditText txtPwd;
private Button btnLogin;
@Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main);
txtUserId = (EditText)findViewById(R.id.txtUserId);
txtPwd = (EditText)findViewById(R.id.txtPwd);
btnLogin = (Button)findViewById(R.id.btnLogin);
btnLogin.setOnClickListener(v -> { Log.d(TAG, "Login clicked. userId = " + txtUserId.getText().toString());
String userId = txtUserId.getText().toString(); String pwd = txtPwd.getText().toString();
if ("tom".equals(userId) && "123".equals(pwd)) { Toast toast = Toast.makeText(getApplicationContext(), "登录成功", Toast.LENGTH_LONG); toast.show(); } else { Toast toast = Toast.makeText(getApplicationContext(), "登录失败", Toast.LENGTH_LONG); toast.show(); }
}); }
}
|
下一步
下一步将为应用构建一个新的界面 Activity 并处理更多的用户输入项。