|
創(chuàng)建 HTML/Flash 界面
在Adobe Flex Builder™ 2創(chuàng)建一個(gè)新的Flex 工程，然后創(chuàng)建一個(gè)Flash視頻，這個(gè)視頻通過(guò)給定的URL找到視頻并播放。我們將這個(gè)Flex應(yīng)用程序文件命名為simplemovie.mxml，代碼如下：
simplemovie.mxml
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
<mx:VBox backgroundColor="white" width="400" height="335">
<mx:VideoDisplay width="400" height="300" id="videoPlayer"
source="{Application.application.parameters.movie}" />
<mx:HBox width="100%" horizontalAlign="center">
<mx:Button label="Play" click="videoPlayer.play()" />
</mx:HBox>
</mx:VBox>
</mx:Application>
這個(gè)簡(jiǎn)單的Flex程序包括兩部分：一個(gè)用來(lái)播放視頻的VideoDisplay組件以及一個(gè)Play 按鈕，當(dāng)視頻播放完畢時(shí)用戶可以點(diǎn)擊按鈕重新播放。
VideoDisplay 組件有一個(gè) source 屬性，它包含了視頻FLV文件的URL地址。在這里，它的值是一個(gè)程序變量，這個(gè)變量是HTML中的<object>或<embed>標(biāo)簽的FlashVars屬性所提供的。
使用Flex Builder將simplemovie.mxml編譯成simplemovie.swf文件然后將其從bin文件夾中移動(dòng)到PHP文件目錄中。下面我們將創(chuàng)建一個(gè)嵌入了這個(gè)視頻的PHP頁(yè)面，該頁(yè)面代碼如下：
simptest.php
<?php
require "DB.php";
$moviebase = 'http://localhost:8080/movies/';
$dsn = 'mysql://root@localhost/movies';
$db =& DB::connect( $dsn );
if ( PEAR::isError( $db ) ) { die($db->getMessage()); }
$source = null;
$movieId = 1;
if ( array_key_exists( 'movie', $_GET ) )
$movieId = $_GET['movie'];
$movies = array();
$res = $db->query( 'SELECT movieId, source, title FROM movies' );
while( $row = $res->fetchrow( ) ) {
$movies []= $row;
if ( $row[0] == $movieId )
$source = $row[1];
}
if ( $source == null )
$source = $movies[0][1];
?>
<html>
<body>
<table>
<tr><td valign="top">
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="400"
height="335"
codebase="http://fpdownload.macromedia.com/get/flashplayer/current/
swflash.cab">
<param name="movie" value="simplemovie.swf" />
<param name="quality" value="high" />
<param name="flashVars" value="movie=<?php echo( $moviebase.$source ) ?>">
<embed src="simplemovie.swf" quality="high"
width="400" height="335" play="true"
loop="false"
quality="high"
flashVars="movie=<?php echo( $moviebase.$source ) ?>"
type="application/x-shockwave-flash"
pluginspage="http://www.adobe.com/go/getflashplayer">
</embed>
</object>
</td><td valign="top">
<?php
foreach( $movies as $movie ) {
?>
<a href="simptest.php?movie=<?php echo( $movie[0] )?>"><?php echo( $movie[2] )?></a><br/>
<?php
}
?>
</td></tr></table>
</body>
</html>
在上面的代碼中，一開(kāi)始是連接到數(shù)據(jù)庫(kù)并獲取視頻列表。然后它就開(kāi)始查找是否有與URL中ID匹配的視頻ID，如果有匹配的視頻ID，它就會(huì)將這個(gè)ID賦值給movie變量并通過(guò)flashVars參數(shù)傳送到simplemovie.swf文件。
接下來(lái)，在HTML代碼中創(chuàng)建了<object> 和 <embed>標(biāo)簽用來(lái)嵌入simplemovie.swf，標(biāo)簽中也提供了視頻的正確URL地址。然后又創(chuàng)建了一個(gè)列表列出了所有可用的視頻，這個(gè)列表中的每一項(xiàng)都提供了它們對(duì)應(yīng)視頻的正確ID并鏈接到了本頁(yè)。
在瀏覽器中運(yùn)行這個(gè)頁(yè)面的結(jié)果如圖2：
圖2.簡(jiǎn)單的視頻播放器和視頻列表
當(dāng)我打開(kāi)頁(yè)面的時(shí)候第一個(gè)視頻開(kāi)始播放。當(dāng)我選擇右邊列表中的某個(gè)視頻的時(shí)候，頁(yè)面就會(huì)重新載入并播放選中的視頻。
是不是很簡(jiǎn)單？一個(gè)Flex文件，一個(gè)PHP文件再加上后臺(tái)的一點(diǎn)數(shù)據(jù)庫(kù)操作，哇！一個(gè)視頻分享網(wǎng)站出現(xiàn)了！
接下來(lái)我們將在Flex中做一些工作來(lái)增強(qiáng)用戶體驗(yàn)。
出處：藍(lán)色理想
責(zé)任編輯：moby
上一頁(yè) 使用Flex和PHP創(chuàng)建自己的視頻應(yīng)用 [2] 下一頁(yè) 使用Flex和PHP創(chuàng)建自己的視頻應(yīng)用 [4]
◎進(jìn)入論壇RIA設(shè)計(jì)與應(yīng)用版塊參加討論
|
第 1 頁(yè) 
第 3 頁(yè) 使用Flex和PHP創(chuàng)建自己的視頻應(yīng)用 [3]
