IEnumerable
IEnumerable

Reputation: 3790

Image not showing on Silveright control

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

Answers (1)

tweellt
tweellt

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

Related Questions