首頁 Javascript Sencha Touch
Sencha Touch
02Dec
Sencha Touch範例3:Video
Javascript / Sencha Touch / Eddy Chang 列印 填寫電子郵件
週五, 02 十二月 2011 05:38

Ext.Video的用法和Ext.Audio是類似的,範例中的用法如下:

{
 xtype: 'video',
 url: '../video/space.mp4',
 loop: true,
 posterUrl: '../video/Screenshot.png'
 }

posterUrl是這個影片的預覽圖,當然這個用法是標準的HTML5的video標籤用法,有些討論區的回應,Android2.2以下的機種似乎看不到這個。

另外如果像現在的Google Chrome因為不支援mp4影片(h.264)格式的時候,就可以利用Ext.env.Browser中對瀏覽器的偵測,把上面的那行url寫成:

url: Ext.browser.is.Chrome?'../video/space.webm':'../video/space.mp4',

當然影片space.webm是事先要先從space.mp4轉過來的(註:用的是免費的Miro Video Converter

Tags: html5 | sencha touch

 
01Dec
Sencha Touch範例2:Audio
Javascript / Sencha Touch / Eddy Chang 列印 填寫電子郵件
週四, 01 十二月 2011 00:29

上一篇大概說明了一下HTML5中關於audio的標籤用法及相關情況,在Sencha Touch中的kitchensink範例中的Audio範例中,可以看到它是怎麼使用Audio。它使用的是Ext.Audio這個專門處理Audio的元件。在官方的API文件上有一個注意事項:

On Android devices, the audio tags controls do not show. You must use the play, pause and toggle methods to control the audio.
在Android設備上,audio標籤controls是不會顯示的。你需要使用play, pause和toggle方法來控制audio.

Android目前2.2及2.3的機種中,得到的結果都是類似的,至少在目前雖然有"支援"但沒"控制列",所以你還需要自己用控制方法+ui來處理這個聲音檔。(註:相關資訊:http://code.google.com/p/android/issues/detail?id=10546

Tags: android | html5 | sencha touch

 
26Nov
Sencha Touch範例1:Ajax
Javascript / Sencha Touch / Eddy Chang 列印 填寫電子郵件
週六, 26 十一月 2011 00:00
(1 位用戶參與評分, 當前平均得到 5.00 顆星星)

Sencha Touch是給熟悉Extjs的程式開發員使用的,這樣說一點也不為過。Sencha Touch的基礎是Extjs,這個學習門檻相當高的Javascript框架,沒有Extjs的基礎,根本沒辦法寫出什麼,況且,新的MVC架構更是一個龐大而複雜的架構。

ajax是第一個範例,這個範例中可以學到什麼?

最前面想必是所有Touch的應用程式需要的宣告,平板電腦的啟動畫面(splash screen)、手機的啟動畫面、按鈕用的圖示,圖示是不是要有玻璃效果…就先記得有這個東西就可以:

Ext.setup({
 tabletStartupScreen: 'tablet_startup.png',
 phoneStartupScreen: 'phone_startup.png',
 icon: 'icon.png',
 glossOnIcon: false,

 

關於我something about me

eddy

Eddy Chang

Joomla!台灣站長、資擘(股)軟體工程師

最新留言Latest Comment