Reputation: 3790
I have a Custom style to my Button
in my Silverlight
app.
Im using a Static style and a Control Template. In the VisualStudio designer I can see the image on the button however when I run the application the Image is not showing.
Here is the XAML
for the Style
<Style x:Key="PlayButtonStyle" TargetType="Button">
<Setter Property="Foreground" Value="DarkGreen" />
<Setter Property="Template" Value="{StaticResource PlayButtonControlTemplate}"/>
</Style>
Here is the XAML
for the ControlTemplate
<ControlTemplate x:Key="PlayButtonControlTemplate" TargetType="Button">
<Border x:Name="Border">
<Border.Background>
<SolidColorBrush Color="{StaticResource ControlNormalColor}" />
</Border.Background>
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="CommonStates">
<VisualStateGroup.Transitions>
<VisualTransition GeneratedDuration="0:0:0.5" />
<VisualTransition GeneratedDuration="0" To="Pressed" />
</VisualStateGroup.Transitions>
<VisualState x:Name="Normal"/>
<VisualState x:Name="MouseOver">
<Storyboard>
<ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Panel.Background).(SolidColorBrush.Color)"
Storyboard.TargetName="Border">
<EasingColorKeyFrame KeyTime="0" Value="{StaticResource ControlMouseOverColor}" />
</ColorAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState x:Name="Pressed">
<Storyboard>
<ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Panel.Background).(SolidColorBrush.Color)"
Storyboard.TargetName="Border">
<EasingColorKeyFrame KeyTime="0" Value="{StaticResource ControlPressedColor}" />
</ColorAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState x:Name="Disabled">
<Storyboard>
<ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Panel.Background).(SolidColorBrush.Color)"
Storyboard.TargetName="Border">
<EasingColorKeyFrame KeyTime="0" Value="{StaticResource DisabledControlColor}" />
</ColorAnimationUsingKeyFrames>
<ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(TextBlock.Foreground).(SolidColorBrush.Color)"
Storyboard.TargetName="Border">
<EasingColorKeyFrame KeyTime="0" Value="{StaticResource DisabledForegroundColor}" />
</ColorAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<Grid Width="55" Height="25">
<Image x:Name="DefaultImage" Source="Images/VideoPlayer/play_button.png" Opacity="1" />
<Image x:Name="HoverImage" Source="Images/VideoPlayer/play_button_hover.png" Opacity="0" />
</Grid>
</Border>
</ControlTemplate>
This is how I have assigned it
<Button x:Name="playPauseButton" Content="Play" Style="{StaticResource PlayButtonStyle}" Click="playPauseButton_Click" />
Upvotes: 0
Views: 48
Reputation: 2161
Set the image Build Action as Resource and change your code to:
<Image x:Name="DefaultImage" Source="pack://application:,,,/[Your namespace];component/Images/VideoPlayer/play_button.png" Opacity="1" />
Do not forget to change to your namespace.
It should be enough.
EDIT:
After taking a closer look I think you just need to do it this way:
<Image x:Name="DefaultImage" Source="/[Your namespace];component/Images/VideoPlayer/play_button.png" Opacity="1" />
Upvotes: 1