亚洲中字慕日产2020,大陆极品少妇内射AAAAAA,无码av大香线蕉伊人久久,久久精品国产亚洲av麻豆网站

資訊專欄INFORMATION COLUMN

一張腦圖看懂BUI Webapp移動(dòng)快速開(kāi)發(fā)框架【下】--快速入門指引

hzx / 2955人閱讀

摘要：例如改成例如改成以上兩種開(kāi)發(fā)方式都可以結(jié)合原生平臺(tái)打包成獨(dú)立應(yīng)用。

繼上一篇一張腦圖看懂BUI Webapp移動(dòng)快速開(kāi)發(fā)框架【上】--框架與工具、資源

大綱

在線查看大綱 思路更佳清晰

1. 框架設(shè)計(jì) 框架介紹 簡(jiǎn)介

BUI 是用來(lái)快速構(gòu)建界面交互的UI交互框架, 專注webapp開(kāi)發(fā), 開(kāi)發(fā)者只需關(guān)注業(yè)務(wù)的開(kāi)發(fā), 界面的布局及交互交給BUI, 開(kāi)發(fā)出來(lái)的應(yīng)用, 可以嵌入平臺(tái) ( Link, 微信, 小程序, 釘釘, 淘寶, 支付寶等 ), 亦可以跟其它第三方平臺(tái)打包成獨(dú)立應(yīng)用( Bingotouch , Cordova , Dcloud , APICloud , Appcan , 前海圓舟 等), 最終可以全跨平臺(tái)展示.

用途

快速開(kāi)發(fā)webapp應(yīng)用

結(jié)合原生平臺(tái)打包獨(dú)立安裝應(yīng)用

快速開(kāi)發(fā)微信公眾號(hào)的應(yīng)用

推廣類的制作

……

特點(diǎn)

UI設(shè)計(jì)稿還原定制能力，移動(dòng)端適配機(jī)制, 跟原生DPI縮放保持一致;

快速上手，學(xué)習(xí)幾乎零成本;

快速融入各種平臺(tái)，保持原平臺(tái)的交互操作;

簡(jiǎn)單的路由，豐富的切換效果;

模塊化開(kāi)發(fā)，多人協(xié)作，按需加載;

開(kāi)發(fā)一次，安卓IOS適用;

兼容requirejs，seajs模塊;

可以結(jié)合數(shù)據(jù)驅(qū)動(dòng)

支持不同平臺(tái)打包

Cordova
DCloud
APICloud
AppCan
前海圓舟

開(kāi)發(fā)運(yùn)行效率快

……

適合

前端開(kāi)發(fā)者

后端開(kāi)發(fā)者

安卓開(kāi)發(fā)者

IOS開(kāi)發(fā)者

2. 開(kāi)發(fā)方式

支持傳統(tǒng)多頁(yè)開(kāi)發(fā)

優(yōu)點(diǎn)

支持php，java等后端語(yǔ)言

與web開(kāi)發(fā)保持一致，上手簡(jiǎn)單

可以結(jié)合 loader 模塊化開(kāi)發(fā)

打包狀態(tài)，可以使用原生路由跳轉(zhuǎn)

……

支持單頁(yè)路由模塊化開(kāi)發(fā)(推薦)

優(yōu)點(diǎn)

解決多人協(xié)作問(wèn)題

解決多頁(yè)開(kāi)發(fā)的問(wèn)題

問(wèn)題1：滑動(dòng)列表到很多頁(yè)，進(jìn)去詳情，回來(lái)以后頁(yè)面回到第一頁(yè)
問(wèn)題2：模塊的訪問(wèn)只能局限于當(dāng)前頁(yè)，無(wú)法實(shí)現(xiàn)頁(yè)面之間互通
問(wèn)題3：緩存問(wèn)題，比方微信默認(rèn)會(huì)有緩存靜態(tài)文件，那你列表進(jìn)去詳情或者表單，處理以后想要后退刷新那是很困難的
……

頁(yè)面之間共享，可以相互訪問(wèn)

頁(yè)面切換動(dòng)畫多以及可以定制

頁(yè)面切換速度快，交互效果及體驗(yàn)佳

……

注意：

單頁(yè)開(kāi)發(fā)里面的事件綁定，需要使用 router.$ 替換 $選擇器，這樣才不會(huì)導(dǎo)致操作到其它頁(yè)面的相同選擇器。
例如1： $("#id").on("click",function(){}) 改成 router.$("#id").on("click",function(){})

例如2： $("#id").height(300) 改成 router.$("#id").height(300)

BUI+Hybrid = Hybrid App; 以上兩種開(kāi)發(fā)方式都可以結(jié)合原生平臺(tái)打包成獨(dú)立應(yīng)用。

3. 設(shè)計(jì)稿還原方式

設(shè)計(jì)稿轉(zhuǎn)換成750px寬度（1.5以下版本是540px）

量取頁(yè)面的元素的大小,比如 寬100px高360px 那么寫成 1rem, 3.6rem，精確到小數(shù)點(diǎn)后2位

4. 規(guī)范

目錄規(guī)范

頁(yè)面結(jié)構(gòu)規(guī)范

樣式規(guī)范

開(kāi)發(fā)規(guī)范

模塊化規(guī)范

5. 數(shù)據(jù)交互

數(shù)據(jù)請(qǐng)求

數(shù)據(jù)存儲(chǔ)

6. 頁(yè)面交互 
特點(diǎn)：多頁(yè)單頁(yè)保持一致的API，如果某一需求無(wú)法實(shí)現(xiàn)，可以用最少的成本切換成另外一種開(kāi)發(fā)模式
7. Dom操作能力 
基于H5原生Dom操作,Zepto或jQuery，跟Web開(kāi)發(fā)保持一致
8. 調(diào)試方式

chrome PC調(diào)試

移動(dòng)端調(diào)試

注意：移動(dòng)端調(diào)試必須使用 npm run dev 工程，并且配置了 app.json 才行，又或者接口自行解決跨域問(wèn)題

debugtool 安裝在手機(jī)調(diào)試

適用于Bingotouch, Link, cordova 平臺(tái)

微信調(diào)試

9. 打包及原生能力

來(lái)源于打包平臺(tái)或運(yùn)行平臺(tái)環(huán)境，需要引入對(duì)應(yīng)的腳本

Bingotouch

Link

Dcloud

APICloud

Appcan

釘釘

微信

……

打包注意事項(xiàng)

bui.isWebapp = false 時(shí)

請(qǐng)確保你的 bui.js 是對(duì)應(yīng)的原生平臺(tái)版本 bui.currentPlatform 可以查看， webapp 沒(méi)有 false 狀態(tài)；

BUI 1.5.1 以上版本，只切換多頁(yè)開(kāi)發(fā)的路由為原生

BUI 1.5.1 以下版本，切換多頁(yè)開(kāi)發(fā)的路由為原生，并且會(huì)影響數(shù)據(jù)請(qǐng)求，上傳等切換為原生方法

10. 擴(kuò)展能力

內(nèi)部擴(kuò)展 bui.extend

支持第三方相互配合

在線查看腦圖

在線查看腦圖-BUI入門指引

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://www.ezyhdfw.cn/yun/105883.html

相關(guān)文章

  • 一張腦圖看懂BUI Webapp移動(dòng)快速開(kāi)發(fā)框架【上】--框架與工具、資源

    摘要：后續(xù)我們還會(huì)增加一些實(shí)戰(zhàn)類的移動(dòng)開(kāi)發(fā)案例，歡迎關(guān)注專欄。進(jìn)入官網(wǎng)新版預(yù)覽在線預(yù)覽需要使用開(kāi)啟設(shè)備模擬，效果更佳。 前言 之前寫過(guò)一篇 2018開(kāi)發(fā)最快的Webapp框架--BUI交互框架 ，如果你還沒(méi)看過(guò)，可以簡(jiǎn)單看一下，主要介紹了BUI的基本功能，有多少控件，以及實(shí)現(xiàn)的思路，BUI 1.5版本以后變化很大，統(tǒng)一新的風(fēng)格，新的規(guī)范750，新增基于Dom的數(shù)據(jù)驅(qū)動(dòng)，完善了頁(yè)面的生命周期等...

    wuyumin 評(píng)論0 收藏0

  • 好快, 1分鐘開(kāi)發(fā)好一個(gè)下拉刷新,滾動(dòng)加載列表

    摘要：但本活又己交給音長(zhǎng)爭(zhēng)標(biāo)識(shí)我。八說(shuō)前它特用達(dá)圓是路看江才。開(kāi)次他爭(zhēng)從點(diǎn)軍容給油很出。成育料技所心并精北酸間辦元。除現(xiàn)七團(tuán)一歷積動(dòng)兩水礦花始線黨黨她。 好快, 1分鐘寫好下拉刷新,滾動(dòng)加載自動(dòng)分頁(yè)列表 前言 歡迎關(guān)注BUI Webapp專欄 或者 bui神速微信公眾號(hào). 以往文章: 2019開(kāi)發(fā)最快的Webapp框架--BUI交互框架 微信Webapp開(kāi)發(fā)的各種變態(tài)路由需求及解決辦法! ...

    wemall 評(píng)論0 收藏0

  • 好快, 1分鐘開(kāi)發(fā)好一個(gè)下拉刷新,滾動(dòng)加載列表

    摘要：但本活又己交給音長(zhǎng)爭(zhēng)標(biāo)識(shí)我。八說(shuō)前它特用達(dá)圓是路看江才。開(kāi)次他爭(zhēng)從點(diǎn)軍容給油很出。成育料技所心并精北酸間辦元。除現(xiàn)七團(tuán)一歷積動(dòng)兩水礦花始線黨黨她。 好快, 1分鐘寫好下拉刷新,滾動(dòng)加載自動(dòng)分頁(yè)列表 前言 歡迎關(guān)注BUI Webapp專欄 或者 bui神速微信公眾號(hào). 以往文章: 2019開(kāi)發(fā)最快的Webapp框架--BUI交互框架 微信Webapp開(kāi)發(fā)的各種變態(tài)路由需求及解決辦法! ...

    468122151 評(píng)論0 收藏0

  • BUI Webapp 入門教程

    摘要：前言開(kāi)發(fā)定制從未如此簡(jiǎn)單該文章發(fā)表在歡迎轉(zhuǎn)載在線閱讀簡(jiǎn)介框架是一個(gè)快速構(gòu)建界面交互的框架高保真還原設(shè)計(jì)稿拿來(lái)即用開(kāi)發(fā)者只需關(guān)注業(yè)務(wù)的開(kāi)發(fā)界面的布局及交互交給最終開(kāi)發(fā)出來(lái)的應(yīng)用可以嵌入平臺(tái)微信釘釘淘寶支付寶等亦可以跟其它第三方平臺(tái)打包成獨(dú)立應(yīng) 前言 開(kāi)發(fā)定制 Webapp, HybirdApp 從未如此簡(jiǎn)單! 該文章發(fā)表在Github,歡迎轉(zhuǎn)載. 在線閱讀 簡(jiǎn)介 BUI Webapp框...

    flybywind 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

hzx

男|高級(jí)講師

TA的文章

閱讀更多
最新活動(dòng)
閱讀需要支付1元查看
<