[Animation] basic pour

Version imprimable

Voila je debut en silverlight 2
et j'ai pa tout bien compris
par exemple
avec ce magnifique code fait sous blend 2 sp1

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
 
<UserControl
	xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
	xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
	x:Class="SilverlightApplication2.Page"
	Width="1000" Height="167" x:Name="userControl" xmlns:vsm="clr-namespace:System.Windows;assembly=System.Windows">
	<UserControl.Resources>
		<Storyboard x:Name="Storyboard1">
			<DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="rectangle" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.Y)">
				<SplineDoubleKeyFrame KeyTime="00:00:00" Value="-161.109"/>
				<SplineDoubleKeyFrame KeyTime="00:00:04" Value="0"/>
			</DoubleAnimationUsingKeyFrames>
		</Storyboard>
	</UserControl.Resources>
 
	<Grid x:Name="LayoutRoot" Background="White">
		<vsm:VisualStateManager.VisualStateGroups>
			<vsm:VisualStateGroup x:Name="VisualStateGroup"/>
		</vsm:VisualStateManager.VisualStateGroups>
		<Path Margin="8,-24.971,8,7.971" x:Name="rectangle" Stretch="Fill" RenderTransformOrigin="0.5,0.429394829930508" Data="M21.999994,0 L962,0 C974.15002,4.1960469E-05 984,9.8493967 984,22.00001 L984,127.00002 C984,139.15024 974.15009,149 962,149 L186.5,149 L186.5,173.87985 C186.5,178.71181 182.58296,182.62885 177.75101,182.62885 L43.249004,182.62885 C38.417072,182.62885 34.500011,178.71184 34.499996,173.87985 L34.499996,149 L21.999994,149 C9.8497648,149 -4.5473803E-13,139.14998 0,127.00002 L0,22.00001 C-4.5474941E-13,9.8496552 9.8497868,4.1961615E-05 21.999994,0 z">
			<Path.Fill>
				<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
					<GradientStop Color="#FF707070" Offset="1"/>
					<GradientStop Color="#FFCACACA" Offset="0.299"/>
				</LinearGradientBrush>
			</Path.Fill>
		</Path>
	</Grid>
 
</UserControl>

j'aimerais démarrer l'animation qui descend mon path nommé rectangle au démarrage de l'appli
puis par exemple en ajoutant un bouton le faire remonter
on peut faire ca simplement sous blend
faut t-il rajouter du code ???

08/12/2008, 01h33
Skyounet

Oui il faut rajouter du code.

Storyboard1.Begin();

Tu peux le mettre dans l'évènement Loaded de ton UserControl par exemple.

Pour faire l'inverse (le faire remonter) tu doit créer une seconde animation qui fait l'inverse.

ben quand je faiis ca
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 public partial class Page : UserControl { public Page() { // Requis pour initialiser les variables InitializeComponent(); this.Loaded += new RoutedEventHandler(Page_Loaded); } void Page_Loaded(object sender, RoutedEventArgs e) { Storyboard1.Begin(); } }
j'ai
{System.InvalidOperationException: Impossible de résoudre TargetProperty (UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.Y) dans l'objet spécifié.
à MS.Internal.XcpImports.MethodEx(IntPtr ptr, String name, CValue[] cvData)
à MS.Internal.XcpImports.MethodEx(DependencyObject obj, String name)
à MS.Internal.XcpImports.Storyboard_Begin(Storyboard storyboard)
à System.Windows.Media.Animation.Storyboard.Begin()
à SilverlightApplication2.Page.Page_Loaded(Object sender, RoutedEventArgs e)
à System.Windows.CoreInvokeHandler.InvokeEventHandler(Int32 typeIndex, Delegate handlerDelegate, Object sender, Object args)
à MS.Internal.JoltHelper.FireEvent(IntPtr unmanagedObj, IntPtr unmanagedObjArgs, Int32 argsTypeIndex, String eventName)}

Il faut que tu rajoutes les transformations de base pour que cela fonctionne sinon, il ne peut pas trouvé les objets qu'il doit manipuler:

Code:

1
2
3
4
5
6
7
8
<Path Margin="8,-24.971,8,7.971" x:Name="rectangle" Stretch="Fill" RenderTransformOrigin="0.5,0.429394829930508" Data="M21.999994,0 L962,0 C974.15002,4.1960469E-05 984,9.8493967 984,22.00001 L984,127.00002 C984,139.15024 974.15009,149 962,149 L186.5,149 L186.5,173.87985 C186.5,178.71181 182.58296,182.62885 177.75101,182.62885 L43.249004,182.62885 C38.417072,182.62885 34.500011,178.71184 34.499996,173.87985 L34.499996,149 L21.999994,149 C9.8497648,149 -4.5473803E-13,139.14998 0,127.00002 L0,22.00001 C-4.5474941E-13,9.8496552 9.8497868,4.1961615E-05 21.999994,0 z">
			<Path.Fill>
				<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
					<GradientStop Color="#FF707070" Offset="1"/>
					<GradientStop Color="#FFCACACA" Offset="0.299"/>
				</LinearGradientBrush>
			</Path.Fill>
		</Path>