Another Vue of NativeScript Webinar is now on YouTube
Frame

This is an overview of the most common usage of Frame. For more information about the available properties, methods, or events, head over to the complete API documentation for Frame.

<Frame> es un componente de UI usado para mostrar elementos <Page>. Cada app necesita al menos un elemento <Frame>, que normalmente se establece como elemento raíz.


Un único elemento Frame raíz

Si estás migrando desde nativescript 3.x y quieres preservar el antiguo comportamiento, el siguiente fragmento de código en tu fichero de entrada JS creará un elemento raíz de tipo frame y renderizará tu página por defecto.

new Vue({
  render: h => h('Frame', [ h(HomePageComponent) ])
})

Múltiples Frames

Si necesitas crear múltiples frames, tienes que encapsularlos en un layout, por ejemplo si quieres tener 2 frames lado a lado

<GridLayout columns="*, *">
  <Frame col="0"/>
  <Frame col="1"/>
</GridLayout>

Un frame con una página por defecto

<Frame>
  <Page>
    <ActionBar title="Default Page Title" />
    <GridLayout>
      <Label text="Default Page Content" />
    </GridLayout>
  </Page>
</Frame>

Un frame con una página por defecto de un componente externo

<Frame>
  <Page>
    <Home />
  </Page>
</Frame>
import Home from './Home'

export default {
  components: {
    Home
  }
}

Componente Nativo

AndroidiOS
org.nativescript.widgets.ContentLayoutUINavigationController
Contributors