8.8 released—CSS Media Query support, SF Symbols and much more...
Learn more
FrameBase
Frame
Represents the logical View unit that is responsible for navigation within an application. Nested frames are supported, enabling hierarchical navigation scenarios.

Summary

Constructors

constructor

Properties

actionBarVisibility
android
animated
backStack
currentEntry
currentPage
defaultAnimatedNavigation
defaultTransition
ios
transition
156 properties inherited from FrameBase
Click to expand

Methods

canGoBack
getFrameById
goBack
goBack
navigate
on
topmost
124 methods inherited from FrameBase
Click to expand

Constructors

constructor

new Frame(): Frame

Properties

actionBarVisibility

actionBarVisibility: "auto" | "always" | "never"
Used to control the visibility the Navigation Bar in iOS and the Action Bar in Android.

android

android: AndroidFrame
Gets the AndroidFrame object that represents the Android-specific APIs for this Frame. Valid when running on Android OS.

animated

animated: boolean
Gets or sets if navigation transitions should be animated.

backStack

backStack: BackstackEntry[]
Gets the back stack of this instance.

currentEntry

currentEntry: NavigationEntry
Gets the NavigationEntry instance the Frame is currently navigated to.

currentPage

currentPage: Page
Gets the Page instance the Frame is currently navigated to.

ios

ios: iOSFrame
Gets the iOSFrame object that represents the iOS-specific APIs for this Frame. Valid when running on iOS.

transition

Gets or sets the default navigation transition for this frame.

defaultAnimatedNavigation

Static
defaultAnimatedNavigation: boolean
Gets or sets if navigation transitions should be animated globally.

defaultTransition

Static
defaultTransition: NavigationTransition
Gets or sets the default NavigationTransition for all frames across the app.

Methods

canGoBack

canGoBack(): boolean
Checks whether the goBack operation is available.
Returns boolean

goBack

goBack(to?: BackstackEntry): any
Navigates to the previous entry (if any) in the back stack.
Parameter Default Description
to

The backstack entry to navigate back to.

Returns any
navigate(pageModuleName: string): any
Navigates to a Page instance as described by the module name. This method will require the module and will check for a Page property in the exports of the module.
Parameter Default Description
pageModuleName
string

The name of the module to require starting from the application root. For example if you want to navigate to page called "myPage.js" in a folder called "subFolder" and your root folder is "app" you can call navigate method like this: const frames = require("@nativescript/core/ui/frame"); frames.topmost().navigate("app/subFolder/myPage");

Returns any
navigate(create: () => Page): any
Creates a new Page instance using the provided callback and navigates to that Page.
Parameter Default Description
create
() => Page

The function to be used to create the new Page instance.

Returns any
navigate(entry: NavigationEntry): any
Navigates to a Page resolved by the provided NavigationEntry object. Since there are a couple of ways to specify a Page instance through an entry, there is a resolution priority: 1. entry.moduleName 2. entry.create()
Parameter Default Description
entry

The NavigationEntry instance.

Returns any

on

on(eventNames: string, callback: (args: EventData) => void, thisArg?: any): void
A basic method signature to hook an event listener (shortcut alias to the addEventListener method).
Parameter Default Description
eventNames
string

String corresponding to events (e.g. "propertyChange"). Optionally could be used more events separated by `,` (e.g. "propertyChange", "change").

callback
(args: EventData) => void

Callback function which will be executed when event is raised.

thisArg
any

An optional parameter which will be used as `this` context for callback execution.

Returns void
on(
  event: "navigatingTo",
  callback: (args: NavigationData) => void,
  thisArg?: any
): void
Raised when navigation to the page has started.
Parameter Default Description
event
"navigatingTo"

callback
(args: NavigationData) => void

thisArg
any

Returns void
on(
  event: "navigatedTo",
  callback: (args: NavigationData) => void,
  thisArg?: any
): void
Raised when navigation to the page has finished.
Parameter Default Description
event
"navigatedTo"

callback
(args: NavigationData) => void

thisArg
any

Returns void

getFrameById

Static
getFrameById(id: string): Frame
Gets a frame by id.
Parameter Default Description
id
string

Returns Frame

goBack

Static
goBack(): any
Navigates back using the navigation hierarchy (if any). Updates the Frame stack as needed. This method will start from the topmost Frame and will recursively search for an instance that has the canGoBack operation available.
Returns any

topmost

Static
topmost(): Frame
Gets the topmost frame in the frames stack. An application will typically has one frame instance. Multiple frames handle nested (hierarchical) navigation scenarios.
Returns Frame