VisualStateManager sur une ChildWindow

Version imprimable

15/06/2010, 16h45
Z4ng3tsu

VisualStateManager sur une ChildWindow

Bonjour à tous !

Voilà je suis en train de voir les différentes possibilités de Blend et je me heurte à un problème.
Sous Visual Studio j'ai crée une ChildWindow tout ce qu'il y a de plus simple et j'ai viré la fermeture de la ChildWindow sur clique du bouton OK ou Cancel.
J'ouvre ensuite mon projet sous Blend 4 RC et je me dis "tiens j'aimerai bien mettre un effet de rotation sur le bouton OK lors de son clic. Je clique sur le bouton OK, je vais dans l'onglet States et je rajoute un StateGroup. Je rajoute ensuite un State que je nomme "Loaded". Pour ce State je donne une valeur de 180° de rotation sur axe Y à mon bouton OK après 1 seconde. Lorsque je clique sur lecture ça fonctionne nickel.
Ensuite je retourne sous Visual Studio, et dans la méthode appelé par le clic du bouton OK je mets:

Code:

VisualStateManager.GoToState(this, "Loaded", true);

Et malheureusement rien ne se passe. Or cette méthode fonctionne très bien pour une page Silverlight classique. Mais alors où est le problème ? Quelqu'un aurait-il ou elle la réponse ?

Merci d'avance pour toutes vos réponses en tout cas !!!
15/06/2010, 17h00
Samuel Blanchard

Bonjour,

Ou est stocké ton VisualState ? Il me semble que si c'est dans LayoutRoot il faut que ton GoToState pointe vers LayoutRoot et non this.

Voilà le code généré par Blend (ce sera plus rapide que de te filer une réponse qui sert à rien je pense...) :

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
<sdk:ChildWindow	xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
	xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
	xmlns:sdk="http://schemas.microsoft.com/winfx/2006/xaml/presentation/sdk"	xmlns:ei="http://schemas.microsoft.com/expression/2010/interactions" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d"	x:Class="CardGameTest.ChildWindow1"
	Title="ChildWindow1"
	Width="400" Height="300">
	<Grid x:Name="LayoutRoot">
		<Grid.RowDefinitions>
			<RowDefinition />
			<RowDefinition Height="Auto" />
		</Grid.RowDefinitions>
 
		<VisualStateManager.CustomVisualStateManager>
			<ei:ExtendedVisualStateManager/>
		</VisualStateManager.CustomVisualStateManager>
		<VisualStateManager.VisualStateGroups>
			<VisualStateGroup x:Name="VisualStateGroup">
				<VisualState x:Name="Loaded">
					<Storyboard>
						<DoubleAnimation Duration="0:0:1" To="180" Storyboard.TargetProperty="(UIElement.Projection).(PlaneProjection.RotationY)" Storyboard.TargetName="OKButton" d:IsOptimized="True"/>
					</Storyboard>
				</VisualState>
			</VisualStateGroup>
		</VisualStateManager.VisualStateGroups>
 
		<Button x:Name="OKButton" Content="OK" Click="OKButton_Click" Width="75" Height="23" Margin="0,0,79,0" HorizontalAlignment="Right" Grid.Row="1" >
			<Button.Projection>
				<PlaneProjection/>
			</Button.Projection>
		</Button>
		<Button x:Name="CancelButton" Content="Cancel" Click="CancelButton_Click" Width="75" Height="23" HorizontalAlignment="Right" Grid.Row="1" />
	</Grid>
</sdk:ChildWindow>

15/06/2010, 17h05
Samuel Blanchard
Il est bien dans LayoutRoot donc je pense que ceci devrait marcher :
Code:

1 2 VisualStateManager.GoToState(this.LayoutRoot, "Loaded", true);
15/06/2010, 17h09
Z4ng3tsu

Je viens de tester ta ligne. Le debugger m'envoie bouler en disant que this.LayoutRoot est un Controls.LayoutRoot alors qu'il attend un Controls.Control. Y'a un moyen de caster un LayoutRoot en Control ?

ARRRG ! oui c'est vrai Grid est un Panel et pas un Control.Tu peux toujours utiliser un ContentControl :
Code:

1 2 3 4 5 6 7 8 9 <Grid x:Name="LayoutRoot"> <ContentControl x:Name="MonContentControl"> <VisualStateManager...> </VisualStateManager...> </ContentControl> </Grid>
puis :
Code:

1 2 VisualStateManager.GoToState(this.MonContentControl, "Loaded", true);
Pas très élégant mais ça devrait marcher.

15/06/2010, 17h31
Z4ng3tsu

Incroyable mais non ça ne marche pas !
Je commencerai presque à croire que c'est un bug non pas de moi mais Blend ou autre.
Peut etre un indice que j'ai trouvé :
Pour faire une rotation de la ChildWindow entière, il faut : clique droit sur ChildWindow (dans Objects and Timeline) puis Template puis Edit a copy. Et c'est seulement en éditant cette copie que la rotation de la ChildWindow entière fonctionne.
Peut-être qu'il faut réadapter ça pour le faire sur simplement un bouton...

EDIT : J'ai peut-être trouvé une solution. Ca a marché sur un bouton, je vais essayer sur d'autres contrôles comme des images ou autre...
15/06/2010, 17h45
Samuel Blanchard

euuuh je ne sais pas trop... Ça devrait fonctionner... J'ai pas testé en même temps.

F**K !
Toujours rien ! Et pourtant j'arrive à faire une rotation de la child window complète (me suis inspiré de ce tuto : http://blogs.windowsclient.net/silve...ildwindow.aspx pour ça).

Pas moyen de faire faire la rotation de ma child window bordel !
Je refile le code xaml et cs de la child window avant toute modification des états ou style :

Le xaml :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<controls:ChildWindow x:Class="CardGameTest.CWShowCard"
           xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
           xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
           xmlns:controls="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls"
           Width="400" Height="300" 
           Title="Carte Tirée">
    <Grid x:Name="LayoutRoot" Margin="2">
        <StackPanel Orientation="Vertical" HorizontalAlignment="Center" VerticalAlignment="Center">
            <Grid Width="125" Height="175">
                <Image x:Name="imgCardBackShowed" HorizontalAlignment="Center" VerticalAlignment="Center" Stretch="UniformToFill" Visibility="Visible" />
                <Image x:Name="imgCardFrontShowed" HorizontalAlignment="Center" VerticalAlignment="Center" Stretch="UniformToFill" Visibility="Collapsed" />
            </Grid>
            <Button Content="OK" Width="100" Height="23" Margin="5" x:Name="btnOK" Click="btnOK_Click" />
        </StackPanel>
    </Grid>
</controls:ChildWindow>

Le cs :

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
 
using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
using System.Windows.Media.Imaging;
 
namespace CardGameTest
{
    public partial class CWShowCard : ChildWindow
    {
        public BitmapImage biImageBack = null;
        public BitmapImage biImageFront = null;
 
        public CWShowCard()
        {
            InitializeComponent();
        }
 
        protected override void OnOpened()
        {
            imgCardBackShowed.Source = biImageBack;
 
            base.OnOpened();
        }
 
        private void btnOK_Click(object sender, RoutedEventArgs e)
        {
 
        }
    }
}

Mon but étant au final de faire une rotation de l'image imgCardBackShowed de 180 sur un axe y après pression du bouton OK. Vous constaterez comme moi que ce n'est pas si évident dans une ChildWindow...

17/06/2010, 11h06
xavier-sama

Si tu veux juste faire tourner ta ChildWindow regarde ici :

http://www.developpez.net/forums/d93...n-childwindow/

Perso je l'ai fait mais c'est un peu nul car t'as ChildWindow est complétement inverser (les boutons, le texte et même la croix).

Sinon tu verras dans le post un très bon code qui permet de faire tourner un composant et d'avoir autre chose sur le verso (exemple : recto -> info d'une personne, verso -> sa photo).

http://blog.naviso.fr/wordpress/?p=102

Cordialement,
Xavier
17/06/2010, 14h32
Samuel Blanchard

Citation:

Sinon tu verras dans le post un très bon code qui permet de faire tourner un composant et d'avoir autre chose sur le verso (exemple : recto -> info d'une personne, verso -> sa photo).

Merci 8-)
17/06/2010, 20h17
xavier-sama

Citation:

Envoyé par Samoteph

Merci 8-)

Hé hé bah quoi c'est vrai...ton code est très simple à comprendre et à modifier !!

Redde Caesari quae sunt Caesaris.