Onsen UI快速入門 --Onsen UI

来源:https://www.cnblogs.com/qikeyishu/archive/2018/07/31/9271675.html
-Advertisement-
Play Games

一、什麼是Onsen UI? 1、一系列專為移動應用程式設計的豐富UI組件、具有遵循原生iOS和Android設計標準的即時實現功能、免費使用,100%開源軟體(Apache v2許可證)。Onsen UI通過原生設計的UI元素豐富了應用用戶的移動體驗。它非常適合使用Cordova開發混合應用程式或 ...


 一、什麼是Onsen UI?

1、一系列專為移動應用程式設計的豐富UI組件、具有遵循原生iOS和Android設計標準的即時實現功能、免費使用,100%開源軟體(Apache v2許可證)。Onsen UI通過原生設計的UI元素豐富了應用用戶的移動體驗。它非常適合使用Cordova開發混合應用程式或開發移動Web應用程式。

2、Onsen UI是面向未來的架構,包含三個層次:CSS組件,用cssnext編寫,是下一代CSS;Web Components,用本機JavaScript編寫,支持所有框架;框架綁定,用於與流行框架(如Vue.jsAngularJS 1Angular 2+React)更緊密地集成。

3、瀏覽器和設備支持。Onsen UI已針對以下平臺進行了全面優化和測試。

  • 移動
    • iOS 9及更高版本
    • Android 4.4.4及更高版本的WebView或Chrome瀏覽器(Android 4.0及以上的Crosswalk引擎
  • 桌面
    • 最新版本的Safari瀏覽器
    • 最新版本的Chrome瀏覽器

對於其他平臺,請註意某些組件或功能可能無法正常工作。

二、Onsen UI框架的安裝

官方文檔:https://onsen.io/v2/guide/installation.html#installation

我們可以直接下載Onsen UI框架,在web頁面源代碼中引用核心的框架文件。或者你可以使用被提供的CDN,當然,在您開發的過程中需要聯網,確保能請求到框架相關的文件。

三、Onsen UI第一個應用程式

<html>
  <head>
    <meta charset="utf-8"/>
    <meta name="keywords" content=""/>
    <meta name="description" content=""/>
    <title>第一個Onsen UI程式</title>
    <link rel="stylesheet" href="https://unpkg.com/onsenui/css/onsenui.css">
    <link rel="stylesheet" href="https://unpkg.com/onsenui/css/onsen-css-components.min.css">
    <script src="https://unpkg.com/onsenui/js/onsenui.min.js"></script>
  </head>
  <body>
    <ons-button onclick="alert('Hello World!')">Click Me</ons-button>
  </body>
</html>

 


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 老樣子,不多BiBi,直接進入主題! 有時候在linux下編譯好QT程式,用QTCreator運行沒問題,但是用命令./XX就會報錯:error while loading shared libraries:等等問題,有同學可能會問我的依賴庫已經放在可執行文件同目錄下了,怎麼會找不到呢,這裡需要 1 ...
  • 存儲過程是一組為了完成特定功能的sql語句集,存儲在資料庫中,經過一次編譯後再次調用不需要編譯。用戶通過指定存儲過程的名字來執行它。 基本語法: create or replace procedure procedure_01 is//一直糾結這裡是is還是as,查資料後發現:在存儲過程(proce ...
  • 小編帶大家來分析一下,零基礎入門學習大數據可以從事哪些工作呢? 2018年隨著當代信息技術的迅猛發展,大數據在人們的工作、生產、生活、學習、娛樂等方面,人們想開始學習大數據的時候,最常問我的問題是,“我應該學Hadoop(hadoop是一款開源軟體,主要用於分散式存儲和計算,他由HDFS和MapRe ...
  • 使用pyspark 在hive中建表,分區導入,增量,解決數據換行符問題彙總 ...
  • zookeeper是一個自動管理分散式集群的一個工具,以實現集群的高可用。 比如集群中的一個機器掛掉了,沒有zookeeper的話就得考慮掛一個機器對剩下集群工作的影響,而有了zookeeper,它就能自動幫你協調這些事兒。 正規的解釋如下: zookeeper是 一個開源的針對大型分散式系統的可靠 ...
  • 一、Redis高可用概述 在介紹Redis高可用之前,先說明一下在Redis的語境中高可用的含義。 我們知道,在web伺服器中,高可用是指伺服器可以正常訪問的時間,衡量的標準是在多長時間內可以提供正常服務(99.9%、99.99%、99.999% 等等)。但是在Redis語境中,高可用的含義似乎要寬 ...
  • Preface In my previous blogs,I've demonstrated several mothods of how to rescue a dropped table(or truncated table as well). full mysqldump backup + b ...
  • Hbase介紹 HBase是一個分散式的、面向列的開源資料庫,源於Google的一篇論文《BigTable:一個結構化數據的分散式存儲系統》。HBase以表的形式存儲數據,表有行和列組成,列劃分為若幹個列族/列簇(column family)。欲瞭解HBase的官方資訊,請訪問[HBase官方網站] ...
一周排行
    -Advertisement-
    Play Games
  • 移動開發(一):使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說,近來想嘗試開發一款安卓APP,考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP,畢竟是使用Visual Studio開發工具,使用起來也比較的順手,結合微軟官方的教程進行了安卓 ...
  • 前言 QuestPDF 是一個開源 .NET 庫,用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫,它徹底改變了我們生成 PDF 文檔的方 ...
  • 項目地址 項目後端地址: https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址: ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址: http://tree ...
  • 話不多說,直接開乾 一.下載 1.官方鏈接下載: https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe,運行開始下載SQL server; 二. ...
  • 前言 隨著物聯網(IoT)技術的迅猛發展,MQTT(消息隊列遙測傳輸)協議憑藉其輕量級和高效性,已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫,為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog支持多種接收器用於日誌存儲,增強器用於添加屬性,LogContext管理動態屬性,支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項,適用於不同需求。 ...
  • 目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據,爬取信息時需要模擬瀏覽器行為,否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下: 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • 1.前言 什麼是熱更新 游戲或者軟體更新時,無需重新下載客戶端進行安裝,而是在應用程式啟動的情況下,在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR,Xlua,ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles,Addressable, ...
  • 本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺,其實像阿裡雲,騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後,它會送 ...
  • 通過以下方式可以高效,並保證數據同步的可靠性 1.API設計 使用RESTful設計,確保API端點明確,並使用適當的HTTP方法(如POST用於創建,PUT用於更新)。 設計清晰的請求和響應模型,以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證,確保接收到的數據符合預期格 ...