Mark
Mark

Reputation: 26

Editing a Slider's Thumb Template to be an Image Windows Phone 7

So I've been looking up a lot of "custom sliders" through google from all the major sources such as windowsphonegeek, msdn etc. But for some reason I can't seem to figure out how to make the thumb of the slider an image (a png for example).

Here is a little bit of xaml where the problem lies

    <Control.Template Name="ThumbTemplate1" TargetType="Thumb">
        <Image Source="myImage.png" Height="48" Width="48" />
    </Control.Template>

At the moment this will not show any thumb since it isn't loading the image properly.

Upvotes: 0

Views: 1745

Answers (2)

Mark
Mark

Reputation: 26

     <Style x:Key="ThumbStyle1" TargetType="Thumb">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="Thumb">
                    <Grid Margin="0,-15,-70,-8">
                        <Ellipse Fill="{Binding ThumbImage}" Stretch="UniformToFill"/>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

Its important to set the fill the ellipse/rectangle etc this way if you want the binding for the image since binding image brushes is very problematic, this take care of some of the hassle

Upvotes: 1

Matt Lacey
Matt Lacey

Reputation: 65556

Have you checked the path to the image (by diplaying it outside your template)?

Ensure the image file has a build action of "Content" (the default is "Resource") and ensure you start the name with a "/".

Upvotes: 0

Related Questions