Flex）使用CoverFlow_lib.swc类包创建多种照片墙效果-优快云博客

Flex）使用CoverFlow_lib.swc类包创建多种照片墙效果

演示：

原尺寸演示地址：http://www.flashempire.com/myfe/flash_show.php?x=800&y=600&url=/myfe/upload/flash/171/1701510_1262687230&title=coverflowcontainer

CoverFlow_lib.swc下载地址：http://trac2.assembla.com/FlickAIR/browser/libs/CoverFlow_lib.swc

源代码：

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="horizontal" xmlns:containers="com.dougmccune.containers.*">
    <mx:Style>
        Panel{
            border-color:#99CDEE;
            border-alpha:1;
            border-thickness:1;/* 边框的粗细 */
            border-thickness-left:2;
            border-thickness-right:2;
            rounded-bottom-corners:false;
            corner-radius:5;
            header-colors:#b5e6f3,#81b3e6;
        }
    </mx:Style>
    <mx:TitleWindow width="100%" height="100%" backgroundColor="black" layout="horizontal">
    
    <mx:VBox width="25%" height="100%" borderColor="red" borderStyle="solid">
        <containers:VCoverFlowContainer id="coverflow1" width="100%" height="100%"
                 horizontalGap="40" segments="6">
                <mx:Panel width="100" height="100" title="One">

                </mx:Panel>
                <mx:Panel width="100" height="100" title="two">

                </mx:Panel>
                <mx:Panel width="100" height="100" title="three">

                </mx:Panel>
                <mx:Panel width="100" height="100" title="four">

                </mx:Panel>
                <mx:Panel width="100" height="100" title="five">

                </mx:Panel>
                <mx:Panel width="100" height="100" title="six">

                </mx:Panel>
                <mx:Panel width="100" height="100" title="serven">

                </mx:Panel>
            </containers:VCoverFlowContainer>
    </mx:VBox>

    <mx:VBox width="75%" height="100%">
        
        <mx:HBox width="100%" height="28%" borderColor="red" borderStyle="solid">
            <containers:CoverFlowContainer id="coverflow" width="100%" height="100%"
                 horizontalGap="40" segments="6">
                <mx:Panel width="100" height="100" title="One">

                </mx:Panel>
                <mx:Panel width="100" height="100" title="two">

                </mx:Panel>
                <mx:Panel width="100" height="100" title="three">

                </mx:Panel>
                <mx:Panel width="100" height="100" title="four">

                </mx:Panel>
                <mx:Panel width="100" height="100" title="five">

                </mx:Panel>
                <mx:Panel width="100" height="100" title="six">

                </mx:Panel>
                <mx:Panel width="100" height="100" title="serven">

                </mx:Panel>
            </containers:CoverFlowContainer>

        </mx:HBox>
        
        <mx:HBox width="100%" height="34%" borderColor="red" borderStyle="solid">

            <containers:VistaFlowContainer id="coverflow2" width="100%" height="100%">
                <mx:Panel width="100" height="100" title="One">

                </mx:Panel>
                <mx:Panel width="100" height="100" title="two">

                </mx:Panel>
                <mx:Panel width="100" height="100" title="three">

                </mx:Panel>
                <mx:Panel width="100" height="100" title="four">

                </mx:Panel>
                <mx:Panel width="100" height="100" title="five">

                </mx:Panel>
                <mx:Panel width="100" height="100" title="six">

                </mx:Panel>
                <mx:Panel width="100" height="100" title="serven">

                </mx:Panel>
            </containers:VistaFlowContainer>
        </mx:HBox>
        
        <mx:HBox width="100%" height="35%" borderColor="red" borderStyle="solid">
            <containers:CarouselContainer id="coverflow4" width="100%" height="100%"
                 reflectionEnabled="true">
                <mx:Panel width="200" height="200" title="One">

                </mx:Panel>
                <mx:Panel width="200" height="200" title="two">

                </mx:Panel>
                <mx:Panel width="200" height="200" title="three">

                </mx:Panel>
                <mx:Panel width="200" height="200" title="four">

                </mx:Panel>
                <mx:Panel width="200" height="200" title="five">

                </mx:Panel>
                <mx:Panel width="200" height="200" title="six">

                </mx:Panel>
                <mx:Panel width="200" height="200" title="serven">

                </mx:Panel>
            </containers:CarouselContainer>
    </mx:HBox>
    </mx:VBox>
    </mx:TitleWindow>
</mx:Application>