HarmonyOS鸿蒙Next中floatingBall复制demo代码没有显示出来

HarmonyOS鸿蒙Next中floatingBall复制demo代码没有显示出来 鸿蒙API 20的新控件floatingBall 按照官方demo中的示例代码，没有显示出来。

let ctx = this.getUIContext().getHostContext() as common.UIAbilityContext;
let config: floatingBall.FloatingBallConfiguration = {
  context: ctx,
};
let updateParams: floatingBall.FloatingBallParams = {
  template: floatingBall.FloatingBallTemplate.EMPHATIC,
  title: 'title2',
  content: 'content2'
};
try {
  floatingBall.create(config).then((data: floatingBall.FloatingBallController) => {
    this.floatingBallController = data;
    console.info(`Succeeded in creating floating ball controller. Data: ${data}`);

    // 移动 update 逻辑到 create 回调中，确保 controller 已初始化
    this.floatingBallController.updateFloatingBall(updateParams).then(() => {
      console.info('Succeeded in updating floating ball.');
    }).catch((err: BusinessError) => {
      console.error(`Failed to update floating ball. Cause:${err.code}, message:${err.message}`);
    });

  }).catch((err: BusinessError) => {
    console.error(`Failed to create floating ball controller. Cause:${err.code}, message:${err.message}`);
  });
} catch(e) {
  console.error(`Failed to create floating ball controller. Cause:${e.code}, message:${e.message}`);
}

使用代码如上所示。


更多关于HarmonyOS鸿蒙Next中floatingBall复制demo代码没有显示出来的实战教程也可以访问 https://www.itying.com/category-93-b0.html

4 回复

开发者你好，可以按照以下思路排查一下：

【解决方案】 基于安全考虑，仅允许应用在前台时启动闪控球，并且需要具有ohos.permission.USE_FLOAT_BALL权限，仅支持手机和平板设备。同一个应用只能启动一个闪控球，同一个设备最多同时存在两个闪控球，在超出闪控球最大个数限制时，打开新的闪控球会替换最早启动的闪控球。 开发步骤： 1.导入模块并声明闪控球控制器。 2.使用creat()接口创建闪控球控制器实例后注册点击事件回调和状态变化事件回调，通过startFloatingBall()接口启动闪控球。 3.通过updateFloatingBall()更新闪控球信息，以此控制闪控球展示的内容。 4.通过stopFloatingBall()停止闪控球。当不再需要显示闪控球时，可根据业务需要关闭闪控球。详细内容见demo参考闪控球开发步骤。

更多关于HarmonyOS鸿蒙Next中floatingBall复制demo代码没有显示出来的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


ohos.permission.USE_FLOAT_BALL 属于受限开放权限，应该是没权限吧

https://developer.huawei.com/consumer/cn/doc/harmonyos-guides/restricted-permissions#ohospermissionuse_float_ball

鸿蒙Next中floatingBall未显示，请检查以下核心点：

  1. 确认在module.json5的abilities中已正确配置"windowStage": { "floatable": true }。
  2. 检查WindowStage的loadContent方法是否已成功加载包含悬浮窗组件的页面。
  3. 确保在代码中通过windowClass的createWindow方法创建了悬浮窗，并调用了showWindow。
  4. 验证WindowStage的showWindow方法是否在主线程或UI线程中被调用。

根据您提供的代码，问题很可能出在获取 context 的方式上。在 HarmonyOS Next (API 10) 中，floatingBall 控件的 FloatingBallConfiguration 所需的 context 类型为 common.UIAbilityContext，但您获取上下文的方式 this.getUIContext().getHostContext() 可能返回的是 Context 类型，而非特定的 UIAbilityContext。

这会导致 floatingBall.create(config) 调用失败，悬浮球无法创建。控制台应该会打印出相应的错误日志，请检查 console.error 输出的具体错误信息。

核心修正方案：

您需要直接获取 UIAbility 的上下文。在 EntryAbility 或您的 UIAbility 类中，正确的获取方式如下：

// 在您的UIAbility类（例如EntryAbility）中，或能获取到UIAbility实例的地方
let ctx: common.UIAbilityContext = this.context;

// 或者，如果您在Page页面中，并且能访问到UIAbility实例
// 通常可以通过 getContext(this) 等方式，具体取决于您的工程结构

修改后的代码关键部分应为：

// 确保这里的 `ctx` 是直接从 UIAbility 实例获取的 context
let ctx: common.UIAbilityContext = ...; // 正确的UIAbilityContext
let config: floatingBall.FloatingBallConfiguration = {
  context: ctx, // 使用正确的上下文
};

排查步骤：

  1. 确认上下文来源：检查您执行这段代码的当前位置。如果是在 UIAbility（如 EntryAbility）的 onWindowStageCreate 等方法中，直接使用 this.context。如果是在 Page 页面中，需要通过合适的方式（例如依赖注入或API调用）获取所属 UIAbility 的 context。
  2. 检查控制台错误：运行应用，重点查看开发工具（DevEco Studio）的日志输出中，由 catch 块捕获的 err.code 和 err.message。错误信息会明确指出是参数错误还是上下文类型不匹配。
  3. 验证权限：确保您的应用已在 module.json5 文件中声明了所需的悬浮窗权限：
    "requestPermissions": [
  {
    "name": "ohos.permission.SYSTEM_FLOAT_WINDOW"
  }
]

只要将正确的 UIAbilityContext 实例传入配置，悬浮球即可正常创建并显示。

回到顶部