0

テキストボックスに別のテキストボックスのテキストが含まれている場合に、テキストボックスを強調表示するXAMLを作成したいと思います。基本的に、検索されたアイテムを強調表示します。

UI： これが私のUIです：

ユーザーがUIの左下にある[検索]テキストボックスに何かを入力すると、ワークステーションがツリービューからフィルタリングされ、残りのワークステーションだけに検索語が詳細に含まれるようになります。次にツリービューアイテムを選択すると、右側に詳細が表示されます。上記のワークステーション名フィールドに示されているように、検索語を含むテキストボックスを強調表示したいのですが。

これが私のコードの一部です：

ハードコードされたハイライトのあるテキストボックス

<StackPanel Grid.Column="1" Grid.Row="0">
    <Border Name="HighlightBorder" Grid.Column="1" Grid.Row="0" CornerRadius="4">
         <Border.Background>
              <RadialGradientBrush RadiusX="1" RadiusY="0.7">
                   <GradientStop Color="Black" Offset="1"/>
                   <GradientStop Color="#FFFFEA00"/>
              </RadialGradientBrush>
         </Border.Background>

         <TextBox Margin="5" Height="32" FontSize="16" Foreground="White" Text="{Binding WorkstationName, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" />
    </Border>
</StackPanel>

検索テキストボックス：

<Grid>
     <Grid.ColumnDefinitions>
           <ColumnDefinition Width="Auto"/>
            <ColumnDefinition Width="*"/>
     </Grid.ColumnDefinitions>
     <TextBlock Text="Search:" Foreground="White" FontSize="16"/>
     <TextBox Grid.Column="1" Text="{Binding SearchCriteria, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" />
</Grid>

テキストボックスに検索テキストボックスの文字列が含まれている場合に、境界線にそのグラデーションの背景のみを持たせ、それ以外の場合は黒にする簡単な方法はありますか？XAMLのみのソリューションにしたいと思っていますが、頑固でもありません。

また、背景を少しパルスするのもいいと思いますが、自分のアニメーションを理解するために戦うことができます。本当に質問の助けが必要です。

ありがとう！

4

1 に答える 1

1

コンバーターの形で少しのコードが必要になると思います

public class ContainsSearchTextConverter : IMultiValueConverter
{
    #region IMultiValueConverter Members

    public object Convert(object[] values, Type targetType, object parameter, System.Globalization.CultureInfo culture)
    {
        if (values.Any(v => v == DependencyProperty.UnsetValue))
            return null;

        var text = values[0].ToString();

        var search = values[1].ToString();

        if (string.IsNullOrWhiteSpace(search))
            return null;

        if (text.Contains(search))
            return "true";

        return null;
    }

    public object[] ConvertBack(object value, Type[] targetTypes, object parameter, System.Globalization.CultureInfo culture)
    {
        throw new NotImplementedException();
    }

    #endregion
}

次に、次のように使用します。

    <StackPanel>
        <Border Name="HighlightBorder" Grid.Column="1" Grid.Row="0" CornerRadius="4">
            <Border.Style>
                <Style TargetType="Border">
                    <Style.Triggers>
                        <DataTrigger Value="true">
                            <DataTrigger.Binding>
                                <MultiBinding Converter="{StaticResource containsSearchTextConverter}">
                                    <Binding ElementName="workStationNameTextBox" Path="Text" />
                                    <Binding Path="SearchCriteria" />
                                </MultiBinding>
                            </DataTrigger.Binding>
                            <Setter Property="Background" >
                                <Setter.Value>
                                        <RadialGradientBrush RadiusX="1" RadiusY="0.7">
                                            <GradientStop Color="Black" Offset="1"/>
                                            <GradientStop Color="#FFFFEA00"/>
                                        </RadialGradientBrush>
                                </Setter.Value>
                            </Setter>
                        </DataTrigger>
                    </Style.Triggers>
                </Style>
            </Border.Style>

            <TextBox Name="workStationNameTextBox" Background="Black" Margin="5" Height="32" FontSize="16" Foreground="White" Text="{Binding WorkstationName, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" />
        </Border>
    </StackPanel>
于 2012-07-03T03:40:43.047 に答える