Using Navigation Components

Querying Page Information

To query page information, you must first ensure that the target node has been mounted as a child node to the page. If the node is not mounted, the operation will fail. For example, the corresponding information cannot be queried in the aboutToAppear lifecycle. For details about the page lifecycle and component mounting lifecycle, see Page Lifecycle. You can load different page components based on the queried page information.

This example only shows the core functionality code. For the complete example, see NDK Page Query API Example.

1. Query the current page name.

   Use OH_ArkUI_GetNavDestinationName to query the NavDestination page name. The router page name can be queried through the OH_ArkUI_GetRouterPageName API.

   // Get the page name.
   char pageName[NUM_50];
   int32_t bufferLen = 0;
   OH_ArkUI_GetNavDestinationName(node, pageName, NUM_50, &bufferLen);

   QueryNavigation.h

2. Query the page navigation parameters.

Use OH_ArkUI_GetNavDestinationParam to query the NavDestination page navigation parameters.

// Get page navigation parameters.
napi_value param = OH_ArkUI_GetNavDestinationParam(node);
napi_value nameVal = nullptr;
napi_get_named_property(env, param, "name", &nameVal);
size_t len = 0;
napi_get_value_string_utf8(env, nameVal, nullptr, 0, &len);
std::unique_ptr<char[]> viewName = std::make_unique<char[]>(len + 1);
napi_get_value_string_utf8(env, nameVal, viewName.get(), len + 1, &len);
ArkUI_NodeHandle targetNode = nullptr;
std::string view = viewName.get();
if (view == "QueryNavigation") {
    InitNavigationNode(column, pageName);
} else if (view == "QueryRouter") {
    InitRouterNode(column);
}
nativeApi->addChild(node, column);

Querying the Page State

Use OH_ArkUI_GetNavDestinationState to query the state of the NavDestination page to which the current placeholder component belongs. Router pages can be queried through the OH_ArkUI_GetRouterPageState API, and corresponding adaptations can be made based on the query results, such as setting the component's visible attribute or video playback state.

This example only demonstrates the core function code. For the complete example, see NDK Page Query API Example.

ArkUI_NodeHandle targetNode = nullptr;
OH_ArkUI_NodeUtils_GetAttachedNodeHandleById("navDestinationState", &targetNode);
auto entry = NativeEntry::GetInstance();
entry->ReportError(targetNode, "event clicked");
ArkUI_NavDestinationState state;
OH_ArkUI_GetNavDestinationState(targetNode, &state);
if (state == NUM_8) {
    entry->SetColor(targetNode, 0x80808080);
} else if (state == NUM_9) {
    entry->SetColor(targetNode, 0xFF000000);
}

Querying Page Stack Information

Use OH_ArkUI_GetNavDestinationIndex to query the position of the NavDestination to which the current placeholder component belongs in the stack. The router page index can be queried through the OH_ArkUI_GetRouterPageIndex API. Based on the returned page stack information, you can implement DFX features in app development, such as collecting parameters for performance monitoring and user behavior analysis, for data reporting and analysis.

This example only shows the core function code. For the complete example, see NDK Page Query API Example.

char navigationId[NUM_50];
int32_t bufferLen = 0;
OH_ArkUI_GetNavigationId(handle, navigationId, NUM_50, &bufferLen);
    
char name[NUM_50];
int32_t nameLen = OH_ArkUI_GetNavDestinationName(handle, name, NUM_50, &nameLen);
    
int32_t index = -1;
OH_ArkUI_GetNavDestinationIndex(handle, &index);
OH_LOG_Print(LOG_APP, LOG_ERROR, 0xFF00, "NAPI",
             "navigation id: %{public}s, name: %{public}s, index: %{public}d, error: %{public}s",
             navigationId, name, index, info.c_str());