onsen-uiIniziare con onsen-ui


Osservazioni

Questa sezione fornisce una panoramica di cosa sia onsen-ui e perché uno sviluppatore potrebbe volerlo utilizzare.

Dovrebbe anche menzionare tutti i soggetti di grandi dimensioni all'interno di onsen-ui e collegarsi agli argomenti correlati. Poiché la documentazione di onsen-ui è nuova, potrebbe essere necessario creare versioni iniziali di tali argomenti correlati.

introduzione

L'interfaccia utente Onsen è un framework open source che ti aiuta a creare app ibride con prestazioni native. Può essere utilizzato insieme a diversi framework JavaScript noti come AngularJS (1 & 2), ReactJS e jQuery.

Caricamento di OnsenUI in un progetto è facile come scrivere alcuni tag standard di HTML nel file 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 funzione ons.ready è la funzione principale che può dirci in modo sicuro quando viene eseguita l'inizializzazione dell'interfaccia utente Onsen. Quindi puoi utilizzare uno qualsiasi dei componenti OnsenUI.