Good afternoon.

The following style is available:

<Style x:Key="Style_MainButtons" TargetType="ToggleButton"> <Setter Property="Width" Value="110" /> <Setter Property="Height" Value="110" /> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="{x:Type ToggleButton}"> <Grid> <Grid.RowDefinitions> <RowDefinition Height="Auto" /> <RowDefinition /> </Grid.RowDefinitions> <TextBlock x:Name="Text" HorizontalAlignment="Center" /> <Image x:Name="Image" Grid.Row="1" /> </Grid> <ControlTemplate.Triggers> </ControlTemplate.Triggers> </ControlTemplate> </Setter.Value> </Setter> </Style>

Since there are several buttons and each has its own text and picture, I would like to assign the content of the text and the address of the picture in the following code:

 <ToggleButton x:Name="btnHorizontal" Style="{StaticResource Style_MainButtons}" Grid.Column="0" Grid.Row="1" Checked ="SetVersion" Unchecked ="SetVersion" IsChecked="True" > </ToggleButton>

How can this be done?

  • Well, put a pair of attached property, the business. For text, you can generally use Content . - VladD
  • @VladD, but can you tell me more? Since the tinkering on the Internet "attached property" did not give anything suitable. - Arik

2 answers 2

The easiest is probably the case.

To begin with, add to the ToggleButton attached property, from which you will read the picture. (This is most easily done using the propa snippet.)

 public static class ToggleButtonExtensions { public static ImageSource GetImageSource(DependencyObject obj) { return (ImageSource)obj.GetValue(ImageSourceProperty); } public static void SetImageSource(DependencyObject obj, ImageSource value) { obj.SetValue(ImageSourceProperty, value); } public static readonly DependencyProperty ImageSourceProperty = DependencyProperty.RegisterAttached( "ImageSource", typeof(ImageSource), typeof(ToggleButtonExtensions), new PropertyMetadata(null)); }

Now we modify the template so that it reads the text from the Content , and the source for the image from the attached attached property. (Note the parenthesis syntax.)

 <Setter.Value> <ControlTemplate TargetType="{x:Type ToggleButton}"> <Grid> <Grid.RowDefinitions> <RowDefinition Height="Auto" /> <RowDefinition /> </Grid.RowDefinitions> <TextBlock x:Name="Text" HorizontalAlignment="Center" Text="{TemplateBinding Content}"/> <Image x:Name="Image" Grid.Row="1" Source="{Binding (local:ToggleButtonExtensions.ImageSource), RelativeSource={RelativeSource TemplatedParent}}"/> </Grid> </ControlTemplate> </Setter.Value>

And use:

 <ToggleButton x:Name="btnHorizontal" Style="{StaticResource Style_MainButtons}" IsChecked="True" local:ToggleButtonExtensions.ImageSource="logo4w.png"> Всем привет, я Пикачу! </ToggleButton>
  • Thanks It works. It is strange that such things are not implemented in the default language. - Arik
  • @Arik: Please! // With the language, the problem is that WPF as a library is outside the language, so you have to get out. - VladD pm

If I understand correctly, you just need to add the

 <Style x:Key="Style_MainButtons" TargetType="ToggleButton"> <Setter Property="Width" Value="110" /> <Setter Property="Height" Value="110" /> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="{x:Type ToggleButton}"> <Grid> <Grid.RowDefinitions> <RowDefinition Height="Auto" /> <RowDefinition /> </Grid.RowDefinitions> <TextBlock Text="{Binding Text}" HorizontalAlignment="Center" /> <Image Source="{Binding Image}" Grid.Row="1" /> </Grid> </ControlTemplate> </Setter.Value> </Setter> </Style>

And, accordingly, in the ViewModel have Text and Image properties.

If the style is used as a template for the toolbar, changing only image and text, then you need to use a TemplateBinding:

 Content="{TemplateBinding SomeProperty}"

where SomeProperty is the source property for the substitution in the template.

  • <TextBlock Content = "{Binding Text}" HorizontalAlignment = "Center" /> throws the error: "The property 'TextBlock'" - Arik
  • Yes, of course there Text - Arheus 1:53 pm