鸿蒙系统,鸿蒙app简易登录界面,界面开发教程。
// 这个是主Ability
public class MainAbilitySlice extends AbilitySlice {
@Override
public void onStart(Intent intent) {
super.onStart(intent);
//将界面展示出来
super.setUIContent(ResourceTable.Layout_dy_main);
}
}
element下string.json
{
"string": [
{
"name": "app_name",
"value": "dy"
},
{
"name": "mainability_description",
"value": "Java_Phone_Empty Feature Ability"
},
{
"name": "title",
"value": "解析抖音地址"
},
{
"name": "hint_text",
"value": "输入解析地址"
},
{
"name": "btn_text",
"value": "解析:"
},
{
"name": "input_text",
"value": "请输入内容"
},
{
"name": "username",
"value": "输入账户:"
},
{
"name": "submit_bt",
"value": "点击登录"
},
{
"name": "login_label",
"value": "登录"
},
{
"name": "password",
"value": "输入密码:"
},
{
"name": "username_hint",
"value": "输入账户"
},
{
"name": "password_hint",
"value": "输入密码"
},
{
"name": "font",
"value": "serif"
}
]
}
graphic下面几个文件
background_ability_main.xml
<?xml version="1.0" encoding="UTF-8" ?>
<shape xmlns:ohos="http://schemas.huawei.com/res/ohos"
ohos:shape="rectangle">
<solid
ohos:color="#FF5B1414"/>
</shape>
background_button.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:ohos="http://schemas.huawei.com/res/ohos"
ohos:shape="rectangle">
<corners
ohos:radius="10"/>
<solid
ohos:color="#FF0C3F67"/>
</shape>
color_cyan_element.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:ohos="http://schemas.huawei.com/res/ohos"
ohos:shape="rectangle">
<corners
ohos:radius="20"/>
<solid
ohos:color="#FFFFFFFF"/>
</shape>
简易布局dy_main.xml
<?xml version="1.0" encoding="utf-8"?>
<DirectionalLayout
xmlns:ohos="http://schemas.huawei.com/res/ohos"
ohos:height="match_content"
ohos:width="match_parent"
>
<!--最顶部的登录中心-->
<Text
ohos:height="match_parent"
ohos:width="match_parent"
ohos:bottom_margin="-250vp"
ohos:text="$string:login_label"
ohos:text_alignment="center"
ohos:text_size="28fp"
ohos:top_margin="200vp"/>
<!--输入账户对应栏位-->
<DirectionalLayout
ohos:height="match_parent"
ohos:width="match_parent"
ohos:alignment="left"
ohos:left_margin="20vp"
ohos:orientation="horizontal"
ohos:top_margin="260fp"
>
<Text
ohos:id="$+id:username_label"
ohos:height="match_parent"
ohos:width="match_parent"
ohos:background_element="$graphic:color_cyan_element"
ohos:italic="false"
ohos:text="$string:username"
ohos:text_alignment="center"
ohos:text_color="#FF090909"
ohos:text_font="$string:font"
ohos:text_size="20fp"
ohos:text_weight="1"
ohos:weight="1"/>
<TextField
ohos:id="$+id:username"
ohos:height="60vp"
ohos:width="match_parent"
ohos:background_element="$graphic:color_cyan_element"
ohos:basement="#000099"
ohos:italic="false"
ohos:right_margin="70vp"
ohos:hint="$string:username_hint"
ohos:hint_color="#FF424275"
ohos:text_alignment="center"
ohos:text_color="#FF090909"
ohos:text_font="$string:font"
ohos:text_size="20fp"
ohos:text_weight="1"
ohos:weight="1"/>
</DirectionalLayout>
<!--密码对应栏位-->
<DirectionalLayout
ohos:height="match_parent"
ohos:width="match_parent"
ohos:alignment="left"
ohos:left_margin="20vp"
ohos:orientation="horizontal"
ohos:top_margin="40fp"
>
<Text
ohos:id="$+id:password_label"
ohos:height="match_parent"
ohos:width="match_parent"
ohos:background_element="$graphic:color_cyan_element"
ohos:italic="false"
ohos:text="$string:password"
ohos:text_alignment="center"
ohos:text_color="#FF090909"
ohos:text_font="$string:font"
ohos:text_size="20fp"
ohos:text_weight="1"
ohos:weight="1"/>
<TextField
ohos:id="$+id:password"
ohos:height="60vp"
ohos:width="match_parent"
ohos:background_element="$graphic:color_cyan_element"
ohos:basement="#000099"
ohos:italic="false"
ohos:right_margin="70vp"
ohos:hint="$string:password_hint"
ohos:hint_color="#FF424275"
ohos:text_alignment="center"
ohos:text_color="#FF090909"
ohos:text_font="$string:font"
ohos:text_size="20fp"
ohos:text_weight="1"
ohos:weight="1"/>
</DirectionalLayout>
<!--登录按钮-->
<Button
ohos:id="$+id:login_submit"
ohos:height="40vp"
ohos:width="150vp"
ohos:background_element="$graphic:background_button"
ohos:layout_alignment="center"
ohos:text="$string:submit_bt"
ohos:text_color="#FFFFFEFE"
ohos:text_size="20vp"
ohos:top_margin="35vp"
/>
</DirectionalLayout>