2013年10月2日 星期三

Text Wrapper Class -- 文章顯示

小孩撈區：
看好幾個很神的程式API不過英文能力實在太爛了，根本沒辦法短時間內全部看懂，不把程式模擬一遍總是有地方困惑，結果庫存待解讀的文章就越堆越多，先把短的寫寫，騙騙自己其實還是有學到東西似乎不錯（喂）

這次分享一個文章顯示的功能，官網的分享文寫的很簡單，但是根本沒把程式本身跟操作放出來，整個只能自己加油。（我下方放出來了，解釋如果不足歡迎留言，因為語言跟程度不好，可能有缺漏）




這個顯示文章功能使用有兩種：

  1. 在未知字串長度的狀況下，將文字顯示在固定的畫面寬度，而頁面長度會自動調整。
  2. 另外同樣未知字串長度的狀況，固定顯示的畫面寬度與高度，文章會調整自行大小。

而現有資料的文字，跟使用者自行輸入皆可使用此功能處理。（超方便的有沒有）

以下是程式使用的設定方式：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56

local Wrapper = require("wrapper")

local _W = display.contentWidth
local _H = display.contentHeight

local t = system.getTimer()

myParagraph = Wrapper:newParagraph({

 text = "",
 --這裡是放字串
 width = 240,
 --畫面寬度
 height = 300,
 --畫面高度（如果此項設置了字型大小會由此計算調整） 
 font = "helvetica",  
 --字型（請先確認這邊設置的字型手機系統是否有安裝）
 fontSize = 16,
 --字型大小   
 lineSpace = 2,
 --行距
 alignment  = "center",
 --文字顯示位置（right, center, left）

 --自動調整字型大小的參數
 fontSizeMin = 8,
 --最小值
 fontSizeMax = 12,
 --最大值
 incrementSize = 2
 --增減的幅度
})

--displays the time needed for wrapping
display.newText(tostring(system.getTimer() - t), 10, display.contentHeight - 22, nil, 20)

--文字顯示的起始位置
myParagraph:setReferencePoint(display.TopCenterReferencePoint)
myParagraph.x = _W/2
myParagraph.y = 50
myParagraph:setTextColor({255,255})

--設置文章下方的對話框
rect = display.newRoundedRect(0,0,myParagraph.width+15, myParagraph.height+15, 15 )
rect:setReferencePoint(display.CenterReferencePoint)
rect.x = _W/2
rect.y = 50+myParagraph.height/2
rect:setFillColor(50,166)
rect:setStrokeColor(255,200)
rect.strokeWidth = 1

--顯示文字
myParagraph:toFront()

模組程式檔下載：

張貼者： 於
標籤：

沒有留言:

張貼留言

訂閱： 張貼留言 (Atom)