Menu + Viewstack + Plusieurs pages

Salut,

J'ai recuperé un exemple qui permet de gérer "plusieurs pages" avec un seul bouton. Le problème est que j'aimerais que lors d'un clic sur le bouton 1 par exemple, le canvas correspondant ne soit pas "fixé" mais charge le fichier Page1.mxml (dans le canvas).

Savez-vous svp comment je peux faire ?

Voici mon code:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
    backgroundColor="#FFFFFF"
    backgroundAlpha="0"
    horizontalAlign="left"
    verticalGap="15" horizontalGap="15">
 
 
 
    <mx:HBox>
        <mx:Button label="Area 1"
            click="vs.selectedIndex=0" />
        <mx:Button label="Area 2"
            click="vs.selectedIndex=1" />
        <mx:Button label="Area 3"
            click="vs.selectedIndex=2" />
    </mx:HBox>
 
 
 
    <mx:Panel>
 
        <mx:ViewStack id="vs"
            x="30" y="32"
            width="452" height="339"
            selectedIndex="0">
 
            <mx:Canvas backgroundColor="#FFFFCC">
                <mx:Text text="This is Area 1"
                    fontWeight="bold"
                    paddingTop="10" paddingLeft="10" />
            </mx:Canvas>
 
            <mx:Canvas backgroundColor="#D7D7D7">
                <mx:Text text="This is Area 2"
                    fontWeight="bold"
                    paddingTop="10" paddingLeft="10" />
            </mx:Canvas>
 
            <mx:Canvas backgroundColor="#CCCCFF">
                <mx:Text text="This is Area 3" fontWeight="bold" paddingTop="10" paddingLeft="10" />
            </mx:Canvas>
 
        </mx:ViewStack>
 
    </mx:Panel>
 
 
 
</mx:Application>

<?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" xmlns:tonns="*" backgroundColor="#FFFFFF" backgroundAlpha="0" horizontalAlign="left" verticalGap="15" horizontalGap="15"> <mx:HBox> <mx:Button label="Area 1" click="vs.selectedIndex=0" /> <mx:Button label="Area 2" click="vs.selectedIndex=1" /> <mx:Button label="Area 3" click="vs.selectedIndex=2" /> </mx:HBox> <mx:Panel> <mx:ViewStack id="vs" x="30" y="32" width="452" height="339" selectedIndex="0"> <mx:Canvas backgroundColor="#FFFFCC"> <tonns:Page1 /> </mx:Canvas> <mx:Canvas backgroundColor="#D7D7D7"> <mx:Text text="This is Area 2" fontWeight="bold" paddingTop="10" paddingLeft="10" /> </mx:Canvas> <mx:Canvas backgroundColor="#CCCCFF"> <mx:Text text="This is Area 3" fontWeight="bold" paddingTop="10" paddingLeft="10" /> </mx:Canvas> </mx:ViewStack> </mx:Panel> </mx:Application>