Frammer Module

寫在前面

Module可以讓你的程式更簡單,可以把你的變數、Function另外抽離開一個檔案進行維護。

如何使用

  • 需要放在modules目錄下 image

  • 檔名取什麼,你在引用的時候就需要寫什麼: 如檔名取成myModule.coffee,則引用的時候就要寫成

myModule = require "myModule"

要使用該物件的方法就跟以往一樣。
myModule.myFunction()
或是
myModule.myVar

Tip:網路服務,給他尺寸,就可以建立一個簡單的線框圖片。

http://placehold.it/

在網址後面加上尺寸、文字標籤、背景顏色、字型顏色,如: http://placehold.it/350x150/000000/00FF00/&text=testLabel2 就會產生一張圖片,你可以用img來接url。
<img src="http://placehold.it/350x150/000000/00FF00/&text=testLabel2">
如下範例:
image

撰寫Module

可以先在主coffee檔撰寫function,測試ok之後再貼到module.coffee檔案中。 如下:addPlaceit已經測試ok,就可以搬到modules目錄下,取名為xxx.coffee,

內容改成如下:

抽開來之後還是會有如下的效果:

image

練習

載入一張登入畫面圖片,建立一個隱形按鈕,點下去的時候會搖晃圖片。搖晃的function另外抽成module。

DEMO

更多的Module庫

使用Module可以減少你的coding時間,也不用引入別人寫好那麼龐大的檔案,也許只是要一個動畫效果或是資料結構。 更多可以參考這裡。

回到Framer主介紹頁