在我的flex应用程序中,我维护了5张图像。当用户点击“下一步”按钮时,它应显示一个图像,表示“image1”。如果再次单击该按钮,则image1应替换为image2,依此类推。我基本上遵循'image.visible'方法。但图像并排显示。我认为这不是正确的程序。还有其他选择提前致谢
这是我的代码。我将所有图像和按钮保存在mx:panel中。即使我使用了不起作用的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>
答案 0 :(得分: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>
答案 1 :(得分:0)
将图像的x和y位置指定为相同,并以它们的可见性进行游戏。它肯定会起作用。
答案 2 :(得分: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>