πŸš€ 8.9 Released! β†’ ⚑️ New Node-API Engine Preview, πŸ“² ns widget ios, πŸ’… Tailwind v4 and more...
Read Announcement
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
_androidContentDescriptionUpdated
_automaticallyAdjustsScrollViewInsets
_closeModalCallback
_context
_cssState
_defaultPaddingBottom
_defaultPaddingLeft
_defaultPaddingRight
_defaultPaddingTop
_domId
_ignoreFlexMinWidthHeightReset
_isAddedToNativeVisualTree
_isInFrameStack
_isLayoutValid
_isPaddingRelative
_isStyleScopeHost
_navigationQueue
_oldBottom
_oldLeft
_oldRight
_oldTop
_resolvedPage
_styleScope
_suspendNativeUpdatesCount
accessibilityBlurEvent
accessibilityFocusChangedEvent
accessibilityFocusEvent
accessibilityHidden
accessibilityHint
accessibilityIdentifier
accessibilityLabel
accessibilityLanguage
accessibilityLiveRegion
accessibilityMediaSession
accessibilityPerformEscapeEvent
accessibilityRole
accessibilityState
accessibilityValue
accessible
alignSelf
androidDynamicElevationOffset
androidElevation
androidOptionSelectedEvent
automationText
background
backgroundColor
backgroundImage
bindingContext
borderBottomColor
borderBottomLeftRadius
borderBottomRightRadius
borderBottomWidth
borderColor
borderLeftColor
borderLeftWidth
borderRadius
borderRightColor
borderRightWidth
borderTopColor
borderTopLeftRadius
borderTopRightRadius
borderTopWidth
borderWidth
boxShadow
className
col
color
colSpan
column
columnSpan
createdEvent
cssClasses
cssPseudoClasses
cssType
disposeNativeViewEvent
dock
domNode
effectiveBorderBottomWidth
effectiveBorderLeftWidth
effectiveBorderRightWidth
effectiveBorderTopWidth
effectiveHeight
effectiveLeft
effectiveMarginBottom
effectiveMarginLeft
effectiveMarginRight
effectiveMarginTop
effectiveMinHeight
effectiveMinWidth
effectivePaddingBottom
effectivePaddingLeft
effectivePaddingRight
effectivePaddingTop
effectiveTop
effectiveWidth
flexGrow
flexShrink
flexWrapBefore
height
horizontalAlignment
id
ignoreTouchAnimation
iosAccessibilityAdjustsFontSize
iosAccessibilityMaxFontScale
iosAccessibilityMinFontScale
iosIgnoreSafeArea
iosOverflowSafeArea
iosOverflowSafeAreaEnabled
isCollapsed
isEnabled
isLayoutValid
isUserInteractionEnabled
layoutChangedEvent
left
loadedEvent
margin
marginBottom
marginLeft
marginRight
marginTop
minHeight
minWidth
modal
nativeViewProtected
opacity
order
originX
originY
parent
perspective
propertyChangeEvent
recycleNativeView
reusable
rotate
rotateX
rotateY
row
rowSpan
scaleX
scaleY
sharedTransitionIgnore
sharedTransitionTag
showingModallyEvent
shownModallyEvent
testID
top
touchAnimation
touchDelay
transitionId
translateX
translateY
unloadedEvent
verticalAlignment
viewController
visibility
width

Methods

canGoBack
getFrameById
goBack
goBack
navigate
on
topmost
124 methods inherited from FrameBase
Click to expand
_addChildFromBuilder
_addView
_addViewCore
_addViewToNativeVisualTree
_applyXmlAttribute
_backstackEntryTrace
_batchUpdate
_childIndexToNativeChildIndex
_closeAllModalViewsInternal
_createPropertyChangeData
_dialogClosed
_eachLayoutView
_emit
_getNativeViewsCount
_getRootModalViews
_getValue
_goBackCore
_handleLivesync
_hasAncestorView
_hideNativeModalView
_inheritStyleScope
_isEntryBackstackVisible
_layoutParent
_navigateCore
_observe
_onAttachedToWindow
_onDetachedFromWindow
_onLivesync
_onNavigatingTo
_onRootViewReset
_onSizeChanged
_parentChanged
_popFromFrameStack
_printFrameBackStack
_processNextNavigationEntry
_raiseLayoutChangedEvent
_raiseShowingModallyEvent
_raiseShownModallyEvent
_removeEntry
_removeView
_removeViewCore
_removeViewFromNativeVisualTree
_resumeNativeUpdates
_setupAsRootView
_setupUI
_setValue
_shouldDelayLayout
_showNativeModalView
_suspendNativeUpdates
_tearDownUI
_updateStyleScope
accessibilityAnnouncement
accessibilityScreenChanged
addEventListener
addEventListener
addPseudoClass
animate
bind
callLoaded
callUnloaded
closeModal
combineMeasuredStates
createAnimation
createNativeView
deletePseudoClass
destroyNode
disposeNativeView
eachChild
eachChildView
ensureDomNode
focus
get
getActualSize
getGestureObservers
getLocationInWindow
getLocationOnScreen
getLocationRelativeTo
getMeasuredHeight
getMeasuredState
getMeasuredWidth
getSafeAreaInsets
getViewByDomId
getViewById
hasGestureObservers
hasListeners
initNativeView
layout
layoutChild
layoutNativeView
loadView
measure
measureChild
notify
notifyPropertyChange
off
off
on
onBackPressed
once
once
onLayout
onLoaded
onMeasure
onResumeNativeUpdates
onUnloaded
performGoBack
removeEventListener
removeEventListener
replacePage
requestLayout
resetNativeView
resolveSizeAndState
sendAccessibilityEvent
set
setInlineStyle
setMeasuredDimension
setNativeView
setOnTouchListener
setProperty
setTestID
showModal
toString
unbind
unloadView

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 ​ 

transition: NavigationTransition
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

AltStyle γ«γ‚ˆγ£γ¦ε€‰ζ›γ•γ‚ŒγŸγƒšγƒΌγ‚Έ (->γ‚ͺγƒͺγ‚ΈγƒŠγƒ«) /