Триггер не работает на пользовательский элемент управления изображения кнопка wpf - PullRequest
0 голосов
/ 19 февраля 2020

Я создал один пользовательский котрол

Generi c .xaml код ниже -

<BitmapImage x:Key="RightImaGE" x:Name="imgD" UriSource="/XYZ.UI_Test;components/Resources/Pfad55-1.png"/>

    <Style TargetType="{x:Type local1:CustomButton}" >
        <Setter Property="Template">
             <Setter.Value>
                <ControlTemplate TargetType="{x:Type local1:CustomButton}">
                    <!--<Image Name="imgDefault" Source="{TemplateBinding Image}"  Stretch="UniformToFill" />-->
                    <ControlTemplate.Triggers>

                        <DataTrigger Binding="{Binding Path=ContentOff, RelativeSource={RelativeSource  AncestorType=local1:CustomButton}}" Value="SETTINGS">
                            <Setter Property="Background" Value="Red"/>
                            <Setter  Property="Image.Source" Value="{DynamicResource RightImaGE}" />
                        </DataTrigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

Код CustomButton.cs ниже

public string ContentOff
        {
            get { return (string)GetValue(ContentOffProperty); }
            set { SetValue(ContentOffProperty, value); }
        }
        public static readonly DependencyProperty ContentOffProperty =
            DependencyProperty.Register("ContentOff",
            typeof(string), typeof(CustomButton), new PropertyMetadata(null));

        public ImageSource Image
        {
            get { return (ImageSource)GetValue(ImageProperty); }
            set { SetValue(ImageProperty, value); }
        }

        public static readonly DependencyProperty ImageProperty =
            DependencyProperty.Register("Image", typeof(ImageSource), typeof(CustomButton), new PropertyMetadata(default(ImageSource)));

I определили один общий стиль в коде app.xaml ниже

<Application.Resources>
        <Style x:Key="BigButtonStyle" TargetType="local:CustomButton" >
            <Setter Property="Control.Background" Value="Transparent"/>
            <Setter Property="VerticalAlignment" Value="Center"/>
            <Setter Property="HorizontalAlignment" Value="Left"/>
            <Setter Property="HorizontalContentAlignment" Value="Center"/>
            <Setter Property="Margin" Value="1"/>
            <Setter Property="FontSize" Value="27"/>
            <Setter Property="FontWeight" Value="Bold"/>
            <Setter Property="Foreground" Value="#1d5560"/>
            <Setter Property="Width" Value="170"/>
            <Setter Property="MaxHeight" Value="50"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type local:CustomButton}">
                        <Canvas Margin="1">
                            <Image x:Name="img" Source="Resources/Pfad55.png"  Stretch="UniformToFill" >
                                <Image.Style>
                                    <Style TargetType="{x:Type Image}">
                                        <Setter Property="Source" Value="Resources/Pfad55.png" />
                                        <!--<Style.Triggers>
                                            --><!--<Trigger Property="ContentOff" Value="SETTINGS">
                                                <Setter Property="Opacity" Value="0.5" />
                                            </Trigger>--><!--
                                        </Style.Triggers>-->
                                    </Style>
                                </Image.Style>
                            </Image>
                            <ContentPresenter HorizontalAlignment="Center" Content="{TemplateBinding ContentOff}" Canvas.Top="14" Canvas.Left="47"
                                      VerticalAlignment="Center"/>
                        </Canvas>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

Теперь у меня есть Main windows .xaml, где я использую Custombutton, и если для содержимого кнопки задано значение «Настройки», оно должно менять другое изображение с помощью триггера, чем общее изображение, которое определено в стиле Bigbutton.

<Controls:CustomButton  Grid.Row="8" Grid.Column="2" Style="{StaticResource BigButtonStyle}"
                               ContentOff="SETTINGS" 
                               Image="Resources/Pfad55-1.png"/>

Я пытался использовать триггер данных здесь, но не работал, и тоже пытался триггер свойства. Но изображение не меняется как-то.

1 Ответ

0 голосов
/ 19 февраля 2020

Вы можете использовать два разных стиля с наследованием стиля -

 <Style x:Key="SmallButtonStyle" TargetType="local:CustomButton" BasedOn="{StaticResource BigButtonStyle}">
           <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type local:CustomButton}">
                        <Canvas Margin="1">
                            <Image Source="Resources/Pfad55-1.png"  Stretch="UniformToFill"  ></Image>
                            <ContentPresenter HorizontalAlignment="Center" Content="{TemplateBinding ContentOff}" Canvas.Top="14" Canvas.Left="85"
                                      VerticalAlignment="Center"/>
                        </Canvas>

                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

, затем использовать его

    <Controls:CustomButton  Grid.Row="8" Grid.Column="2" Style="{StaticResource SmallButtonStyle}"
                       ContentOff="SETTINGS" 
                       Image="Resources/Pfad55-1.png"/>

Это будет работать, но без триггера.

Другой Решение, которое я добавил на основе вашего требования. Измените код Generi c .Xaml , как показано ниже.

<Style TargetType="{x:Type local1:CustomButton}" >
    <Setter Property="FontSize" Value="27"/>
    <Setter Property="FontWeight" Value="Bold"/>
    <Setter Property="Foreground" Value="#1d5560"/>
    <Setter Property="Template">
         <Setter.Value>                
            <ControlTemplate TargetType="{x:Type local1:CustomButton}">
                <Grid>
                    <Image  Stretch="Fill" >
                        <Image.Style>
                            <Style TargetType="{x:Type Image}">
                                <Setter Property="Source" Value="Resources/Pfad55.png" />
                                <Style.Triggers>
                                    <DataTrigger Binding="{Binding RelativeSource={RelativeSource Mode=FindAncestor,AncestorType=local1:CustomButton},Path=ContentOff}"
                                        Value="SETTINGS">
                                        <Setter Property="Source"
                                                Value="Resources/Pfad55-1.png" />
                                    </DataTrigger>
                                </Style.Triggers>
                            </Style>
                        </Image.Style>
                    </Image>
                    <ContentPresenter HorizontalAlignment="Left" Margin="50,0,0,0" Content="{TemplateBinding ContentOff}" 
                                  VerticalAlignment="Center"/>
                </Grid>
            </ControlTemplate>

        </Setter.Value>
    </Setter>
</Style>

И измените свою реализацию MainWindow.xaml с этим

<Controls:CustomButton  Grid.Row="8" Grid.Column="2" ContentOff="SETTINGS"/>

Вы использовали App.xaml стиль с BigButtonStyle , это почему пользовательские стили управления и триггер не стреляли. Ваш стиль App.xaml был локально перекрывающим пользовательский стиль элемента управления и вызывался из Generi c .xaml.

...