如何使TreeViewItem標頭的一部分變為粗體？

Question

我正在嘗試在SQL和wpf中實現一個簡單的搜索功能...我只需要突出顯示已在TextBox輸入的結果中的下一部分內容。

因此，我在SQL中進行搜索以獲取結果並將其放在TreeViewItem ，然后將其添加到TreeView 。 一切正常，但是我將如何僅使TreeViewItem標頭的特定部分TreeViewItem粗體？

我已經知道如何找到我想要加粗的文本的位置，但是我只需要將其加粗即可。

TreeViewItem root_item = new TreeViewItem() { Header = "Users" };
FoundUsersTreeView.Items.Add(root_item);
while (sqlReader.Read()) 
{
    TreeViewItem new_item = new TreeViewItem() { Header = sqlReader.GetString(0) };
    root_item.Items.Add(new_item);
}

Answer 1

您可以使用TreeViewItem HeaderTemplate實現此目的。 從后面的代碼添加TreeViewItem ，可以使用Tag屬性來區分需要將哪個設置為Bold 。

您可以在DataTemplate下面添加到Resources 。

DataTemplate中

<DataTemplate x:Key="headerTemplate">
    <TextBlock Text="{Binding}">
        <TextBlock.Style>
            <Style TargetType="TextBlock">
                <Style.Triggers>
                    <DataTrigger Binding="{Binding Tag, RelativeSource={RelativeSource AncestorType=TreeViewItem, Mode=FindAncestor}}" 
                                 Value="True">
                        <Setter Property="FontWeight" Value="Bold"/>
                    </DataTrigger>
                </Style.Triggers>
            </Style>
        </TextBlock.Style>
    </TextBlock>
</DataTemplate>

背后的代碼

TreeViewItem root_item = new TreeViewItem() { Header = "Users" };
treeView.Items.Add(root_item);
while (sqlReader.Read()) 
{
    var new_item = new TreeViewItem { Header = sqlReader.GetString(0), Tag = true };
    new_item.HeaderTemplate = Resources["headerTemplate"] as DataTemplate;
    root_item.Items.Add(new_item);
}

您可以將boolean值設置為Tag屬性，以使該Node為Bold 。

Answer 2

如果要使用wpf進行大量工作，則應使用MVVM。 對於非常簡單的內容，直接使用控件是可以的，但難度會很快提高。 您應該改為將數據和模板綁定到控件中。

這就是打算使用WPF的方式。

處理基礎數據而不是控件。

如果您看一下此示例：

https://gallery.technet.microsoft.com/WPF-Highlight-Matching-71ad5a04

它使用列表視圖而不是樹形視圖，並通過將背景設為紅色來突出顯示文本。 不完全是您所需要的。 但是原則是要看的東西。

您可以輕松地將列表視圖更改為樹視圖。

話雖如此，您似乎只在樹狀視圖中具有項目級別，因此您無論如何都可以使用列表視圖。

無論如何。

如果您看一看，您會看到每個項目都使用正則表達式拆分，因此每個部件都有一個單獨的RunHi視圖模型。 匹配的塊在其RunHi上將IsMatch設置為true。 它們被模板化為水平列表視圖-因此它看起來像一個文本塊，但實際上是一個或多個排列在一起的。 列表視圖的每一行本身就是一個列表視圖。 當然，如果您特別想要一個樹視圖，則可以將每個treeviewitem的標題設置為listview。

數據觸發器用於使背景變黃。 要使其變為粗體，您可以更改該部分：

  <ControlTemplate TargetType="{x:Type ListViewItem}">
      <TextBlock Text="{Binding Text}">
           <TextBlock.Style>
                  <Style TargetType="TextBlock">
                       <Style.Triggers>
                             <DataTrigger Binding="{Binding IsMatch}" Value="True">
                                   <Setter Property="FontWeight" Value="Bold"/>
                              </DataTrigger>
                        </Style.Triggers>
                   </Style>
              </TextBlock.Style>
         </TextBlock>
     </ControlTemplate>