WPF网格：设置焦点行的样式答案

【问题标题】：WPF grid: set style for focused rowWPF网格：设置焦点行的样式
【发布时间】：2014-03-18 17:32:43
【问题描述】：

我有一个简单的 WPF 网格作为示例，每行具有相同的高度 (*)。三行中的每一行都有一个文本框。我想知道是否可以在 XAML 中指定当文本框获得焦点时，相关行应增加到 2*（从而增加文本框的大小）。

谢谢...

-本

 <Window x:Class="WpfApplication2.MainWindow"                       
   xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
   xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
   Title="MainWindow" Height="350" Width="525">

   <Grid>
      <Grid.RowDefinitions>
         <RowDefinition Height="*" />
         <RowDefinition Height="*" />
         <RowDefinition Height="*" />
      </Grid.RowDefinitions>
      <TextBox Background="AliceBlue" Grid.Row="0" />
      <TextBox Background="AliceBlue" Grid.Row="1" />
      <TextBox Background="AliceBlue" Grid.Row="2" />
   </Grid>
 </Window>

【问题讨论】：

标签： c# wpf xaml

【解决方案1】：

您是否只是想在任何文本块获得焦点时使字体大小变大？如果是，那么这是一种方法

<Window.Resources>
    <Style TargetType="TextBox">
        <Style.Triggers>
            <Trigger Property="IsFocused" Value="True">
                <Setter Property="FontSize" Value="20"/>
            </Trigger>
        </Style.Triggers>
    </Style>
</Window.Resources>

<Grid>
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="*" />
            <RowDefinition Height="*" />
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>

        <TextBox Background="AliceBlue" Grid.Row="0" />
        <TextBox Background="AliceBlue" Grid.Row="1" />
        <TextBox Background="AliceBlue" Grid.Row="2" />
    </Grid>
</Grid>

【讨论】：

不完全。照原样，每个文本框占据窗口的相等部分 (33.3%)。我希望这样当用户点击文本框时，它会占用更大的部分（50%，另外两个框为 25% + 25%）。所以当点击某物时从 (* * ) 移动到 ( 2* *)。

【解决方案2】：

您可以使用Trigger 为Grid.Row 设置样式值，如下所示：

<Style TargetType="{x:Type TextBox}">
    <Style.Triggers>
        <Trigger Property="IsFocused" Value="True">
            <Setter Property="Grid.Row" Value="2" />
        </Trigger>
    </Style.Triggers>
</Style>

但是要将所有元素放在Grid 中，必须在本地为Grid.Row 设置一个值。在这种情况下，给定 Dependency Property Value Precedence 我们在 Style 中的值将被忽略。

我建议您将Height 设置为TextBox，如下所示：

<Window.Resources>
    <Style TargetType="{x:Type TextBox}">
        <Setter Property="Height" Value="100" />
        <Setter Property="Background" Value="AliceBlue" />

        <Style.Triggers>
            <Trigger Property="IsFocused" Value="True">
                <Setter Property="Height" Value="200" />
                <Setter Property="Background" Value="Beige" />
            </Trigger>
        </Style.Triggers>
    </Style>
</Window.Resources>

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="*" />
        <RowDefinition Height="*" />
        <RowDefinition Height="*" />
    </Grid.RowDefinitions>

    <TextBox Name="TextBox1" Grid.Row="0" /> 
    <TextBox Name="TextBox2" Grid.Row="1" />
    <TextBox Name="TextBox3" Grid.Row="2" /> 
</Grid>

或通过 EventTriggers 隐藏/显示TextBox，具体取决于焦点。为此，您只需为每个 TextBox 创建一个带有 GotFocus 和 LostFocus 事件的 EventTrigger。欲了解更多信息，请参阅：

MSDN: EventTrigger

【讨论】：

嗨，Anatoliy，关于第一个建议，这不会改变文本框本身的“grid.row”值吗？意思是，它不会将文本框移动到不同的网格行，而不是影响相关行的大小吗？
@BenjiFB：是的，它会改变当前TextBox 的值。直接为每个控件更改高度似乎更容易，或者将 EventTriggers 与焦点事件一起使用。
> 或将 EventTriggers 与焦点事件一起使用 - 我还需要调整文本框本身的大小，还是可以使用 EventTrigger 来调整包含行的大小？
@BenjiFB：很可能只会设置大小，我尝试在EventTrigger 中设置Grid.Row 的值，但没有成功。