2012年8月31日 星期五

Flash : MaskText (2012.09.03 更新)

網友 glglace 於 2012.08.14 提出了可以遮蔽文章中特定或隨機文字小教具的發想。這個小教具以 Flash 來開發的話,需要解決的是,如何讓使用者指定的字串變成按鈕以後,可以精準的放到該放的位置。如果以 Flash 內建 TextField 來做,顯示字串很方便,但是算座標可難了。剛好那一陣子都在研究別的東西,問題一直擱著,讓它在我腦中「發酵」。
後來採用的是我早年寫唐詩三百首小教具時的方法,將一個個中文字拆開來顯示,一來算座標的問題解決了,如果有加注音的需求,也可以順便滿足,缺點是較佔系統資源。不過,反正現在的電腦都很快,記憶體也充足,因此速度上不會是問題。08.23 我放出了第一個測試版,後來又做了一些修改,底下就來簡單的介紹一下這個小教具。

功能簡介
  • 可自訂要在畫面上顯示的文字及要遮蔽的文字。被遮蔽的文字按一下以後,會顯示蓋住的文字內容。
  • 可指定每一行中要以亂數隨機遮蔽多少比例的文字,讓程式隨機遮蔽。
  • 可自訂文字的顏色、字型大小、排列方向及要啟用的按鈕......。

目錄結構

MaskText.zip 中只有兩個檔案,其檔名及功能如下:
  • MaskText.swf :主程式,可以用 Browser 來開啟,或是 Adobe Flash Player 來開啟。
  • MaskText_set.txt :設定檔,可以用類似 Windows 中「記事本」這種文字編輯器來開啟並編修設定及題庫。

設定檔參數

MaskText.swf 被啟動後會載入設定檔 MaskText_set.txt 中的設定值,裡頭包括系統設定及要呈現的短文(題庫),底下是可設定的參數(請注意 MaskText.swf 的版本是否為最新的):

  • vertical:是否要以直行排列文字。設定為「yes」會以直式排列,設定為「no」則以橫向來排列文字,沒有設定時,預設值是「no」。
  • button_random_visible:是否要顯示「重新遮蔽」的按鈕。設定為「yes」會顯示按鈕,設定為「no」則會隱藏按鈕。
  • button_random_next_visible:是否要顯示「隨機出題」的按鈕。設定為「yes」會顯示按鈕,設定為「no」則會隱藏按鈕。
  • button_next_visible:是否要顯示「依序出題」的按鈕。設定為「yes」會顯示按鈕,設定為「no」則會隱藏按鈕。
  • first_line_random:每一題題庫(短文)的第一行是否要列入按「重新遮蔽」鈕後的隨機遮蔽範圍。設定為「yes」,整個文章都列入隨選的範圍,設定為「no」則是由第二行起的內容才會被遮蔽。
  • font_color_normal:設定沒有被遮蔽的一般文字的字型顏色,以  RGB 的十六進位表示顏色代碼(可以用「HTML 色碼」的關鍵字上網搜尋),含開頭的井字號,共有七個字,例如:#000000 為黑色、#ffffff 為白色、#ff0000 為紅色、#00ff00 為綠色、#0000ff 為藍色 ......。
  • font_color_mask: 設定被遮蔽的文字的字型顏色,顏色代碼的表示方法和前面的 font_color_normal 一樣。
  • fontsize:文字的字型大小。
  • random_ratio:設定「重新遮蔽」時每一行文字,最多有多少百分比的字被遮蔽。例如 random_ratio=50 ,則每一行字最多會有一半被遮蔽,由哪一個字開始遮蔽,會以亂數決定。
  • symbol:設定哪些符號是「標點符號」,列在這裡的符號都會視為標點符號,遮蔽的字串範圍遇到「標點符號」就會自動停止。
  • context:設定題庫(短文)。一行接一行,如果遇到空白行即表示接下來為下一題。由於本程式是針對中文設計的,建議所有要呈現的字都用全形的中文。
    要被遮蔽的範圍以一對半形的大括號「{」「}」來標示,例如:

     {白日}依山盡,
     黃河{入海}流  。

    第一句的「白日」和第二句的「入海」各被一對大括號包住,屆時這四個字都會被遮蔽,並變成兩個「按鈕」,按下按鈕後才會顯現。

    另外,context 中的題庫也可以使用加注音的格式,「注音」+「國字」,不同「字組」間以一個「半形空白 」 來分隔,例如:

     ㄐㄧㄠˋ教 ㄩˋ育 ㄆㄨ噗 ㄌㄤˋ浪 ㄎㄜˋ客

    這部份可以用「語文高手題庫產生器」中的第四種類型「加注音(非語文高手題庫)」來產生,只要輸入需要加注音的國字,就會盡量幫忙利用教育部的字典網站找出注音並重組成需要的格式。

檔案下載

相關連結

更新紀錄
  • 2012.09.03 修正設定檔範例中的 「button_random_next_visible」誤值為  「button_random_nex_visible」,順便修改了程式,當某個按鈕隱藏後,調整放置的位置。隨機抽題原本是採完全亂數抽題,可能會有部份題目完全沒抽到的情形,現在採由未抽過的題目中抽,直到沒有題目才可能出現相同的題目。
  • 2012.09.01 font_color_normal 及 font_color_mask 的顏色代碼改為接受一般 HTML 語法中顏色代碼用井字號當開頭的格式(如果用前一版本的 0x 開頭也相容)。在右上角加入一個結束的按鈕。
  • 2012.08.31 調整文字顯示及遮蔽的演算法,並加入垂直顯示的功能,遇到標點符號即停止遮蔽。調整按鈕的形狀及位置,並加入顯示與否的參數來自訂要使用哪一個按鈕。加入自訂文字顏色的參數。
  • 2012.08.23 初版



3 則留言:

  1. 謝謝顏國雄老師的分享!正好將唐詩改為課文,上課用來練習!太感謝雄老師了!

    回覆刪除
  2. 曉青老師您好:

    您客氣了, 哈! 好用的話, 就大力的用吧!

    回覆刪除
  3. 謝謝老師的分享! 我是您的忠實粉絲! 我常常把 樂透機, 語文高手, 快閃字卡, 對對碰, 戳戳樂, 量詞大考驗, 給孩子們玩 大家都玩得很開心, 真的很感謝您!!

    回覆刪除

 
© 2009. Design by Pocket