Question

我正在尝试创建一个像Visual Studio这样的设计器。

假设我有一个网格。在里面，我有一个TextBox和一个TextBlock。为了更好地理解，请查看下面的示例代码：

<Page.Resources>
    <Style x:Key="myStyle" TargetType="{x:Type Border}">
        <Setter Property="BorderBrush" Value="Transparent" />
        <Setter Property="BorderThickness" Value="2" />
        <Style.Triggers>
           <Trigger Property="IsMouseOver" Value="True">
               <Setter Property="BorderBrush" Value="DodgerBlue" />
           </Trigger>
        </Style.Triggers>
    </Style>
</Page.Resources>

<Border Style="myStyle">
    <Grid>
        <Border Style="myStyle">
            <TextBox ...... />
        </Border>
        <Border Style="myStyle">
            <TextBlock ...... />
        </Border>
    </Grid>
</Border>

现在当我在任何一个元素上鼠标移动时，我想在它周围找到一个边框。

我的问题：

当鼠标光标位于文本块上时，我会在网格周围找到边框以及文本块周围的边框。
当我的鼠标光标越过网格的空白区域时，边框不会显示。

要求：

当鼠标光标越过文本块时，网格周围的边框将变为不可见。
当鼠标光标越过网格中的空白区域时，网格周围的边框应该可见。

请建议我在上述代码中进行的更改，以获得所需的功能。

Answer 1

为什么要将Style指定给外边框？把它留下来吧。

Answer 2

1：我认为，你的父母边界发光的想法并不好。因为只要用户将鼠标悬停在网格上，它就会闪烁。也许，它会惹恼用户：）

2：尝试设置Grid.Background =“Transparent”。

Answer 3

试试这个

<Grid Background="LightGray" >
        <Grid.Triggers>
            <EventTrigger RoutedEvent="MouseEnter">
                <BeginStoryboard>
                    <Storyboard >
                        <DoubleAnimation From="0" To="1" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="Grid_Bd" Duration="0:0:0.1"></DoubleAnimation>
                    </Storyboard>
                </BeginStoryboard>
            </EventTrigger>
            <EventTrigger RoutedEvent="MouseLeave">
                <BeginStoryboard>
                    <Storyboard >
                        <DoubleAnimation From="1" To="0" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="Grid_Bd" Duration="0:0:0.1"></DoubleAnimation>
                    </Storyboard>
                </BeginStoryboard>
            </EventTrigger>
        </Grid.Triggers>

        <Grid Height="50"  Width="50">
            <Border x:Name="TextBlock_Bd" Opacity="0"  BorderBrush="Blue" BorderThickness="1"/>
            <TextBlock Text="Hello !!" HorizontalAlignment="Center" VerticalAlignment="Center">
                <TextBlock.Triggers>
                    <EventTrigger RoutedEvent="MouseEnter">
                        <BeginStoryboard>
                            <Storyboard >
                                <DoubleAnimation From="0" To="1" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="TextBlock_Bd" Duration="0:0:0.1"></DoubleAnimation>
                            </Storyboard>
                        </BeginStoryboard>
                    </EventTrigger>
                    <EventTrigger RoutedEvent="MouseLeave">
                        <BeginStoryboard>
                            <Storyboard >
                                <DoubleAnimation From="1" To="0" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="TextBlock_Bd" Duration="0:0:0.1"></DoubleAnimation>
                            </Storyboard>
                        </BeginStoryboard>
                    </EventTrigger>
                </TextBlock.Triggers>
            </TextBlock>
        </Grid>
        <Border x:Name="Grid_Bd" Opacity="0"  BorderBrush="Red" BorderThickness="1"/>                           
    </Grid>

在适当的时间不显示控件的边框

3 个答案: