东莞路桥统缴_浅析企业网络营销推广方法_搜索引擎营销的优势_太原seo

24.11.03

1.输入手机号跳转功能

第一个要设计的功能是，输入手机号以后跳转到另一个页面，输入获取得到的验证码页面。先拿这个功能练练手。

首先看一下此时的完整项目结构：

主要是添加了2个活动类和对应的界面，下面看详细的代码部分。

处理注册的逻辑代码RegisterActivity

package com.example.personalexpensetracker.ui.activity;import android.content.Intent;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.CheckBox;
import android.widget.EditText;
import android.widget.Toast;
import androidx.appcompat.app.AppCompatActivity;
import com.example.personalexpensetracker.R;public class RegisterActivity extends AppCompatActivity {// 声明用于存储界面组件的变量，分别对应手机号输入框、协议复选框和注册按钮。private EditText phoneEditText;private CheckBox agreeCheckBox;private Button registerButton;@Overrideprotected void onCreate(Bundle savedInstanceState) {// 活动创建时调用，调用父类的 onCreate 方法并设置布局super.onCreate(savedInstanceState);setContentView(R.layout.activity_register);// 使用 findViewById 方法获取布局中的组件实例。phoneEditText = findViewById(R.id.phoneEditText);agreeCheckBox = findViewById(R.id.agreeCheckBox);registerButton = findViewById(R.id.registerButton);// 为注册按钮设置点击事件监听器registerButton.setOnClickListener(new View.OnClickListener() {@Overridepublic void onClick(View v) {String phone = phoneEditText.getText().toString();if (agreeCheckBox.isChecked()) {Intent intent = new Intent(RegisterActivity.this, PasswordInputActivity.class);intent.putExtra("phone", phone);  // 传递手机号到下一个activitystartActivity(intent);}else {Toast.makeText(RegisterActivity.this, "请勾选协议", Toast.LENGTH_SHORT).show();}}});}}

处理密码输入和提交的PasswordInputActivity

package com.example.personalexpensetracker.ui.activity;import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.EditText;
import android.widget.Toast;
import androidx.appcompat.app.AppCompatActivity;
import com.example.personalexpensetracker.R;public class PasswordInputActivity extends AppCompatActivity {// 成员变量声明，2次输入的密码和提交按钮private EditText passwordEditText1;private EditText passwordEditText2;private Button submitButton;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_password_input);// 获取3个组件实例，通过layout的xml文件中组件的idpasswordEditText1 = findViewById(R.id.passwordEditText1);passwordEditText2 = findViewById(R.id.passwordEditText2);submitButton = findViewById(R.id.submitButton);// 为提交按钮设置事件监听器submitButton.setOnClickListener(new View.OnClickListener() {@Overridepublic void onClick(View v) {String password1 = passwordEditText1.getText().toString();String password2 = passwordEditText2.getText().toString();if (password1.equals(password2)) {// 处理注册逻辑，例如保存用户信息Toast.makeText(PasswordInputActivity.this, "注册成功", Toast.LENGTH_SHORT).show();finish(); // 关闭当前活动} else {Toast.makeText(PasswordInputActivity.this, "两次输入的密码不一致", Toast.LENGTH_SHORT).show();}}});}
}

注册活动类到AndroidManifest.xml中

这个主要是添加下面2行代码即可

<activity android:name=".ui.activity.RegisterActivity"/>
<activity android:name=".ui.activity.PasswordInputActivity"/>

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"xmlns:tools="http://schemas.android.com/tools"><applicationandroid:allowBackup="true"android:dataExtractionRules="@xml/data_extraction_rules"android:fullBackupContent="@xml/backup_rules"android:icon="@mipmap/ic_launcher"android:label="@string/app_name"android:roundIcon="@mipmap/ic_launcher_round"android:supportsRtl="true"android:theme="@style/Theme.AppCompat.Light"tools:targetApi="31"><activityandroid:name=".ui.activity.MainActivity"android:exported="true"android:label="@string/app_name"android:theme="@style/Theme.PersonalExpenseTracker"><intent-filter><action android:name="android.intent.action.MAIN"/><category android:name="android.intent.category.LAUNCHER"/></intent-filter></activity><activity android:name=".ui.activity.RegisterActivity"/><activity android:name=".ui.activity.PasswordInputActivity"/></application></manifest>

注册界面与密码输入界面

查看下这2个界面的预览：

接下来看看效果：

注册功能测试

到现在基本的开发流程就掌握了，接下来需要重新修改文件内容，对照市面上的app进行登录注册功能的开发。

2.完整注册功能开发

首先捋一遍思路：

启动页面（Landing Page）：
- 显示应用Logo
- 勾选用户协议和隐私协议的复选框
- 选择登录方式的按钮
- 当按钮被点击时弹出选项（微信登录和手机号登录）
微信登录确认弹窗：
- 弹出对话框，确认是否进行微信登录。
手机号登录页面：
- 输入手机号和密码的输入框
- 勾选用户协议和隐私协议的复选框
- 登录按钮
- 找回密码和注册账号的链接
- 其他方式登录的按钮（引导到微信登录）

这里涉及到几个页面，我们把上面的登录注册等页面忘记，重新开始设计。第一个是启动页面，这个是新用户第一次下载和退出登录以后打开看到的页面。提供2种登录方式，包括微信登录页面和手机号登录页面。这里就是2个页面。然后手机号登录页面还提供找回密码和手机号注册页面。手机号注册点击以后进入的是输入验证码页面，之后是设置密码页面。总结以下我们接下来需要设计的页面一共有7个页面：

1.启动页面

2.微信登录页面

3.手机号登录页面

4.找回密码页面

5.输入手机号页面

6.输入验证码页面

7.设置密码页面

接下来我们就围绕着7个页面和相互的逻辑代码进行开发。在这之前先讲一下如何调整app的图标，相信很多人对这个感兴趣。

app图标设计

首先手残党没有设计经验的，推荐在canva上设计，用一些ai设计的找到灵感后，在它上面对照实现：

设计完点击分享就可以下载成png图片。然后如何导入到我们的项目中呢？之前文章说过res下很多文件都是图标在不同设备上的，所以有一个官网可以帮我们把图标转变成不同设备上的图片，地址如下：https://icon.kitchen/i/H4sIAAAAAAAAA6tWKkvMKU0tVrKqVkpJLMoOyUjNTVWyKikqTa3VUcrNTynNAUlGKyXmpRTlZ6Yo6Shl5hcDyfLUJKXYWgA19PHYPwAAAA%3D%3Dhttps://icon.kitchen/i/H4sIAAAAAAAAA6tWKkvMKU0tVrKqVkpJLMoOyUjNTVWyKikqTa3VUcrNTynNAUlGKyXmpRTlZ6Yo6Shl5hcDyfLUJKXYWgA19PHYPwAAAA%3D%3D只需要上传之前保存的png设计图片，就可以得到一个压缩包，里面就是我们需要的文件夹。

然后我们把文件夹替换一下即可，下面看看效果图：

篇幅所限，下篇文章见