WPF 帶有 StaticResource 的 TextBox，用於樣式和文本綁定到 ViewModel 的屬性

Question

幾天以來我一直在關注后續問題，也許我誤解了什么。

我創建了一個帶有文本框樣式設置的 ResourceDictionary，並將其添加到 App.xaml：

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                xmlns:local="clr-namespace:ZeissVorbereitung">
<Style x:Key="ModernTextbox" TargetType="{x:Type TextBox}">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type TextBox}">
                <Border CornerRadius="10"
                        Background="#353340"
                        Width="100" Height="30">
                    <Grid>
                        <Rectangle StrokeThickness="1"/>
                        <TextBox Margin="1"
                                 Text="{TemplateBinding Text}"
                                 BorderThickness="0"
                                 Background="Transparent"
                                 VerticalContentAlignment="Center"
                                 Padding="5"
                                 Foreground="#CFCFCF"
                                 x:Name="SearchBox"/>
                        
                        <TextBlock IsHitTestVisible="False"
                                   Text="Type new Entry..."
                                   VerticalAlignment="Center"
                                   HorizontalAlignment="Left"
                                   Margin="10,0,0,0"
                                   FontSize="11"
                                   Foreground="DarkGray"
                                   Grid.Column="1">

                            <TextBlock.Style>
                                <Style TargetType="{x:Type TextBlock}">
                                    <Style.Triggers>
                                        <DataTrigger Binding="{Binding Text, ElementName=SearchBox}" Value="">
                                            <Setter Property="Visibility" Value="Visible"/>
                                        </DataTrigger>
                                    </Style.Triggers>
                                    <Setter Property="Visibility" Value="Hidden"/>
                                </Style>
                            </TextBlock.Style>
                        </TextBlock>
                    </Grid>
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

然后我在視圖中創建一個文本框並成功使用樣式：

<TextBox
    Grid.Column="0"
    Grid.Row="1"
    Width="100"
    Margin="0,5,0,0"
    VerticalAlignment="Top"
    Style="{StaticResource ModernTextbox}"
    Text="{Binding AddNavigationTextField}"/>

在 ViewModel 中是用於綁定的屬性：

 private string _addNavigationTextField = "";

   public string AddNavigationTextField
   {
        get => _addNavigationTextField;
        set
        {
            _addNavigationTextField = value;
            OnProtertyChanged();
        }
    }

通常綁定有效，但我不知道如何將 Style-Resource 與動態綁定結合起來，因此我可以使用多個具有相同樣式但不同綁定的 TextBox。 謝謝您的幫助！

Answer 1

試試這樣的風格：

<Style x:Key="ModernTextbox" TargetType="{x:Type TextBox}">
    <Setter Property="Foreground" Value="#CFCFCF"/>
    <Setter Property="CaretBrush" Value="#CFCFCF"/>
    <Setter Property="Padding" Value="4"/>
    <Setter Property="VerticalContentAlignment" Value="Center"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type TextBox}">
                 <Border CornerRadius="10"
                         Background="#353340"
                         Width="100" Height="30">
                      <Grid>
                           <Rectangle StrokeThickness="1"/>
                           <ScrollViewer x:Name="PART_ContentHost" 
                                         SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"
                                         VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                                         Margin="{TemplateBinding Padding}"/>

                           <TextBlock IsHitTestVisible="False"
                                      Text="Type new Entry..."
                                      VerticalAlignment="Center"
                                      HorizontalAlignment="Left"
                                      Margin="10,0,0,0"
                                      FontSize="11"
                                      Foreground="DarkGray"
                                      x:Name="Watermark"
                                      Visibility="Collapsed">
                           </TextBlock>
                      </Grid>
                 </Border>
                 <ControlTemplate.Triggers>
                      <Trigger Property="Text" Value="">
                          <Setter Property="Visibility"  TargetName="Watermark" Value="Visible"/>
                      </Trigger>
                 </ControlTemplate.Triggers>
            </ControlTemplate>
       </Setter.Value>
    </Setter>
</Style>

我改進了觸發器，刪除了內部的 texbox 並使用了部分標准樣式。