Nestor
Nestor

Reputation: 15

wpf style ellipse button Fill property Image

Hello I am trying to create a RadialButton style with an image and I want that image (source) to be variable.

<Style x:Key="RadialButton1" TargetType="Button">
              <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <Ellipse
                            Stroke="Black" 
                            HorizontalAlignment="Center"
                            VerticalAlignment="Center"
                            Width="60"
                            Height="60"
                            x:Name="Ellipse" >
                            <Ellipse.Fill >
                                <ImageBrush ImageSource="/DessCol;component/Images/Recommencer.ico"/>
                            </Ellipse.Fill>
                         </Ellipse>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

....

<Button  Height="37" HorizontalAlignment="Left" Margin="15,20,0,0" Name="btnRecommencer" VerticalAlignment="Top" Width="51"  Style="{StaticResource RadialButton1}" Click="btnRecommencer_Click"/>

I want the Ellipse.Fill property to be variable and set by the Content attribute of the Button. I'll be looking to Binding, RelativeSource, etc... but would appreciate if someone have an idea of how to achieve this

Thank you

Addendum

Something like

<Ellipse Fill="{TemplateBinding Content}"/> 

Upvotes: 1

Views: 7543

Answers (1)

Fredrik Hedblad
Fredrik Hedblad

Reputation: 84657

You can use RelativeSource in the Binding

<Style x:Key="RadialButton1" TargetType="Button">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="Button">
                <Ellipse Stroke="Black" HorizontalAlignment="Center" VerticalAlignment="Center"
                         Width="60" Height="60" x:Name="Ellipse" >
                    <Ellipse.Fill >
                        <ImageBrush ImageSource="{Binding RelativeSource={RelativeSource AncestorType={x:Type Button}},
                                                          Path=Content}"/>
                    </Ellipse.Fill>
                </Ellipse>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

Upvotes: 2

Related Questions