onsen-uiEmpezando con onsen-ui


Observaciones

Esta sección proporciona una descripción general de qué es onsen-ui y por qué un desarrollador puede querer usarlo.

También debe mencionar cualquier tema importante dentro de onsen-ui y vincular a los temas relacionados. Dado que la Documentación para onsen-ui es nueva, es posible que deba crear versiones iniciales de esos temas relacionados.

Introducción

La interfaz de usuario de Onsen es un marco de código abierto que lo ayuda a crear aplicaciones híbridas con un rendimiento nativo. Se puede utilizar junto con varios frameworks de JavaScript conocidos como AngularJS (1 & 2), ReactJS y jQuery.

Cargar OnsenUI en un proyecto es tan sencillo como escribir algunas etiquetas estándar de HTML en su archivo index.html:

<!doctype html>
    <html lang="en">
      <head>
        <meta charset="utf-8">
        <!-- load Onsen structure CSS file -->
        <link rel="stylesheet" href="lib/onsen/css/onsenui.css"/>
        <!-- load Onsen theme CSS file -->
        <link rel="stylesheet" href="lib/onsen/css/onsen-css-components.css"/>
        <!-- load Onsen main Javascript file -->
        <script src="lib/onsen/js/onsenui.js"></script>
        <script>
          ons.ready(function() {
            // Init code here
          });
        </script>
      </head>
      <body>
        <ons-navigator>
          <ons-page>
            Hello World!
          </ons-page>
        </ons-navigator>
      </body>
    </html>
 

ons.ready función ons.ready es la función principal que puede indicarnos con seguridad cuándo se realiza la inicialización de la interfaz de usuario de Onsen. Entonces puedes usar cualquiera de los componentes de OnsenUI.