项目实训第二周第一篇

---

基于鸿蒙前端的x-class登陆注册界面

---

一、登陆

1.Java代码

LoginAbility.java：

import com.chinasofti.smartclassroomtv.slice.LoginAbilitySlice;
import ohos.aafwk.ability.Ability;
import ohos.aafwk.content.Intent;

public class LoginAbility extends Ability {
    @Override
    public void onStart(Intent intent) {
        super.onStart(intent);
        super.setMainRoute(LoginAbilitySlice.class.getName());
    }
}

LoginAbility.java：

import com.chinasofti.smartclassroomtv.ResourceTable;
import com.chinasofti.smartclassroomtv.data.ShowQuestionProvider;
import com.chinasofti.smartclassroomtv.utils.HttpClient;
import ohos.aafwk.ability.AbilitySlice;
import ohos.aafwk.content.Intent;
import ohos.aafwk.content.Operation;
import ohos.agp.components.Button;
import ohos.agp.components.ScrollView;
import ohos.agp.components.TextField;
import ohos.agp.window.dialog.ToastDialog;
import ohos.event.intentagent.IntentAgent;
import ohos.event.intentagent.IntentAgentConstant;
import ohos.event.intentagent.IntentAgentHelper;
import ohos.event.intentagent.IntentAgentInfo;

import java.util.ArrayList;
import java.util.List;

public class LoginAbilitySlice extends AbilitySlice {
    TextField account_field;
    TextField pwd_field;
    Button btn_login;
    Button btn_register;
    ScrollView sv;

    @Override
    public void onStart(Intent intent) {
        super.onStart(intent);
        super.setUIContent(ResourceTable.Layout_login);//加载UI_布局

        initSliceLayout();
    }

    private void initSliceLayout() {
        account_field = (TextField) findComponentById(ResourceTable.Id_account);
        pwd_field = (TextField) findComponentById(ResourceTable.Id_pwd);
        btn_login = (Button) findComponentById(ResourceTable.Id_btn_login);
        btn_register = (Button) findComponentById(ResourceTable.Id_register);
        sv = (ScrollView) findComponentById(ResourceTable.Id_scrollview);

        account_field.setClickedListener(lis->{
            sv.setHeight(555);
        });

        pwd_field.setClickedListener(lis->{
            sv.setHeight(555);
        });

        //点击后跳转到注册页面
        btn_register.setClickedListener(lis->{
            Operation operation = new Intent.OperationBuilder().
                    withBundleName("com.chinasofti.smartclassroomtv").withAbilityName("com.chinasofti.smartclassroomtv.RegisterAbility").build();
            Intent intent1 = new Intent();
            intent1.setOperation(operation);
            startAbility(intent1);
                });

        btn_login.setClickedListener(lis->{
            new Thread(() -> {
                String account = account_field.getText();
                String pwd = pwd_field.getText();
                String res = HttpClient.doGet(HttpClient.login+
                        "?account=" + account
                        + "&pwd=" + pwd);

                getUITaskDispatcher().asyncDispatch(() -> {//获取UI 主线
                    new ToastDialog(getContext()).setText(res).show();
                });
            }).start();
        });

    }
}

2.xml文件

login.xml：

<DirectionalLayout xmlns:ohos="http://schemas.huawei.com/res/ohos"
                   ohos:id="$+id:root_layout"
                   ohos:width="match_parent"
                   ohos:height="match_parent"
                   ohos:margin="0"
                   ohos:padding="0vp"
                   ohos:background_element="#efefef"
                   ohos:orientation="vertical">



    <DependentLayout
        ohos:width="match_content"
        ohos:height="80vp"
        ohos:margin="0vp"
        ohos:padding="5vp"
        ohos:background_element="black"
        >

        <Button
            ohos:width="100vp"
            ohos:height="match_content"
            ohos:text="退出"
            ohos:padding="5vp"
            ohos:layout_alignment="vertical_center|right"
            ohos:id="$+id:btn_exit"
            ohos:text_size="50"
            ohos:left_margin="20vp"
            ohos:text_color="white"/>

        <Text
            ohos:width="match_parent"
            ohos:height="match_content"
            ohos:align_parent_top="true"
            ohos:text="智慧课堂"
            ohos:padding="5vp"
            ohos:text_alignment="center"
            ohos:text_size="50"
            ohos:id="$+id:title"
            ohos:top_margin="20vp"
            ohos:text_color="white"/>

        <Button
            ohos:width="match_content"
            ohos:height="match_content"
            ohos:align_parent_top="true"
            ohos:text="logo"
            ohos:padding="10vp"
            ohos:text_alignment="center"
            ohos:id="$+id:btn_logo"
            ohos:align_parent_right="true"
            ohos:text_size="50"
            ohos:right_margin="20vp"
            ohos:text_color="white"/>
    DependentLayout>

    <ScrollView
        ohos:id="$+id:scrollview"
        ohos:height="match_content"
        ohos:width="match_content"
        ohos:background_element="#efefef"
        ohos:layout_alignment="horizontal_center">

        <DirectionalLayout
            xmlns:ohos="http://schemas.huawei.com/res/ohos"
            ohos:width="match_content"
            ohos:height="match_content"
            ohos:orientation="vertical">
    <TextField
        ohos:id="$+id:account"
        ohos:height="80vp"
        ohos:width="800vp"
        ohos:background_element="$graphic:capsule_button_element"
        ohos:layout_alignment="horizontal_center"
        ohos:hint="请输入帐号"
        ohos:text_color="black"
        ohos:text_font="HwChinese-medium"
        ohos:text_alignment="vertical_center|left"
        ohos:padding="20vp"
        ohos:top_margin="20vp"
        ohos:text_size="35vp"
        />

    <TextField
        ohos:id="$+id:pwd"
        ohos:height="80vp"
        ohos:width="800vp"
        ohos:background_element="$graphic:capsule_button_element"
        ohos:layout_alignment="horizontal_center"
        ohos:hint="请输入密码"
        ohos:text_color="black"
        ohos:text_font="HwChinese-medium"
        ohos:text_alignment="vertical_center|left"
        ohos:padding="20vp"
        ohos:top_margin="20vp"
        ohos:text_size="35vp"
        />

    <Button
        ohos:width="100vp"
        ohos:height="100vp"
        ohos:background_element="$graphic:circle_button_element"
        ohos:align_parent_top="true"
        ohos:text="登陆"
        ohos:padding="5vp"
        ohos:align_parent_right="true"
        ohos:id="$+id:btn_login"
        ohos:text_size="50"
        ohos:layout_alignment="horizontal_center"
        ohos:top_margin="20vp"
        ohos:text_color="white"/>

            <DirectionalLayout
                xmlns:ohos="http://schemas.huawei.com/res/ohos"
                ohos:width="match_parent"
                ohos:height="match_content"
                ohos:top_margin="80vp"
                ohos:orientation="horizontal">
                <Button
                    ohos:text_font="HwChinese-medium"
                    ohos:text_size="20vp"
                    ohos:width="0vp"
                    ohos:height="50vp"
                    ohos:weight="1"
                    ohos:text="手机号登陆"/>
                <Button
                    ohos:text_font="HwChinese-medium"
                    ohos:text_size="20vp"
                    ohos:width="0vp"
                    ohos:height="50vp"
                    ohos:weight="1"
                    ohos:text="找回密码"/>
                <Button
                    ohos:text_font="HwChinese-medium"
                    ohos:text_size="20vp"
                    ohos:width="0vp"
                    ohos:height="50vp"
                    ohos:weight="1"
                    ohos:id="$+id:register"
                    ohos:text="新用户注册"/>
            DirectionalLayout>

        DirectionalLayout>

    ScrollView>

    <ListContainer
            ohos:width="match_parent"
            ohos:height="match_parent"
            ohos:margin="5vp"

            ohos:id="$+id:list_container">


    ListContainer>

DirectionalLayout>

3.登陆界面

二、注册

1.java代码

RegisterAbility.java：

import com.chinasofti.smartclassroomtv.slice.LoginAbilitySlice;
import com.chinasofti.smartclassroomtv.slice.RegisterAbilitySlice;
import ohos.aafwk.ability.Ability;
import ohos.aafwk.content.Intent;

public class RegisterAbility extends Ability {
    @Override
    public void onStart(Intent intent) {
        super.onStart(intent);
        super.setMainRoute(RegisterAbilitySlice.class.getName());
    }
}

RegisterAbilitySlice.java：

import com.chinasofti.smartclassroomtv.ResourceTable;
import com.chinasofti.smartclassroomtv.utils.HttpClient;
import ohos.aafwk.ability.AbilitySlice;
import ohos.aafwk.content.Intent;
import ohos.aafwk.content.Operation;
import ohos.agp.components.Button;
import ohos.agp.components.ScrollView;
import ohos.agp.components.TextField;
import ohos.agp.window.dialog.ToastDialog;

public class RegisterAbilitySlice extends AbilitySlice {
    TextField account_field;
    TextField pwd_field;
    TextField confirm_field;
    Button btn_register;
    Button btn_return;
    ScrollView sv;

    @Override
    public void onStart(Intent intent) {
        super.onStart(intent);
        super.setUIContent(ResourceTable.Layout_register);//加载UI_布局

        initSliceLayout();
    }

    private void initSliceLayout() {
        account_field = (TextField) findComponentById(ResourceTable.Id_account);
        pwd_field = (TextField) findComponentById(ResourceTable.Id_pwd);
        confirm_field = (TextField) findComponentById(ResourceTable.Id_pwd_confirm);
        btn_register = (Button) findComponentById(ResourceTable.Id_btn_register);
        btn_return = (Button) findComponentById(ResourceTable.Id_btn_return);
        sv = (ScrollView) findComponentById(ResourceTable.Id_scrollview);

        account_field.setClickedListener(lis->{
            sv.setHeight(555);
        });

        pwd_field.setClickedListener(lis->{
            sv.setHeight(555);
        });

        confirm_field.setClickedListener(lis->{
            sv.setHeight(555);
        });

        btn_register.setClickedListener(lis->{
            new Thread(() -> {
                String account = account_field.getText();
                String pwd = pwd_field.getText();
                String confirm = confirm_field.getText();
                //本地确认两次输入密码相同
                if (!pwd.equals(confirm)){
                    getUITaskDispatcher().asyncDispatch(() -> {//获取UI 主线
                        new ToastDialog(getContext()).setText("密码两次输入不同").show();
                    });
                }
                //调用服务器注册url
                String res = HttpClient.doGet(HttpClient.register+
                        "?account=" + account
                        + "&pwd=" + pwd);
                getUITaskDispatcher().asyncDispatch(() -> {//获取UI 主线
                    new ToastDialog(getContext()).setText(res).show();
                });
            }).start();
        });

        //点击后返回登陆界面
        btn_return.setClickedListener(lis->{
            Operation operation = new Intent.OperationBuilder().
                    withBundleName("com.chinasofti.smartclassroomtv").withAbilityName("com.chinasofti.smartclassroomtv.LoginAbility").build();
            Intent intent1 = new Intent();
            intent1.setOperation(operation);
            startAbility(intent1);
        });

    }
}

2.xml文件

register.xml：

<DirectionalLayout
    xmlns:ohos="http://schemas.huawei.com/res/ohos"
    ohos:height="match_parent"
    ohos:width="match_parent"
    ohos:background_element="#efefef"
    ohos:orientation="vertical">

    <DependentLayout
        ohos:width="match_content"
        ohos:height="80vp"
        ohos:margin="0vp"
        ohos:padding="5vp"
        ohos:background_element="black"
        >

        <Button
            ohos:width="100vp"
            ohos:height="match_content"
            ohos:text="返回"
            ohos:padding="5vp"
            ohos:layout_alignment="vertical_center|right"
            ohos:id="$+id:btn_return"
            ohos:text_size="50"
            ohos:left_margin="20vp"
            ohos:text_color="white"/>

        <Text
            ohos:width="match_parent"
            ohos:height="match_content"
            ohos:align_parent_top="true"
            ohos:text="智慧课堂"
            ohos:padding="5vp"
            ohos:text_alignment="center"
            ohos:text_size="50"
            ohos:id="$+id:title"
            ohos:top_margin="20vp"
            ohos:text_color="white"/>

        <Button
            ohos:width="match_content"
            ohos:height="match_content"
            ohos:align_parent_top="true"
            ohos:text="logo"
            ohos:padding="10vp"
            ohos:text_alignment="center"
            ohos:id="$+id:btn_logo"
            ohos:align_parent_right="true"
            ohos:text_size="50"
            ohos:right_margin="20vp"
            ohos:text_color="white"/>
    DependentLayout>

    <ScrollView
        ohos:id="$+id:scrollview"
        ohos:height="match_content"
        ohos:width="match_content"
        ohos:background_element="#efefef"
        ohos:layout_alignment="horizontal_center">

        <DirectionalLayout
            xmlns:ohos="http://schemas.huawei.com/res/ohos"
            ohos:width="match_content"
            ohos:height="match_content"
            ohos:orientation="vertical">
    <TextField
        ohos:id="$+id:account"
        ohos:height="80vp"
        ohos:width="800vp"
        ohos:background_element="$graphic:capsule_button_element"
        ohos:layout_alignment="horizontal_center"
        ohos:hint="ID由八位字母或数字组成"
        ohos:text_color="black"
        ohos:text_font="HwChinese-medium"
        ohos:text_alignment="vertical_center|left"
        ohos:padding="20vp"
        ohos:top_margin="20vp"
        ohos:text_size="35vp"
        />

    <TextField
        ohos:id="$+id:pwd"
        ohos:height="80vp"
        ohos:width="800vp"
        ohos:background_element="$graphic:capsule_button_element"
        ohos:layout_alignment="horizontal_center"
        ohos:hint="密码不少于六位"
        ohos:text_color="black"
        ohos:text_font="HwChinese-medium"
        ohos:text_alignment="vertical_center|left"
        ohos:padding="20vp"
        ohos:top_margin="20vp"
        ohos:text_size="35vp"
        />

    <TextField
        ohos:id="$+id:pwd_confirm"
        ohos:height="80vp"
        ohos:width="800vp"
        ohos:background_element="$graphic:capsule_button_element"
        ohos:layout_alignment="horizontal_center"
        ohos:hint="确认密码"
        ohos:text_color="black"
        ohos:text_font="HwChinese-medium"
        ohos:text_alignment="vertical_center|left"
        ohos:padding="20vp"
        ohos:top_margin="20vp"
        ohos:text_size="35vp"
        />

    <Button
        ohos:width="100vp"
        ohos:height="100vp"
        ohos:background_element="$graphic:circle_button_element"
        ohos:align_parent_top="true"
        ohos:text="注册"
        ohos:padding="5vp"
        ohos:align_parent_right="true"
        ohos:id="$+id:btn_register"
        ohos:text_size="50"
        ohos:layout_alignment="horizontal_center"
        ohos:top_margin="20vp"
        ohos:text_color="white"/>

        DirectionalLayout>
    ScrollView>

DirectionalLayout>

3.注册界面

---