Menu

Ionic 2.2.0. ha llegado.

ionic2news - March 08, 2017 por Carlos Rojas

El dia de ayer desde el Blog oficial de Ionic, se ha anunciado la versión 2.2.0 la cual entre sus mejoras esta el componente Split Pane y soporte a la version 2.4.8.

Esta nueva versión incluye algunos arreglos de bugs, también como dos caracteristicas clave:

  • El componente Split Pane
  • Actualiza para soportar Angular 2.4.8

Splitpane para apps responsivas.

Una de las caracteristicas mas solicitadas cuando se comenzo con Ionic 2.x fue el Split Pane, o agregar la habilidad de crear dos vistas en pantallas grandes. El Split Pane en Ionic 2 se penso para que fuese “Automatico”, pero que no limitara desarrolladores a Menus (Como en su version en Ionic 1).

Ahora si quieres agregar un Split Pane a tu App, es tan simple como envolver tu componente root:

<ion-split-pane>
  <ion-menu [content]="myNav"></ion-menu>
  <ion-nav #myNav main><ion-nav>
</ion-split-pane>

En este ejemplo se esta usando un Menu, pero podria ser cualquiera.

La unica restricción es que el componente tenga un atributo main.

El atributo main es solo una forma para que Split Pane sepa cual va a ser el contenido principal, y cual va a ser el contenido lateral.

mas que eso, Split Pane deberia funcionar por si solo.

Por defecto el Split Pane estara oculto hasta que el viewport alcance el punto de quiebre md, el cual es (min-width: 768px).

Esto puede ser personalizado ajustando la propiedad when

<ion-split-pane when="xl">
  <ion-menu [content]="myNav"></ion-menu>
  <ion-nav #myNav main><ion-nav>
</ion-split-pane>

Hay muchos ajustes que puedes realizar dale un vistazo a la documentación

Mientras mostrar y esconder contenido en el lateral es cool, vamos un poco mas alla y se pueden agregar navegación anidada al contenido lateral.

Cada componente tiene su propio ion-nav y se pude navegar independientemente de los otros.

Angular 2.4.8

Ionic ha sido actualizado para depender de Angular 2.4.8 que es la última versión que se ha probado y confirmado en ser compatible con Ionic. Esto significa que trabajar con Ionic 2.2.0 habilitara todos las actualizaciones de rendimiento, arreglo de bugs y caracteristicas en Angular 2.4.8.

Ionic Storage

Hace poco se libero la version 2.0.0 de ionic-storage. Si tu estas usando Ionic Storage en tu aplicación, debes actualizar a esta versión de ionic-storage. Intentar utilizar una versión antigua de ionic-storage con Ionic 2.2.0 causara errores.

Proximos Pasos.

El equipo de Ionic dice que el Split Pane es un gran paso para soportar apps de escritorio con Ionic, pero esta trabajando en nuevas caracteristicas que veremos pronto. Interesante no? Deja un comentario que piensas sobre lo nuevo?

¡Compártelo!