2010-12-08 15 views
0

ツールキットのFLVPlaybackコンポーネントに基づいて非常に基本的なFlash Playerを作成しました。何らかの理由で、スケーリングモードがEXACT_FITに設定されていても、常にビデオの上下に黒いバーが表示されます。これはプレビュー画像がビデオと同じx、y位置と高さの&の幅に設定されているため正確ですが、黒いバーはありません。Flash AS3 FLVPlaybackコンポーネントは常に正確なスケーリングでもビデオの上下に黒いバーが表示されます

シンプルなものがありますか?大量のコードについてお詫び申し上げますが、どうすれば見えるのか分かりません。私は次のコードでプレイヤーを注入するためにSWFObjectを使用しています

<script type="text/javascript"> 
var flashvars = { 
    playerSkinURL: 'SkinUnderPlayStopSeekFullVol.swf', 
    videoURL: 'video.flv', 
    previewImageURL: 'video-preview.jpg', 
    scaleMode: 'exact', 
    autoBegin: false, 
    playerColour: '#cccccc', 
    playerAutoHide: false, 
    playerAlpha: 0.85 
}; 
var params = { 
allowfullscreen: true, 
quality: 'best', 
wmode: 'window' 
}; 
swfobject.embedSWF("video.swf", "video", "479", "310", "9.0.0","/video/expressInstall.swf", flashvars, params); 
</script> 

<div id="video"></div> 

私のアクションスクリプトは、すべてのフレーム1に次のとおりです。

stop(); 

/** 
* Embedding this player is simple with the following flashvars API 
* playerSkinURL = the url to the skin to use eg. SkinUnderPlayStopSeekMuteVol.swf 
* videoURL  = the url to the video FLV file 
* previewImageURL = the url of the image to use for the preview image (43px less than total height) 
* scaleMode  = scale mode of the player 
*  - exact (default) = fit to player dimensions exactly 
*  - no    = use FLV original dimensions 
*      - aspect = scale the video whilst maintaining aspect ratio 
* autoBegin  = automatically start playing the video as soon as it is ready (true or false) default = false 
* playerColour = the colour of the bezel default = 0x47ABCB 
* playerAlpha  = the alpha transparency of the bezel default = 0.85 
* playerAutoHide = whether to hide the bezel when the mouse is not over it (boolean true or false) 
*/ 
import fl.video.VideoEvent; 
import fl.video.VideoScaleMode; 
import fl.video.LayoutEvent; 
var flashVars; 
var imageLoader:Loader; 

var playerSkin:String = 'SkinUnderPlayStopSeekMuteVol.swf'; 
var videoURL:String = ''; 
var previewImage:String = ''; 
var previewImageLoader:Loader = new Loader(); 
var scaleMode:String = 'exact'; 
var autoBegin:Boolean = false; 
var playerColour:uint = 0xCCCCCC; 
var playerAlpha:Number = 0.85; 
var playerAutoHide:Boolean = false; 

/** 
* Action functions 
*/ 
function populateLocalVars() { 
flashVars = root.loaderInfo.parameters; 
if(null != flashVars['playerSkinURL']) { 
    playerSkin = flashVars['playerSkinURL']; 
} 
if(null != flashVars['videoURL']) { 
    videoURL = flashVars['videoURL']; 
} 
if(null != flashVars['previewImageURL']) { 
    previewImage = flashVars['previewImageURL']; 
} 
if(null != flashVars['scaleMode'] && 
    ('no' == flashVars['scaleMode'] || 'aspect' == flashVars['scaleMode'] || 'exact' == flashVars['scaleMode'])) { 
    scaleMode = flashVars['scaleMode']; 
} 
if(null != flashVars['autoBegin']) { 
    if('true' == flashVars['autoBegin']) { 
    autoBegin = true; 
    } else { 
    autoBegin = false; 
    } 
} 
if(null != flashVars['playerColour']) { 
    if('#' == flashVars['playerColour'].substring(0, 1)) { 
    playerColour = uint('0x' + flashVars['playerColour'].substring(1, flashVars['playerColour'].length)); 
    } else if('x' == flashVars['playerColour'].substring(1, 2)) { 
    playerColour = uint(flashVars['playerColour']); 
    } 
} 
if(null != flashVars['playerAlpha']) { 
    playerAlpha = Number(flashVars['playerAlpha']); 
} 
if(null != flashVars['playerAutoHide']) { 
    if('true' == flashVars['playerAutoHide']) { 
    playerAutoHide = true; 
    } else { 
    playerAutoHide = false; 
    } 
} 
} 
function initPlayer() { 
populateLocalVars(); 

setScaleMode(); 
setPlayerColour(); 
setPlayerAlpha(); 
setPlayerAutoHide(); 

setPlayerSkin(); 
loadPreview(); 
resizePlayer(); 

loadMovieIntoPlayer(); 

// this must come after the video is loaded! 
setPlayerAutoBegin(); 
} 

/** 
* Set FLVPlayBack component parameters 
*/ 
function setScaleMode() { 
if('no' == scaleMode) { 
    player.scaleMode = VideoScaleMode.NO_SCALE; 
} else if('aspect' == scaleMode) { 
    player.scaleMode = VideoScaleMode.MAINTAIN_ASPECT_RATIO; 
} else if('exact' == scaleMode) { 
    player.scaleMode = VideoScaleMode.EXACT_FIT; 
} 
} 
function setPlayerAutoBegin() { 
player.autoPlay = Boolean(autoBegin); 
} 
function setPlayerColour() { 
player.skinBackgroundColor = uint(playerColour); 
} 
function setPlayerAlpha() { 
player.skinBackgroundAlpha = Number(playerAlpha); 
} 
function setPlayerAutoHide() { 
player.skinAutoHide = Boolean(playerAutoHide); 
} 
function setPlayerSkin() { 
player.skin = playerSkin; 
} 
function loadMovieIntoPlayer() { 
player.load(videoURL); 
} 

/** 
* Operate on video 
*/ 
function playMovie() { 
    player.play(); 
hidePreview(); 
} 
function resetPlayHead() { 
player.seek(0); 
} 
function stopMovie() { 
player.stop(); 
} 

/** 
* Preview image related 
*/ 
function loadPreview() { 
previewImageLoader.load(new URLRequest(previewImage)); 
showPreview(); 
} 
function hidePreview() { 
preview.visible = false; 
} 
function showPreview() { 
preview.visible = true; 
} 

/** 
* Cause player to fit the defined area of the object html tag 
*/ 
function resizePlayer() { 
player.width = stage.stageWidth; 
player.height = stage.stageHeight - 43; 

// now if the preview image has been loaded when can set it to the same 
// width and height as the player 
previewImageLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, previewImageLoadedEventHandler); 
} 
function resizePreview() { 
preview.width = player.width; 
preview.height = player.height; 

preview.x = player.x; 
preview.y = player.y; 
} 

/** 
* Event handling functions 
*/ 
function loaderCompleteEventHandler(event:Event) { 
stage.addEventListener(Event.RESIZE, stageSizeEventHandler); 
stage.dispatchEvent(new Event(Event.RESIZE)); 
} 
function beginPlayingEventHandler(event:Event):void { 
hidePreview(); 
} 
function finishPlayingEventHandler(event:Event):void { 
resetPlayHead(); 
showPreview(); 
} 
function previewClickedEventHandler(event:Event):void { 
playMovie(); 
} 
function previewImageLoadedEventHandler(event:Event):void { 
preview.addChild(previewImageLoader); 
resizePreview(); 
} 
function stageSizeEventHandler(event:Event):void { 
if (stage.stageHeight > 0 && stage.stageWidth > 0) { 
    stage.removeEventListener(Event.RESIZE, stageSizeEventHandler); 
    initPlayer(); 
} 
} 
function playerHasBeenResizedEventHandler(event:Event):void { 
resizePreview(); 
} 

/** 
* Event bindings 
*/ 
this.loaderInfo.addEventListener(Event.COMPLETE, loaderCompleteEventHandler); 
player.addEventListener(VideoEvent.PLAYING_STATE_ENTERED, beginPlayingEventHandler); 
player.addEventListener(VideoEvent.COMPLETE, finishPlayingEventHandler); 
player.addEventListener(LayoutEvent.LAYOUT, playerHasBeenResizedEventHandler); 
preview.addEventListener(MouseEvent.CLICK, previewClickedEventHandler); 
+0

flv自体に黒いバーがないと仮定し、IDEからswfをテストし、スケールモードごとに正しく表示することができますか? flashVarsのスケールモードを変更するとどうなりますか? –

+0

@Martin Coulthurst:IDEに黒い棒が表示されていません。 flashVarsを使うと、 'EXACT_FIT'と' MAINTAIN_ASPECT_RATIO'の両方が同じことをするように見えます。彼らは両方とも黒い棒を追加します。 'EXACT_FIT'が' MAINTAIN_ASPECT_RATIO'として扱われているかのようです。 'NO_SCALE'に設定すると、ビデオはビューポートより大きくなり、コントロールは期待どおりに表示されません。 – Treffynnon

答えて

0

私はJSを使用してフラッシュをスケーリングしましたが、Flashコンポーネントのために何であったか、私が本当に欲しかっで自分の位置を維持することが判明した(しかし、あなたのプレーヤーやHTMLコンテナのサイズを変更する必要があります)あまりにも便利です表示可能な/ Flashペインのエッジとの関係。私は彼らに伸ばしたり、歪ませたりしたくありませんでした。

これは、デフォルトのプレーヤースキンを使用するのではなく、ActionScriptでコントロールなどを描画することによってプログラムで行う必要があります。 opensourceプレーヤーのソースを見てみると、私は何を意味するのか分かります。これにより、プレーヤーがフルスクリーンモードになっているときに、コントロールが不鮮明に見えなくなります。

また、ソースにはビデオの上下に小さなバーがいくつかありますが、ここで削除しようとしていたものほど大きくはありません。

0

wmode="transparent"に役立つかもしれません。
バーを隠すためにあなたのフラッシュアプ​​リケーションにマスクを適用することもできますが、問題がスタンドアローンのFPに存在しない場合は、HTML/jsに挿入することによって発生します。
scale: "noScale"

関連する問題