【鸿蒙开发实战】创建Feature Ability 第二个页面的方法
想入门鸿蒙开发又怕花冤枉钱?现在能免费系统学 – 从 ArkTS 面向对象核心的类和对象、继承多态,到吃透鸿蒙开发关键技能,还能冲刺鸿蒙基础 +高级开发者证书,更惊喜的是考证成功还送好礼!
一、Feature Ability 架构概述
在鸿蒙系统的开发框架中,Feature Ability(FA)代表了具有用户界面的能力,主要用于与用户进行交互。每个FA都可以包含一个或多个Page Ability,每个Page Ability对应一个应用页面。创建第二个页面不仅是扩展应用功能的必要步骤,也是理解鸿蒙应用架构的重要实践。
二、详细创建步骤解析
- 项目结构导航与创建准备
首先,在开发环境中打开项目,导航到"Project"窗口。这个窗口展示了项目的完整目录结构,类似于传统的Android项目结构。在鸿蒙应用中,"entry"模块是应用的主模块,包含了应用的核心代码和资源。展开"entry > src > main > java"路径,这里存储了所有的Java源代码文件。"com.example.myapplication"文件夹是默认的包名目录,根据实际项目配置可能会有所不同。 - 新建Page Ability的详细操作
右键点击包名文件夹时,会弹出上下文菜单。在菜单中选择"New > Ability"会展开子菜单,这里提供了多种Ability创建模板。选择"Empty Page Ability(Java)"是最常见的选择,因为它创建了一个干净的、可自定义的页面模板。点击后,系统会弹出配置对话框,这是整个创建过程中最关键的一步。 - 配置对话框详解
配置对话框中包含多个重要字段:
• Ability Name:输入"SecondAbility",这将成为新页面的类名。命名应遵循Java类名规范,采用大驼峰命名法。
• Page Name:同样设置为"SecondAbility",这决定了在config.json中的注册名称。
• Package Name:自动填充为当前包路径,通常不需要修改。
• Layout Name:自动生成"ability_second"作为布局文件名。
• Enabled:默认为true,表示Ability在安装后可用。
• Visible:默认为true,表示Ability对其他应用可见。
• Type:选择"page",表明这是一个页面类型的Ability。 - 文件生成与结构分析
点击"Finish"后,IDE会自动生成四个关键文件:
• SecondAbility.java:Ability的主类文件,继承自Ability基类
• SecondAbilitySlice.java:页面的实际内容类,继承自AbilitySlice
• ability_second.xml:布局文件,定义了页面的UI结构
• config.json:会被自动更新,添加新的Ability声明
三、SecondAbilitySlice详细开发 - 文件结构与导入分析
打开新生成的"SecondAbilitySlice.java"文件,首先看到的是自动生成的代码框架。顶部是package声明,接着是一系列的import语句。鸿蒙SDK提供了丰富的API,主要导入包括:
• ohos.aafwk.ability.AbilitySlice:所有Slice的基类
• ohos.aafwk.content.Intent:用于页面间通信
• ohos.agp.components.Component:UI组件基类
• ohos.agp.components.Text:文本显示组件 - onStart()方法深入理解
onStart()方法是AbilitySlice的生命周期方法之一,在页面准备显示时被调用。这个方法有几个重要作用:
• 初始化UI界面:调用super.onStart(intent)确保父类正确初始化
• 加载布局:通过setUIContent()方法将XML布局与Java代码关联
• 组件绑定与配置:查找布局中的组件并设置属性
详细代码实现示例
package com.example.myapplication.slice;
import ohos.aafwk.ability.AbilitySlice;
import ohos.aafwk.content.Intent;
import ohos.agp.components.DirectionalLayout;
import ohos.agp.components.Text;
import ohos.agp.colors.RgbColor;
import ohos.agp.components.element.ShapeElement;
import ohos.agp.utils.LayoutAlignment;
import ohos.agp.utils.TextAlignment;
import ohos.agp.components.Button;
import ohos.agp.utils.Color;
public class SecondAbilitySlice extends AbilitySlice {
@Override
public void onStart(Intent intent) {
super.onStart(intent);
// 创建主布局
DirectionalLayout mainLayout = new DirectionalLayout(getContext());
mainLayout.setWidth(DirectionalLayout.LayoutConfig.MATCH_PARENT);
mainLayout.setHeight(DirectionalLayout.LayoutConfig.MATCH_PARENT);
mainLayout.setOrientation(DirectionalLayout.VERTICAL);
mainLayout.setPadding(32, 32, 32, 32);
// 设置背景色
ShapeElement background = new ShapeElement();
background.setRgbColor(new RgbColor(240, 248, 255)); // 浅蓝色背景
mainLayout.setBackground(background);
// 创建标题文本
Text titleText = new Text(getContext());
titleText.setText("第二个页面");
titleText.setTextSize(48);
titleText.setTextColor(Color.BLACK);
titleText.setTextAlignment(TextAlignment.CENTER);
titleText.setWidth(DirectionalLayout.LayoutConfig.MATCH_PARENT);
titleText.setHeight(100);
titleText.setMarginTop(50);
// 设置标题样式
ShapeElement titleBg = new ShapeElement();
titleBg.setRgbColor(new RgbColor(173, 216, 230)); // 浅蓝色
titleBg.setCornerRadius(25.0f);
titleText.setBackground(titleBg);
// 创建内容文本
Text contentText = new Text(getContext());
contentText.setText("欢迎来到鸿蒙应用的第二个页面!\n\n" +
"这是一个完全通过代码创建的页面,展示了鸿蒙UI编程的基本方法。\n\n" +
"页面特点:\n" +
"1. 使用DirectionalLayout作为根布局\n" +
"2. 动态设置背景颜色和边距\n" +
"3. 通过代码设置文本样式\n" +
"4. 响应按钮点击事件");
contentText.setTextSize(28);
contentText.setTextColor(new Color(Color.getIntColor("#333333")));
contentText.setTextAlignment(TextAlignment.START);
contentText.setWidth(DirectionalLayout.LayoutConfig.MATCH_PARENT);
contentText.setHeight(300);
contentText.setMarginTop(30);
contentText.setLineSpacingMultiplier(1.5f);
// 创建返回按钮
Button backButton = new Button(getContext());
backButton.setText("返回首页");
backButton.setTextSize(32);
backButton.setTextColor(Color.WHITE);
backButton.setWidth(300);
backButton.setHeight(80);
backButton.setMarginTop(50);
backButton.setAlignment(LayoutAlignment.HORIZONTAL_CENTER);
// 设置按钮样式
ShapeElement buttonBg = new ShapeElement();
buttonBg.setRgbColor(new RgbColor(70, 130, 180)); // 钢蓝色
buttonBg.setCornerRadius(40.0f);
backButton.setBackground(buttonBg);
// 添加按钮点击事件
backButton.setClickedListener(component -> {
// 返回到上一个页面
terminate();
});
// 将所有组件添加到布局中
mainLayout.addComponent(titleText);
mainLayout.addComponent(contentText);
mainLayout.addComponent(backButton);
// 设置当前Slice的UI内容
super.setUIContent(mainLayout);
}
@Override
public void onActive() {
super.onActive();
// 页面获取焦点时的处理
}
@Override
public void onForeground(Intent intent) {
super.onForeground(intent);
// 页面回到前台时的处理
}
}
4. 布局文件配置说明
虽然上述示例使用纯代码创建UI,但通常更推荐使用XML布局文件。生成的ability_second.xml文件内容如下:
xml
<?xml version="1.0" encoding="utf-8"?><Text
ohos:id="$+id:title_text"
ohos:width="match_parent"
ohos:height="100"
ohos:text="第二个页面"
ohos:text_size="48"
ohos:text_color="#000000"
ohos:text_alignment="center"
ohos:background_element="$graphic:title_background"
ohos:layout_alignment="horizontal_center"
ohos:top_margin="50"/>
<Text
ohos:id="$+id:content_text"
ohos:width="match_parent"
ohos:height="300"
ohos:text="这是一个示例页面,展示鸿蒙应用的第二个页面功能。"
ohos:text_size="28"
ohos:text_color="#333333"
ohos:text_alignment="start"
ohos:top_margin="30"
ohos:line_spacing_multiplier="1.5"/>
<Button
ohos:id="$+id:back_button"
ohos:width="300"
ohos:height="80"
ohos:text="返回"
ohos:text_size="32"
ohos:text_color="#FFFFFF"
ohos:top_margin="50"
ohos:layout_alignment="horizontal_center"
ohos:background_element="$graphic:button_background"/>
5. config.json配置更新 创建SecondAbility后,config.json文件会自动更新,添加以下配置:
json
{
“abilities”: [
{
“name”: “.SecondAbility”,
“icon”: “ m e d i a : i c o n " , " l a b e l " : " media:icon", "label": " media:icon","label":"string:SecondAbility”,
“description”: “$string:SecondAbility_description”,
“type”: “page”,
“visible”: true,
“launchType”: “standard”
}
]
}
想入门鸿蒙开发又怕花冤枉钱?别错过!现在能免费系统学 – 从 ArkTS 面向对象核心的类和对象、继承多态,到吃透鸿蒙开发关键技能,还能冲刺鸿蒙基础 +高级开发者证书,更惊喜的是考证成功还送好礼!快加入我的鸿蒙班,一起从入门到精通,班级链接:点击免费进入
更多推荐



所有评论(0)