HarmonyOS鸿蒙Next中导航栏返回键的样式如何修改-NavDestination

HarmonyOS鸿蒙Next中导航栏返回键的样式如何修改-NavDestination 如图，怎么去掉返回键默认的灰色背景？修改返回键的样式。

现在只有hideBackButton可以去掉返回键。如果想要保留返回键，去掉灰色背景如何实现。

cke_4059.png


更多关于HarmonyOS鸿蒙Next中导航栏返回键的样式如何修改-NavDestination的实战教程也可以访问 https://www.itying.com/category-93-b0.html

4 回复 
import { router } from '@kit.ArkUI'
@Component
struct NextPage {
  build() {
    NavDestination() {
      Column() {
        // 自定义导航栏
        Row() {
          Image($r('app.media.chevron_left'))//自定义图标
            .width(24)
            .height(24)
            .onClick(() => router.back())
          Text('自定义标题')
            .layoutWeight(1)
            .margin({left:10})
            .fontSize(24)
            .fontWeight(700)
        }
        .width('100%')
        .padding(10)
        // 页面内容
        Text('正文内容')
      }
    }
    .hideTitleBar(true)
    .hideToolBar(true)
  }
}

更多关于HarmonyOS鸿蒙Next中导航栏返回键的样式如何修改-NavDestination的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


建议隐藏掉导航栏，然后自定义页面样式哦~~

在HarmonyOS鸿蒙Next中，修改导航栏返回键的样式可以通过NavDestination的setNavigationIcon方法实现。NavDestination是导航组件的一部分，用于定义导航目标。你可以通过自定义Drawable资源来设置返回键的图标样式。

首先，在res/drawable目录下创建自定义的返回键图标资源文件。然后，在代码中通过NavDestination的setNavigationIcon方法设置该图标。例如：

val navController = findNavController(R.id.nav_host_fragment)
val navDestination = navController.currentDestination as? NavDestination
navDestination?.setNavigationIcon(R.drawable.custom_back_icon)

其中，R.drawable.custom_back_icon是你自定义的返回键图标资源。通过这种方式，你可以修改导航栏返回键的样式。

在HarmonyOS鸿蒙Next中，导航栏返回键的样式可以通过NavDestination的setNavigationIcon方法进行自定义。你可以使用ResourceTable中的资源或自定义Drawable来设置返回键的图标。例如：

NavDestination destination = navigation.findDestination(R.id.your_destination);
destination.setNavigationIcon(ResourceTable.Media_custom_back_icon);

此外，你还可以通过setNavigationIconTint方法调整图标的颜色。确保在XML布局或代码中正确引用资源文件。

回到顶部