HarmonyOS——编写简单的登录页面并实现跳转
登陆页面跳转案例
实现登陆页面
首先简单实现一个登录页面,在xml文件下编写布局如下所示
界面如图所示
实现点击弹窗
new ToastDialog(LoginAbilitySlice.this).setText("点击了登录按钮").setDuration(2000).show();
点击登录按钮后如图所示
实现页面跳转功能
实现页面跳转的无参数传递
首先要明白页面之间交互的概念。交互的概念通俗来说就是有去有回,在函数中的体现是参数和返回值,那么在页面之间的交互就是页面1向页面2传递参数,然后在页面2中将参数接收。
intent可以起到纽带的作用,用于收放参数,参数以键值对的形式进行传递
在登录页面设置要传递的参数,以传递参数username为例
intent.setParam("username","user");//设置参数键值对present(new MainAbilitySlice(),intent);//将参数发送到MainAbilitySlice页面下
在主页面接收登录页面传递过来的参数,并以文本的形式显示
text = (Text) findComponentById(ResourceTable.Id_text);//获取文本组件String username = intent.getStringParam("username");//根据键username获取对应参数的值text.setText(username);//设置文本的值
测试,在登录页点击登录后跳转到主页面,如图所示
当需要进行多个页面的跳转的时候,就需要用presentForResult()方法进行参数的传递
其中requestCode的作用:当接受多个页面的返回值时用于区分接收到的返回值来自哪个页面
public static final int REQUEST_CODE_MAINABILITY = 1;//给主页面设置requestCode = 1presentForResult(new MainAbilitySlice(),intent,REQUEST_CODE_MAINABILITY);
给主页面设置点击事件,当点击文本时返回到登录页面
text.setText(username);text.setClickedListener(new Component.ClickedListener() { @Override public void onClick(Component component) { setResult(intent.setParam("result","我是Main页面返回值")); terminate();//用于结束页面 }});
对setResult()方法的分析
可以看到,参数resultData是当页面被关闭时的返回数据。也可以主动调用terminate()方法直接关闭页面,此时resultData就会直接返回到调用者。
在登录页面接收回调,将返回值用弹窗的形式表现
@Overrideprotected void onResult(int requestCode, Intent resultIntent) { super.onResult(requestCode, resultIntent); if (requestCode == REQUEST_CODE_MAINABILITY) { new ToastDialog(this).setText(resultIntent.getStringParam("result")).setDuration(2000).show(); }}
进行测试,结果如下
如果不使用纯Java开发,而是用Java + js混合开发时,js没有slice的概念,因此只能用ability之间的跳转
intent.setOperation(new Intent.OperationBuilder().withAbilityName(MainAbility2.class).withBundleName("com.example.class1").build());startAbility(intent);
其中bundleName的值可以在模块的config.json中找到
进行测试,点击登录后可以跳转到对应页面
尝试编写一个简单的登陆交互,当用户名和密码都为123456时登陆成功
在登陆页面编写如下
package com.example.logindemoforjava.slice;import com.example.logindemoforjava.MainAbility2;import com.example.logindemoforjava.ResourceTable;import ohos.aafwk.ability.AbilitySlice;import ohos.aafwk.content.Intent;import ohos.agp.components.Button;import ohos.agp.components.Component;import ohos.agp.components.TextField;import ohos.agp.window.dialog.ToastDialog;import ohos.hiviewdfx.HiLog;import ohos.hiviewdfx.HiLogLabel;public class LoginAbilitySlice extends AbilitySlice { private static final HiLogLabel LABEL_LOG = new HiLogLabel(0,0,"MainAbility.class"); private Button btnlogin; public static final int REQUEST_CODE_MAINABILITY = 1; private TextField username; private TextField password; @Override public void onStart(Intent intent) { super.onStart(intent); super.setUIContent(ResourceTable.Layout_ability_login); btnlogin = (Button) findComponentById(ResourceTable.Id_btnLogin); username = (TextField) findComponentById(ResourceTable.Id_username); password = (TextField) findComponentById(ResourceTable.Id_password); btnlogin.setClickedListener(new Component.ClickedListener() { @Override public void onClick(Component component) { HiLog.info(LABEL_LOG, "click"); if (username.getText().equals("123456") && password.getText().equals("123456")) { intent.setParam("tips","登陆成功"); present(new MainAbilitySlice(), intent); } else { new ToastDialog(LoginAbilitySlice.this).setText("登陆失败").setDuration(2000).show(); } } }); } @Override public void onActive() { super.onActive(); } @Override public void onForeground(Intent intent) { super.onForeground(intent); }}
进行测试如下,当用户名密码都输入123456时登录成功
当用户名为1234567时登陆失败