devbox
菜鸟追梦旅行
这个屌丝很懒，什么也没留下！
关注作者
热门标签
热门文章
当前位置:   article > 正文

鸿蒙使用java语言编写一个登录界面_鸿蒙java登录注册跳转页面代码

作者：菜鸟追梦旅行 | 2024-03-13 07:09:20

赞

踩

鸿蒙java登录注册跳转页面代码

一个大二学生党第一次发文章，最近开始接触鸿蒙软件开发，相对于安卓开发，个人觉得鸿蒙开发有更多的选择性。接下来直接上自己做的一个小demo

主界面

通过getText()方法来获取文本框里面的信息进行账号密码判断

登录失败返回登录界面

登录成功跳转界面

登录成功界面的文字是用了跑马灯的显示方式

ability_main.xml

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <DirectionalLayout
  3.     xmlns:ohos="http://schemas.huawei.com/res/ohos"
  4.     ohos:height="match_parent"
  5.     ohos:width="match_parent"
  6.     ohos:orientation="vertical">
  7.     <Text
  8.         ohos:id="$+id:text_hello"
  9.         ohos:height="match_content"
  10.         ohos:width="match_content"
  11.         ohos:background_element="$graphic:background_ability_main"
  12.         ohos:layout_alignment="horizontal_center"
  13.         ohos:text="$string:head"
  14.         ohos:text_size="120"
  15.         />
  16.     <TabList
  17.         ohos:id="$+id:tab_list"
  18.         ohos:height="40vp"
  19.         ohos:width="match_parent"
  20.         ohos:tab_length="90vp"
  21.         ohos:text_size="20fp"
  22.         ohos:text_alignment="center"
  23.         ohos:orientation="horizontal"
  24.         ohos:normal_text_color="#000000"
  25.         ohos:selected_text_color="#000000"
  26.         ohos:selected_tab_indicator_color="#000000"
  27.         ohos:selected_tab_indicator_height="10vp"
  28.         />
  29.        <DirectionalLayout
  30.         ohos:id="$+id:tab_container"
  31.         ohos:height="match_parent"
  32.         ohos:width="match_parent"
  33.         ohos:below="$id:tab_list"
  34.         />
  35.  
  36.  
  37. </DirectionalLayout>

login.xml

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <DirectionalLayout
  3.     xmlns:ohos="http://schemas.huawei.com/res/ohos"
  4.     ohos:height="match_parent"
  5.     ohos:width="match_parent"
  6.     ohos:orientation="vertical">
  7.     <Text
  8.         ohos:id="$+id:text_body"
  9.         ohos:height="100vp"
  10.         ohos:width="match_content"
  11.         ohos:background_element="$graphic:background_ability_main"
  12.         ohos:layout_alignment="horizontal_center"
  13.         ohos:text="$string:login"
  14.         ohos:text_size="120"
  15.         ohos:top_padding="80"
  16.         />
  17.     <TextField
  18.         ohos:hint="请输入账号..."
  19.         ohos:hint_color="#000000"
  20.         ohos:left_margin="40vp"
  21.         ohos:right_margin="40vp"
  22.         ohos:id="$+id:username"
  23.         ohos:below="$id:text_body"
  24.         ohos:height="40vp"
  25.         ohos:width="match_parent"
  26.         ohos:background_element="#FF75758B"
  27.         ohos:auto_font_size="true"
  28.         ohos:multiple_lines="false"
  29.         ohos:text_input_type="pattern_text"
  30.         />
  31.     <TextField
  32.         ohos:hint="请输入密码..."
  33.         ohos:hint_color="#000000"
  34.         ohos:top_margin="10vp"
  35.         ohos:left_margin="40vp"
  36.         ohos:right_margin="40vp"
  37.         ohos:id="$+id:password"
  38.         ohos:below="$id:username"
  39.         ohos:height="40vp"
  40.         ohos:width="match_parent"
  41.         ohos:background_element="#FF75758B"
  42.         ohos:auto_font_size="true"
  43.         ohos:multiple_lines="false"
  44.         ohos:text_input_type="pattern_password"
  45.         />
  46.     <Button
  47.         ohos:top_margin="20vp"
  48.         ohos:left_margin="120vp"
  49.         ohos:right_margin="120vp"
  50.         ohos:height="40vp"
  51.         ohos:width="match_parent"
  52.         ohos:id="$+id:loginbutton"
  53.         ohos:hint="登录"
  54.         ohos:hint_color="#000000"
  55.         ohos:background_element="#FF75758B"
  56.         ohos:auto_font_size="true"
  57.         />
  58.  
  59.  
  60. </DirectionalLayout>

hello.xml(默认首页)

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <DirectionalLayout
  3.     xmlns:ohos="http://schemas.huawei.com/res/ohos"
  4.     ohos:height="match_parent"
  5.     ohos:width="match_parent"
  6.     ohos:orientation="vertical">
  7.     <Text
  8.         ohos:id="$+id:text_body"
  9.         ohos:height="match_content"
  10.         ohos:width="match_content"
  11.         ohos:background_element="$graphic:background_ability_main"
  12.         ohos:layout_alignment="horizontal_center"
  13.         ohos:text="$string:Hello"
  14.         ohos:text_size="120"
  15.         ohos:top_padding="80"
  16.         />
  17. </DirectionalLayout>

loginfinish.xml（登录成功界面）

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <DirectionalLayout
  3.     xmlns:ohos="http://schemas.huawei.com/res/ohos"
  4.     ohos:height="match_parent"
  5.     ohos:width="match_parent"
  6.     ohos:orientation="vertical">
  7.     <Text
  8.         ohos:id="$+id:top_text_body"
  9.         ohos:height="100vp"
  10.         ohos:width="match_content"
  11.         ohos:background_element="$graphic:background_ability_main"
  12.         ohos:layout_alignment="horizontal_center"
  13.         ohos:text="$string:loginfinish"
  14.         ohos:text_size="120"
  15.         ohos:top_padding="80"
  16.         />
  17.     <Image
  18.         ohos:id="$+id:wx"
  19.         ohos:height="100vp"
  20.         ohos:width="match_content"
  21.         ohos:below="$id:top_text_body"
  22.         ohos:image_src="$media:weixin"
  23.         ohos:scale_y="4"
  24.         ohos:scale_x="4"
  25.         ohos:layout_alignment="horizontal_center"
  26.         />
  27.     <Text
  28.         ohos:id="$+id:bottom_text_body"
  29.         ohos:height="100vp"
  30.         ohos:width="match_content"
  31.         ohos:background_element="$graphic:background_ability_main"
  32.         ohos:layout_alignment="horizontal_center"
  33.         ohos:text="$string:loginwx"
  34.         ohos:below="$id:wx"
  35.         ohos:text_size="120"
  36.         ohos:top_padding="80"
  37.         />
  38. </DirectionalLayout>

注册界面和关于我们的界面只是个模子我还没做所以就跳过了

MainAbilitySlice.java

  1. package com.etc.tablelist.slice;
  2.  
  3. import com.etc.tablelist.ResourceTable;
  4. import ohos.aafwk.ability.AbilitySlice;
  5. import ohos.aafwk.content.Intent;
  6. import ohos.agp.components.*;
  7.  
  8. import java.text.BreakIterator;
  9.  
  10. public class MainAbilitySlice extends AbilitySlice {
  11.     @Override
  12.     public void onStart(Intent intent) {
  13.         super.onStart(intent);
  14.         super.setUIContent(ResourceTable.Layout_ability_main);
  15.         /*顶部切换控件 tablist*/
  16.         TabList tabList = (TabList) findComponentById(ResourceTable.Id_tab_list);
  17.         TabList.Tab tab1 = tabList.new Tab(getContext());
  18.         tab1.setText("首页");
  19.         tabList.addTab(tab1);
  20.         TabList.Tab tab2 = tabList.new Tab(getContext());
  21.         tab2.setText("登录");
  22.         tabList.addTab(tab2);
  23.         TabList.Tab tab3 = tabList.new Tab(getContext());
  24.         tab3.setText("注册");
  25.         tabList.addTab(tab3);
  26.         TabList.Tab tab4 = tabList.new Tab(getContext());
  27.         tab4.setText("关于我们");
  28.         tabList.addTab(tab4);
  29.  
  30.  
  31.         AbilitySlice slice=this;//指向当前对象
  32.  
  33.         //添加tablist的选择效果
  34.         tabList.addTabSelectedListener(new TabList.TabSelectedListener() {
  35.             ComponentContainer componentContainer = (ComponentContainer) findComponentById(ResourceTable.Id_tab_container);
  36.             @Override
  37.             public void onSelected(TabList.Tab tab) {
  38.                 if(tab.getText().equals("首页")){//当点首页时显示首页
  39.                     componentContainer.removeAllComponents();//清除当前界面
  40.                     Component hello = LayoutScatter.getInstance(slice).parse(ResourceTable.Layout_hello,null,false);
  41.                     componentContainer.addComponent(hello);//显示首页
  42.                 }else  if(tab.getText().equals("登录")){//当点登录时显示登录界面
  43.                     componentContainer.removeAllComponents();//清除当前界面
  44.                     Component login = LayoutScatter.getInstance(slice).parse(ResourceTable.Layout_login,null,false);
  45.                     componentContainer.addComponent(login);//显示登录界面
  46.                     Button button = (Button) findComponentById(ResourceTable.Id_loginbutton);
  47.                     button.setClickedListener(new Component.ClickedListener() {//添加按钮的选择效果
  48.                         @Override
  49.                         public void onClick(Component component) {
  50.                             /*获取帐号和密码*/
  51.                         Text username = (Text) findComponentById(ResourceTable.Id_username);
  52.                         Text password = (Text) findComponentById(ResourceTable.Id_password);
  53.                         if(username.getText().trim().equals("Leach")&&password.getText().trim().equals("001216")){ //判断帐号和密码是否匹配
  54.                             componentContainer.removeAllComponents();
  55.                             MainAbilitySlice.super.setUIContent(ResourceTable.Layout_loginfinish);
  56.                             Text text= (Text) findComponentById(ResourceTable.Id_bottom_text_body);
  57.                             //设置跑马灯效果
  58.                             text.setTruncationMode(Text.TruncationMode.AUTO_SCROLLING);
  59.                             //启动跑马灯
  60.                             text.startAutoScrolling();
  61.                             //设置始终
  62.                             text.setAutoScrollingCount(Text.AUTO_SCROLLING_FOREVER);
  63.                         }else{
  64.                             componentContainer.removeAllComponents();
  65.                             componentContainer.addComponent(login);
  66.                         }
  67.                     }
  68.                     });
  69.                 }else  if(tab.getText().equals("注册")){
  70.                     componentContainer.removeAllComponents();
  71.                     Component register = LayoutScatter.getInstance(slice).parse(ResourceTable.Layout_register,null,false);
  72.                     componentContainer.addComponent(register);
  73.                 }else  if(tab.getText().equals("关于我们")){
  74.                     componentContainer.removeAllComponents();
  75.                     Component aboutus = LayoutScatter.getInstance(slice).parse(ResourceTable.Layout_aboutus,null,false);
  76.                     componentContainer.addComponent(aboutus);
  77.                 }
  78.             }
  79.  
  80.             @Override
  81.             public void onUnselected(TabList.Tab tab) {
  82.  
  83.             }
  84.  
  85.             @Override
  86.             public void onReselected(TabList.Tab tab) {
  87.  
  88.             }
  89.         });
  90.         tabList.selectTab(tab1);
  91.     }
  92.     @Override
  93.     public void onActive() {
  94.         super.onActive();
  95.     }
  96.  
  97.     @Override
  98.     public void onForeground(Intent intent) {
  99.         super.onForeground(intent);
  100.     }
  101. }

string.json

  1. {
  2.   "string": [
  3.     {
  4.       "name": "app_name",
  5.       "value": "tablelist"
  6.     },
  7.     {
  8.       "name": "head",
  9.       "value": "厦门同城交友"
  10.     },
  11.     {
  12.       "name": "mainability_description",
  13.       "value": "Java_Phone_Empty Feature Ability"
  14.     },
  15.     {
  16.       "name": "Hello",
  17.       "value": "欢迎使用"
  18.     },
  19.     {
  20.       "name": "login",
  21.       "value": "登录界面"
  22.     },
  23.     {
  24.       "name": "register",
  25.       "value": "注册界面"
  26.     },
  27.     {
  28.       "name": "aboutus",
  29.       "value": "关于我们"
  30.     },
  31.     {
  32.       "name": "loginfinish",
  33.       "value": "登录成功"
  34.     },
  35.     {
  36.       "name": "loginwx",
  37.       "value": "最快捷的交友方式就是微信啦！！！"
  38.     }
  39.   ]
  40. }

以上就是demo的全内容

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/菜鸟追梦旅行/article/detail/228377
推荐阅读
相关标签

Copyright © 2003-2013 www.wpsshop.cn 版权所有，并保留所有权利。