2010-11-26 74 views
0

在我的Flex应用程序中,我维护着5张图片。当用户点击'下一个'按钮时,它应该显示一个图像'image1'。如果该按钮再次点击,则image1应该替换为image2等。我基本上遵循'image.visible'方法。但图像并排显示。我认为这不是正确的程序。任何选择?在此先感谢如何替换flex 3中的图像?


这是我的代码。我将所有图像和按钮保留在mx:面板中。即使我使用了不工作的x和y位置。

<?xml version="1.0" encoding="utf-8"?> 
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"> 
<mx:Panel 
title = 'Learn and Test your Knowledge' 
height = '80%' 
paddingBottom = '10' paddingTop = '10' 
paddingLeft = '10' paddingRight = '10' 
borderAlpha='0.20' fontFamily="Verdana" fontSize="15" color="#F30C32" backgroundImage="@Embed(source='../images/lad.jpg')" width="413" x="139"> 
<mx:Script> 

    <![CDATA[ 
public function nextEvent():void 
     { 
     // here i should write next button code 
     } 

    ]]> 
</mx:Script> 

<mx:Image source="../images/image1.jpg" visible="true" id="image1" /> 

<mx:Image source="../images/image3.jpg" visible="true" id="image2"/> 
<mx:Image source="../images/image3.jpg" visible="true" id="image3"/> 

<mx:Button id="next" visible="false" click="nextEvent()"> 

</mx:Button> 

+1

您是否已将所有图像包含在HBox中?这将把他们排列在一起。尝试将它们放入Canvas标签中。如果情况并非如此,你可以发布一个代码来展示你的图片,以便我们看到发生了什么? – martineno 2010-11-26 06:00:07

回答

1

如果您只显示一个图像,最好的方法是只使用一个图像组件。您可以使用嵌入的图像和引用来创建一个数组或矢量,以更改图像组件上的源属性。下面是一个例子:(下面的代码将与任何布局/容器中工作)

<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"> 
    <mx:Image id="image" click="imageClick()" source="{new images[0]()}" /> 

    <mx:Script> 
     <![CDATA[ 
      [Embed(source="assets/1.png")] 
      private var image1:Class; 

      [Embed(source="assets/2.png")] 
      private var image2:Class; 

      [Embed(source="assets/3.png")] 
      private var image3:Class; 

      private var images:Array = [image1, image2, image3]; 

      private var imageIndex:uint = 0; 

      protected function imageClick():void 
      { 
       imageIndex++; 
       if(imageIndex == images.length) imageIndex = 0; 

       image.source = new images[imageIndex](); 
      } 

     ]]> 
    </mx:Script>   
</mx:Canvas> 
+0

感谢greg。没关系。它工作正常。我应该嵌入声音文件,并提供Sound类的参考吗?我想在内部为每个图像播放声音。它会完成吗? – hemanth 2010-11-26 14:33:29

0

指定图像作为相同的X和Y位置和玩弄他们的visibility.It肯定会工作。

+0

我假设你使用了Canvas作为container.Do按照martineno的建议,然后如我所说的保持x和y一样:) – himanshu 2010-11-26 06:31:58

0

ViewStack是我选择它非常适合在这个场合。 一次仅显示一个组件,对于下一个操作,它将自动覆盖其新组件的前一个内容。

<mx:ViewStack id="myViewStack" borderStyle="solid" width="100%" height="80%"> 

     <mx:Canvas id="one" click="myViewStack.selectedChild=two;"> 
      <mx:Image source="assets/1.png" /> 
     </mx:Canvas> 

     <mx:Canvas id="two" click="myViewStack.selectedChild=three;"> 
      <mx:Image source="assets/2.png" /> 
     </mx:Canvas> 

     <mx:Canvas id="three" click="myViewStack.selectedChild=four;"> 
      <mx:Image source="assets/3.png" /> 
     </mx:Canvas> 

     <mx:Canvas id="four" click="myViewStack.selectedChild=five;"> 
      <mx:Image source="assets/4.png" /> 
     </mx:Canvas> 

     <mx:Canvas id="five" click="myViewStack.selectedChild=one;"> 
      <mx:Image source="assets/5.png" /> 
     </mx:Canvas> 

    </mx:ViewStack>