Flex 4实现VideoDisplay控件的背景图效果

与Flex 3不同的是，在Flex 4中不能用backgroundImage对VideoDisplay控件进行定义了，在Flex 4中必须基于Skin开发，如想实现VideoDisplay控件不显示默认的黑色，而是显示一张背景图，可按以下步骤进行：

1. 定义一个MXML外观文件
2. 在Application中进行样式定义

外观文件可定义的源代码如下：

<?xml version="1.0" encoding="utf-8"?>

<s:SparkSkin xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark"
    xmlns:fb="http://ns.adobe.com/flashbuilder/2009" alpha.disabledStates="0.5" 
    chromeColor.fullScreenStates="0xCCCCCC">
    <!-- A chrome color of 0xCCCCCC in the fullScreenStates means we ignore the chromeColor property 
         all together as 0xCCCCCC is essentially just a no-op color transform -->

  .......
	<s:BitmapImage id="vimg"
				   source="@Embed('vbg.png')"
				   smooth="true"
				   left="0" right="0"
				   top="0" bottom="0" />
    
  .......

</s:SparkSkin>

 在Application中定义的样式如下：

<fx:Style>
		@namespace s "library://ns.adobe.com/flex/spark";
		s|VideoDisplay{
			skinClass: ClassReference("skins.CustomVPSkin");
		}

</fx:Style>

 

这样videoDisplay控件就能显示背景图了，因为在我最近修改的视频聊天中有用到这块，故共享之……