应用页面亮度调节指导

FengTianYa

发布于 2024-12-13 10:46

浏览

0收藏

问题背景

目前单框架上的亮度调节接口是绑定在window上，而非具体页面上，如果一个页面A调节了亮度，在页面A返回后，如果没有做恢复操作，跳转/返回到页面B后，还会保持该亮度，导致页面亮度和预期可能不符，针对该背景，总结了三类应用场景：

场景一（调整亮度页面退出后其他页面仍为系统亮度）

应用页面亮度调节指导-鸿蒙开发者社区

如上图，每次进入和退出页面都恢复到系统默认亮度。

关键解决方法（通过UIObserver实现页面跳转监听）

uiObserver.on('navDestinationUpdate', (info)=>{})

当页面使用Navigation进行路由跳转时，可使用observer.on('navDestinationUpdate')来实现路由页面声明周期的监听，并进行做统一处理。

实现方案

1、通过自定义函数ResetBrightness将亮度设置成默认值，实际调用windowClass.setWindowBrightness(-1)将亮度设置成系统默认亮度，如果要设置具体亮度，可以自行添加入参（0到1)。

// 抽出公共能力代码 
import { window } from '@kit.ArkUI'; 
 
// 重置亮度到默认值 
export function ResetBrightness() { 
  window.getLastWindow(getContext(), (err, windowClass) => { 
    const errCode = err.code; 
    if (errCode) { 
      console.log('window:', JSON.stringify(err)) 
      return; 
    } 
    // 设置默认亮度 
    windowClass.setWindowBrightness(-1); 
  }) 
}

2、在onWindowStageCreate中通过uiObserver监听navDestinationUpdate事件，并在状态uiObserver.NavDestinationState.ON_WILL_HIDE（页面隐藏）时触发。

onWindowStageCreate(windowStage: window.WindowStage): void { 
  // Main window is created, set main page for this ability 
  windowStage.loadContent('pages/Index', (err) => { 
    if (err.code) { 
      hilog.error(0x0000, 'testTag', 'Failed to load the content. Cause: %{public}s', JSON.stringify(err) ?? ''); 
      return; 
    } 
    hilog.info(0x0000, 'testTag', 'Succeeded in loading the content.'); 
  }); 
  // 使用uiObserver监听navDestinationUpdate事件 
  uiObserver.on('navDestinationUpdate', (info) => { 
    // 监听ON_WILL_HIDE状态，如果想过滤特定页面，可以使用info.name来进行过滤 
    if (info.state == uiObserver.NavDestinationState.ON_WILL_HIDE) { 
      // 重置亮度到默认值 
      ResetBrightness(); 
    } 
  }); 
}

场景二（页面进入后，自动调节成页面之前保存的亮度）

应用页面亮度调节指导-鸿蒙开发者社区

实现方案

1、保存每个页面的亮度（如果页面有设置的情况下）到存储对象中，比如AppStorage。

2、在页面ON_WILL_SHOW中增加亮度恢复逻辑（如果有保存指定页面的亮度，则主动设置成该亮度，否则设置成默认亮度即可）。

// 同2.2中第二部分，使用uiObserver监听navDestinationUpdate事件 
uiObserver.on('navDestinationUpdate', (info) => { 
  // 监听ON_WILL_SHOW状态，如果想过滤特定页面，可以使用info.name来进行过滤 
  if (info.state == uiObserver.NavDestinationState.ON_WILL_SHOW && info.name == '页面B') { 
    // 恢复之前亮度 
    ResetPreBrightness(); 
  } 
})

场景三（页面进入后，自动调节成确定值（最高）亮度）

应用页面亮度调节指导-鸿蒙开发者社区

同场景一，如上图只需要在ON_WILL_SHOW状态中，手动设置成最亮即可，注意需要在ON_WILL_HIDE时恢复默认亮度，针对特定页面可以在uiObserver中通过info.name判断页面（比如二维码收付款页面）。

// 使用uiObserver监听navDestinationUpdate事件 
uiObserver.on('navDestinationUpdate', (info) => { 
  // 监听ON_WILL_HIDE状态，如果想过滤特定页面，可以使用info.name来进行过滤 
  if (info.state == uiObserver.NavDestinationState.ON_WILL_HIDE) { 
    // 重置亮度到默认值 
    ResetBrightness(); 
  } 
  if (info.state == uiObserver.NavDestinationState.ON_WILL_SHOW && info.name == '页面B') { 
    // 调整最大亮度 
    SetMaxBrightness(); 
  } 
});

分类

标签