Hi EmptyKeys, Im am using your great framework for a game and want to create a animated caroussel
in a window. The storyboard animations are working great in the root window, but when used in a window then all the UI becomes transparent and loose their borders and titles after i click on a button shift left/right.
This is caused in the viewmodel on caroussel button click wher multiple properties are set.
<DataTemplate DataType="{x:Type data:PanelSelectProfile}">
<Border Background="Black" BorderBrush="DarkGray" BorderThickness="0 0 0 0">
<Grid Width="350" HorizontalAlignment="Center" VerticalAlignment="Top" Margin="0,50,0,0">
<TextBlock Text="Choose Profile" Foreground="Gold" FontSize="15pt" HorizontalAlignment="Center" VerticalAlignment="Top"/>
<local:UserControlProfile x:Name="UserControlPrevious" DataContext="{Binding PreviousProfile}" Visibility="{Binding PreviousProfileVisibility}" Width="100" Height="120" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="0,50,0,0" />
<local:UserControlProfile x:Name="UserControlCurrent" DataContext="{Binding CurrentProfile}" Width="150" Height="180" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="100,50,0,0" />
<local:UserControlProfile x:Name="UserControlNext" DataContext="{Binding NextProfile}" Visibility="{Binding NextProfileVisibility}" Width="100" Height="120" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="250,50,0,0" />
<Button Command="{Binding ButtonPrevious}" IsEnabled="{Binding ButtonPreviousEnabled}" Background="Transparent" BorderBrush="Transparent" Height="60" Width="60" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="0,240,0,0" >
<Image Source="{StaticResource Icon_Left}"/>
<Button.Triggers>
<EventTrigger RoutedEvent="Button.Click">
<BeginStoryboard>
<Storyboard>
<ThicknessAnimation Storyboard.TargetName="UserControlPrevious" Storyboard.TargetProperty="Margin" From="-50,50,0,0" To="0,50,0,0" Duration="0:0:0.5"/>
<DoubleAnimation Storyboard.TargetName="UserControlPrevious" Storyboard.TargetProperty="Width" From="80" To="100" Duration="0:0:0.5"/>
<DoubleAnimation Storyboard.TargetName="UserControlPrevious" Storyboard.TargetProperty="Height" From="100" To="120" Duration="0:0:0.5"/>
<ThicknessAnimation Storyboard.TargetName="UserControlCurrent" Storyboard.TargetProperty="Margin" From="0,50,0,0" To="100,50,0,0" Duration="0:0:0.5"/>
<DoubleAnimation Storyboard.TargetName="UserControlCurrent" Storyboard.TargetProperty="Width" From="100" To="150" Duration="0:0:0.5"/>
<DoubleAnimation Storyboard.TargetName="UserControlCurrent" Storyboard.TargetProperty="Height" From="120" To="180" Duration="0:0:0.5"/>
<ThicknessAnimation Storyboard.TargetName="UserControlNext" Storyboard.TargetProperty="Margin" From="100,50,0,0" To="250,50,0,0" Duration="0:0:0.5"/>
<DoubleAnimation Storyboard.TargetName="UserControlNext" Storyboard.TargetProperty="Width" From="150" To="100" Duration="0:0:0.5"/>
<DoubleAnimation Storyboard.TargetName="UserControlNext" Storyboard.TargetProperty="Height" From="180" To="120" Duration="0:0:0.5"/>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Button.Triggers>
</Button>
<Button Command="{Binding ButtonNext}" IsEnabled="{Binding ButtonNextEnabled}" Background="Transparent" BorderBrush="Transparent" Height="60" Width="60" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="290,240,0,0">
<Image Source="{StaticResource Icon_Right}"/>
<Button.Triggers>
<EventTrigger RoutedEvent="Button.Click">
<BeginStoryboard>
<Storyboard>
<ThicknessAnimation Storyboard.TargetName="UserControlPrevious" Storyboard.TargetProperty="Margin" From="100,50,0,0" To="0,50,0,0" Duration="0:0:0.5"/>
<DoubleAnimation Storyboard.TargetName="UserControlPrevious" Storyboard.TargetProperty="Width" From="150" To="100" Duration="0:0:0.5"/>
<DoubleAnimation Storyboard.TargetName="UserControlPrevious" Storyboard.TargetProperty="Height" From="180" To="120" Duration="0:0:0.5"/>
<ThicknessAnimation Storyboard.TargetName="UserControlCurrent" Storyboard.TargetProperty="Margin" From="250,50,0,0" To="100,50,0,0" Duration="0:0:0.5"/>
<DoubleAnimation Storyboard.TargetName="UserControlCurrent" Storyboard.TargetProperty="Width" From="100" To="150" Duration="0:0:0.5"/>
<DoubleAnimation Storyboard.TargetName="UserControlCurrent" Storyboard.TargetProperty="Height" From="120" To="180" Duration="0:0:0.5"/>
<ThicknessAnimation Storyboard.TargetName="UserControlNext" Storyboard.TargetProperty="Margin" From="300,50,0,0" To="250,50,0,0" Duration="0:0:0.5"/>
<DoubleAnimation Storyboard.TargetName="UserControlNext" Storyboard.TargetProperty="Width" From="80" To="100" Duration="0:0:0.5"/>
<DoubleAnimation Storyboard.TargetName="UserControlNext" Storyboard.TargetProperty="Height" From="100" To="120" Duration="0:0:0.5"/>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Button.Triggers>
</Button>
</Grid>
</Border>
</DataTemplate>
...
private void OnButtonPreviousClick(object obj)
{
var index = SelectedIndex;
SelectedIndex = index - 1;
}
private void OnButtonNextClick(object obj)
{
var index = SelectedIndex;
SelectedIndex = index + 1;
}
private int _selectedIndex;
public int SelectedIndex
{
get
{
return _selectedIndex;
}
set
{
if (_profiles.Count > 0)
{
for (int i = 0; i < _profiles.Count; i++)
{
var profile = _profiles[i];
profile.IsSelected = false;
if (i == value)
{
profile.IsSelected = true;
CurrentProfile = profile;
PreviousProfile = i > 0 ? _profiles[i - 1] : null;
NextProfile = i < _profiles.Count - 1 ? _profiles[i + 1] : null;
PreviousProfileVisibility = i > 0 ? Visibility.Visible : Visibility.Collapsed;
NextProfileVisibility = i < _profiles.Count - 1 ? Visibility.Visible : Visibility.Collapsed;
ButtonPreviousEnabled = i > 0 ? true : false;
ButtonNextEnabled = i < _profiles.Count - 1 ? true : false;
break;
}
}
}
SetProperty(ref _selectedIndex, value);
}
}
...
Hi EmptyKeys, Im am using your great framework for a game and want to create a animated caroussel
in a window. The storyboard animations are working great in the root window, but when used in a window then all the UI becomes transparent and loose their borders and titles after i click on a button shift left/right.
This is caused in the viewmodel on caroussel button click wher multiple properties are set.
Any Idea what is going on? and what can i do to prevent this behavior
Xaml:
ViewModel.cs