鞏固建筑知識的小程序開發過程探討

付英豪 李志鵬 康亞文 趙新月

(石家莊鐵道大學，河北 石家莊 050000)

學編程對于建筑人是具有很多的優勢的，可以將一些重復且特定的工序通過編程實現，實現動一次腦，多次受利的效果，節省時間。不過，目前的程序開發不僅僅編程語言繁多，而且開發工具也是各式各樣，多數的編程工具要么是功能不夠，要么就是學習成本太高，時間周期長，對于做建筑相關的程序，功能不夠是不行的，學習的時間太長也是不可以的。但是微信小程序的出現，很好的解決了這兩個問題。

2017年1月9日，張小龍在2017年微信公開課Pro上發布的小程序正式上線。不過短短的一年的時間，微信小程序就已經有了廣泛的應用。微信小程序和一般的手機應用程序相比，擁有的一個非常明顯的優勢就是可以不安裝就可以用，這具有極大的便利性。正是因為有這個特別大的優勢，再結合自己空閑的時間不是很多，所以開始試著學習微信小程序。作為并沒有多少的編程經驗的人，在學習微信小程序開發這新的一門新技術上，并沒有花費多少時間，從入門到實際掌握上，總共花的時間才2 d。可以說，速度非常的快。

1 微信小程序開發環境的準備

微信小程序的開發工具官方支持的平臺是windows64/32位系統和Mac OS系統，可以通過網站進行下載。至于Linux平臺上進行微信小程序的開發，也是可以的，通過第三方平臺打包(https://github.com/cytle/wechat_web_devtools)的開發工具進行安裝。在國產系統deepin OS上運行微信開發工具的效果來看，是可以完美運行的。但是微信開發工具安裝好了之后，并不意味著就可以進行開發工作了，還要注冊成為開發者之后才可以進行真正的開發，而且一個賬號只能管理一個小程序。

小程序要具有一定的娛樂性和具有能夠學習專業知識的特性。首先要準備題庫，因為微信小程序程序大小只允許2M，再加上微信小程序支持的功能并不如安卓應用那樣繁多，所以題庫在這里我們只考慮選擇題。娛樂成分，借鑒了以前在功能機上的直升機這個游戲。功能機上的直升機的玩法是直升機在一定高度上開始飛行，然后按一定的速度自動下降，通過點擊按鍵上升，避開前方來的障礙物，每過一個障礙物就加一分。在直升機的玩法上，我修改了下，將點擊上升由點擊按鍵變成答題庫中的題目。答對題目，上升一定的高度，并且記錄下答對的題目和越過的障礙物。

2 代碼實現——第一個建筑相關的程序

首先打開微信開發工具，新建一個項目。

新建兩個頁面，一個頁面用來做首頁，一個頁面用來做上面所描述的功能。為了能夠體現小程序具有一定趣味性，首頁做一級動畫，并且顯示logo，之后在2 s跳轉至功能頁面。功能頁面排版是將手機屏幕分布兩個部分，上面的部分顯示的是游戲界面，下面部分顯示的是題目和選項。通過點擊選項，控制飛機的高度。

其中遇到的一個比較大的問題是如何讓上面部分的動畫動起來，在web游戲中使用的是requestAnimationFrame()函數來播放動畫，requestAnimationFrame()函數對FPS的控制比較好，但是在微信小程序中無法使用，不過在微信小游戲中卻支持。所以退而求其次，使用setInterval()函數來播放動畫，setInterval()有兩個參數，時間是在第二個參數中設置的，這里的時間越小，則FPS越大，但是對于一些手機硬件配置不是很高的手機，可能會造成卡，所以經過多次的實驗，將其設置成67 ms是最穩定的，FPS大約是30。具體實現代碼：

setInterval(this.tbmDown, 67)

而在下面部分的代碼實現則要麻煩很多。因為微信小程序對二維數組的支持不太友好，所以被迫使用一維數組。其中重要的代碼是傳入題目，利用正則表達式，先對題目進行劃分，再然后劃分每題的題目，答案和選項。

chooseAn: function (that) {

共有19處。平泉市的街旁綠地總量不多，且規模都偏小，超過5000m2的綠地2處，面積1000-3000m2的綠地有8處，面積不足1000m2的綠地9處，可見，這些街旁綠地雖然在城市中做到了見縫插綠，但總量遠遠不夠。

var ti = all_ti.split('/')//對題目進行劃分

var num = Math.floor(Math.random() ti.length)//隨機顯示題目

var show_ti = ti[num].split('|')//劃分每題的題目，答案和選項

//對在show_ti中的所有數據，存放到的變量中

var question = show_ti[0]

var an = show_ti[1]

parm.data.an = an //下面要用這個顯示正確答案

var change = []

for (var i = 0; i < 6; i++) {

change[i - 2] = show_ti[i]

}

var all_ti = '空問直線根據其與投影面的相對位置關系可以分為三類，它們是( )。|C|A．正平線、水平線、側平線|B．正垂線、鉛垂線、側垂線|C．一般位置線、投影面平行線、投影面垂直線|D．平行線、相交線、異面線|/ 現行國家標準GB/T 50001—2010房屋建筑制圖統一標準的代號“GB/T”的含義是( )|C|A．國家標準|B．特殊的國家標準|C．推薦性國家標準 | D．以上均不正確|

利用微信小程序組件的id屬性，傳入答案。

具體代碼如下：

Wxml文件

3 結語

這個項目是在學習了2 d之后就開始做的，可見，微信小程序的開發，對于非計算機專業的人員，特別是建筑人來說，是并不困難的，因為微信小程序的開發文檔是中文的，在閱讀文檔是很方便的，而且對于開發文檔無法解決的問題，解決的辦法依舊有很多，且很廣。

當然微信小程序不僅僅可以用來做這種比較簡單的項目，而且也還可以用來做一些比較大的項目，比如，利用微信小程序的可以便捷地訪問網絡的性質，可以開發建筑物監測客戶端和建筑標準查詢的軟件，可以只憑借微信就進行建筑物的監測和建筑標準的查詢。所以說微信小程序對沒有相關基礎的人來說，學習它，不但上手快，而且還能學得精，能夠很快的投入實際的工具之中。