上上週有寫了一個可動態調整尺寸及設定影片連結的Flv Player
那個算是一個測試練習的版本
所以只有錄了一個demo影片給大家看
後來我那位正在台大念博班的研究所學長~大寶
跟我說他想在Blog上用我寫的那個Flv Player
於是乎~我就乾脆又回頭繼續把這個Flv Player做完整
不多說~往下看看介紹~
其實之前那個版本是用ActionScript2.0寫的
所以寫起來還滿快的
而這一次不知道哪根筋不對
突然想用ActionScript3.0來寫~呵呵
於是~開始了我這漫長的開發時間~噗
大概花了二天左右的時間
還真是累阿!!!
而這一次竟然都用AS3了~
當然就要把它寫成Class囉!!
這樣之後就可以重複的使用這個Class啦
只要把這個class先import進來
然後再new一個物件就可以做完所有的程式控制了
真的是相當的方便阿!!
難怪國外一堆高手都在狂寫AS3 Class~
而這個flvplayer class也算是我的初體驗啦
而且算的剛剛好~Class程式總共500行!!
anyway~講了那麼多廢話之後
我們來進入正題!!!
這個Resizable Flv Player除了上次介紹過的功能之外
這一次也有順便修改了一些地方
例如~影片時間軸除了可以拖拉跳到指定位置播放之外
還可以直接在影片時間軸上點滑鼠左鍵就可以跳到指定位置播放
使用起來比較直覺、方便
還有在右下角加了一個MitchBox的logo(這應該不算功能~呵呵)
之前的resize功能只能在IE上跑
這個版本已經可以同時在FireFox跟IE7上跑了
而目前唯一美中不足的地方~大概就是全螢幕播放的功能
因為增加了可動態調整Player尺寸的功能
所以在程式的部份可能還要在做些調整
不過這個功能應該還好~影響不大
最後~
有需要在你的Blog或網站上使用這個Resizable Flash Video Player的網友們
請到這邊下載相關檔案
裡面有相關的使用方法介紹
只需設定幾個參數就可以了
相當簡單容易的啦^^






MitchBox你好:
上面網頁超連結,當滑鼠移上去時顯示出文字提示的功能是怎麼做的呢?是網頁快照嗎?
我最近要用flex3實做一個系統,一篇課文中,會有該文章要學的生詞,當滑鼠移到上面會顯示該生詞的解釋,請問可以搭配上面連接呈現的功能嗎?
主要是想實作像下方這個範例的功能
http://www.bridel.org/flex/spellcheck/flexspellcheck.html
當滑鼠移上去顏色不一樣的字時,出現了手指的符號,按下去或滑鼠移上去能顯示生詞的翻譯句子。
是因為文字轉成了button嗎?
因為這個是我想呈現的功能!
不好意思哩!希望不會給你帶來困擾,
因為最近很努力在學flex跟AS3,但是還是遇到瓶頸
本身比較熟悉AS2語法,也實作過flash小遊戲!
希望如果你知道的話,可以給我一些hint或解說喔!
再次感謝你…Orz!
哈囉~Frank!!
你的問題我分成以下幾點回覆:
1. 那個網頁連結提示快照是wordpress內建的功能喔^^
2. 其實我看不太懂你那個範例的用途^^"
不過我大概知道你是要讓Flex中的文字連結能有一個tip視窗對吧?
如果你是要讓Flex中的button或連結有tip視窗
其實已經有內建這個功能
但如果你想要有更進階的tip功能
可以直接使用別人寫的sticky tip
可以看一下以下這個網址(沒有提供source)
http://labs.flexcoders.nl/samples/ToolTip/extended/
類似的範例但有source~請參考以下網址
http://labs.flexcoders.nl/tag/tooltip/
希望能對你有幫助囉^^
感謝你提供的訊息!
不過我在實做過程遇到一些問題
1.我是把一篇文章放在TextArea元件裡,但是文章有段落之分,flex有辦法像html有標籤幫助定位嗎?因為想分段,我是用tab鍵或是空白鍵去設定,不過complier時,欄位好像都會跑掉,不曉得有比較好的做法嗎?
2.http://home.lst.ncu.edu.tw/~frank/text.JPG
另外就是文字提示功能,譬如我想要讓"搖晃"這個生詞當滑鼠移上去時,會顯示生詞的翻譯,該怎麼做呢?如果是button元件,我就知道怎麼做,但是不曉得textArea欄位裡的方式是怎麼實做的呢,我有買flex2的書,但書上也似乎沒提到文字欄位裡的工具提示文字,只有給button的例子!
不好意思喔!問題這麼多,再次感謝你的幫忙!…Orz
to frank:
第一個問題你可以參考TextArea中的htmlText屬性
第二個問題你可以參考以下網址
http://ntt.cc/2008/07/20/how-to-highlight-the-text-in-flex-with-full-source-code.html
哈~放颱風假放太爽了
都沒上來看blog
感謝Foster大幫忙回答阿!!!^^
第一個問題只要查一下help就可以解決了
第二個問題就真的沒看過類似的範例
感謝Foster大分享啦!!!
順便多學一招^^
不用客氣,如果你知道一些不錯的秘技,也可以分享出來
太感謝上面兩位高手了!
我本來試過好幾種方法:
1.第一就是另外建一個相同的生詞text元件去覆蓋在原本生詞上頭,不過位置不好調整,而且將來要大量修改時,要調每一個元件的位置,會瘋掉。
2.使用XML語法去建立超連結
是參考這個網站
http://chuiwenchiu.spaces.live.com/blog/cnsCA5D9227DF9E78E8!960.entry
想說使用超連結方式,但效果也不太方便。
所以我來去研究看看這個方法,再次感謝了!
喔~~~
之後有看到類似的效果再發上來share啦
希望Frank大能夠試成功囉!!!
MitchBox大你好
我之前的功能有try出來了,就是把課文放在html的屬性,然後在生詞加上要觸發的語法
<![CDATA[隔壁院子裡有顆大榕樹,
搖晃
]]>
也就是當點選搖晃這個生詞時會觸發onTxtLink(event)事件,這個事件會我是用AS3語法自行產生一個box,把解釋跟例句放在裡面,最後在再
加上tooltip的功能。
因為之前是寫死的功能,把文章寫在程式碼上,但因為之後會使用到好幾十篇的課文,我想說一定要有一些彈性的做法,所以就使用載入外部的文字檔,把課文放在txt檔案裡面,但是如果是純粹載入文字檔是沒有問題。
可是我想把每篇文章生詞的觸發語法包在檔案裡面,也就是檔案裡面會有html標籤,如:http://home.cl.ncu.edu.tw/~frank/art2.txt
載入到text欄位之後就遇到問題了 ,會顯示object,不知道是不是因為html那些標籤的關係。
所以我就翻Actionscript 3.0 cookbook書找到可以載入html檔的方法,於是我就把上述檔案轉成html檔,一樣載入進去,但試了好久,都不行。
語法:http://home.cl.ncu.edu.tw/~frank/loadtext.mxml
我有看flex歐萊理的書,遠端資料通訊那章節,似乎沒有說到可以載入html,我不知道這是不是最大的原因。
弄了好幾天,才想說問板大或其他高手,如果我要用這樣的功能,用哪種方法使比較可行,以及比較有彈性呢?
目前我想到就是
1.載入外部文字(內容是含有html標籤的課文)
2.載入html檔
3.課文變成XML檔(可是XML似乎無法直接顯示在text欄位上)
希望大大了解的話可以幫助我,感恩不盡…Orz!
哈囉Frank!!!
我做了一個範例提供給你參考!!!
(以下程式我都用[]當tag的括弧顯示~這樣才能在部落格中顯示出來~)
這個範例主要就是讓你知道如何把一個Html檔案載入到TextArea中顯示
一開始先把html檔的內容丟到string中
[ mx:String id="txtStr" source="test.html" /]
接著在textarea中指定讀取這個string
[ mx:TextArea id="txtBox" htmlText="{txtStr}" link="txtBoxLink(event);" /]
另外還有一個CSS檔案來設定Html的樣式
像連結或文字的顏色等等
然後你一樣只需在那一份Html檔中的連結設定event就可以了
例如:[ a href="event:Flex" ] Hello [ /a ]
這樣就可以了
這個範例的原始碼請到這邊下載
希望對你有幫助啦^^
Mitchbox大
我試過了,很順利的成功了!
原來要先把html塞到字串裡,才能丟到text欄位壓!
這麼簡單的步驟,我竟然弄好久(真是汗顏)
我可以順便請教你是怎麼上手flex的嗎?
我突然覺得AS3也要很熟才行
我覺得歐萊禮的書好生硬的說,
可能是簡單的概念,但書上的寫法沒那麼淺顯意懂,
太感謝你了!
哈~恭喜Frank大阿!!!
^^
其實我也是最近才剛開始玩Flex而已
大概才玩一個月不到^^"
現在是真的玩上癮啦
而AS3的部份也是最近一陣子才開始去研究
之前都很偷懶~都用AS2在寫>0<
所以ㄋ~
我都是東看看~西看看~
一直瘋狂的看別人寫的code
想寫什麼功能就直接到google搜尋文章
參考看看別人怎麼寫的
然後在端看自己要寫的程式的狀況去修改調整
就用這種很偷懶的方式^^"
邊寫邊研究然後邊學啦
我是覺得直接利用網路資源是最方便、最快的方式
但是~如果要把根扎穩還是需要書的啦
畢竟一本好書可以讓人受益無窮~
我之後再整理一些不錯的Flex參考網站跟大家分享囉
^^