Как изменить изображение кнопки, когда текстовое поле пусто в WPF?

Question

Я хочу создать SearchBox, и в настоящее время мой код выглядит следующим образом.Я пытался изменить ImageSource тега ImageBrush, когда текстовое поле пусто, но я не знаю, как правильно связать свойство Text из Textbox.Я хочу, чтобы мой SearchBox выглядел так:

Когда SearchBox пусткнопка должна показывать изображение для поиска, а когда поле поиска не пусто, кнопка должна показывать чистое изображение для поиска.Может кто-нибудь помочь мне с этим?

<TextBox Name="SearchTextBox" />

<Button Grid.Column="0" Style="{DynamicResource NoChromeButton}" BorderThickness="1" 
        VerticalAlignment="Center" HorizontalAlignment="Right" Width="25" Height="25" Click="Search_Click" Panel.ZIndex="1">
  <Button.Template>
    <ControlTemplate TargetType="{x:Type Button}">
      <Border>
        <Grid>
          <ContentPresenter />
          <Grid x:Name="StatusPanel" Background="Black" Opacity="0"/>
        </Grid>
      </Border>

      <ControlTemplate.Triggers>
        <Trigger Property="IsMouseOver" Value="true">
          <Setter TargetName="StatusPanel" Property="Opacity" Value="0.1"/>
        </Trigger>
        <Trigger Property="IsPressed" Value="true">
          <Setter TargetName="StatusPanel" Property="Opacity" Value="0.3"/>
        </Trigger>
      </ControlTemplate.Triggers>
    </ControlTemplate>
  </Button.Template>

  <Button.Content>
    <Rectangle x:Name="aaa" >
      <Rectangle.Fill>
        <ImageBrush ImageSource="pack://application:,,,/AssemblyName;component/Resources/Img1.png" />
      </Rectangle.Fill>
      <Rectangle.Style>
        <Style TargetType="{x:Type Rectangle}" >
          <Style.Triggers>
            <DataTrigger Binding="{Binding Text.Length, ElementName=SearchTextBox, UpdateSourceTrigger=PropertyChanged}" Value="0" >
              <DataTrigger.Setters>
                <Setter Property="Fill">
                  <Setter.Value>
                    <ImageBrush ImageSource="pack://application:,,,/AssemblyName;component/Resources/Img2.png" />
                  </Setter.Value>
                </Setter>
              </DataTrigger.Setters>
            </DataTrigger>
          </Style.Triggers>
        </Style>
      </Rectangle.Style>
    </Rectangle>
  </Button.Content>
</Button>

Answer 1

ты рядом.вместо локальной настройки <Rectangle.Fill> используйте настройщик стиля:

<Rectangle x:Name="aaa" >
  <Rectangle.Style>
    <Style TargetType="{x:Type Rectangle}" >
      <Setter Property="Fill">
        <Setter.Value>
          <ImageBrush ImageSource="pack://application:,,,/AssemblyName;component/Resources/Img1.png" />
        </Setter.Value>
      </Setter>
      <Style.Triggers>
        <DataTrigger Binding="{Binding Text.Length, ElementName=SearchTextBox}" Value="0" >
          <DataTrigger.Setters>
            <Setter Property="Fill">
              <Setter.Value>
                <ImageBrush ImageSource="pack://application:,,,/AssemblyName;component/Resources/Img2.png" />
              </Setter.Value>
            </Setter>
          </DataTrigger.Setters>
        </DataTrigger>
      </Style.Triggers>
    </Style>
  </Rectangle.Style>
</Rectangle>

, это необходимо, поскольку Trigger не может переопределить локальное значение