Question

我想为Grid定义一个样式，我想根据不同的状态更改Grid的边框粗细。就像鼠标/指针一样，我想使厚度为1并处于正常状态（当点不在网格上时）我希望它为0.5 此外，我的网格有一个文本框，所以当该文本框处于焦点（正在编辑）时，网格边框应设置为1（如指针状态）。

这是我的代码：

<Grid>
    <TextBox
        BorderThickness="0"
        Height="40"
        Text="Text" />
</Grid>

Answer 1

您可以使用样式触发器来改变鼠标的厚度。对于文本框获得焦点，您可以使用事件触发器。

Answer 2

如果您使用的是UWP，则可以使用Xaml Interactivity库来触发此操作。一个例子：

<Page>
    <Page.Resources>
        <Storyboard x:Name="HideTextBoxAnimation">
            <DoubleAnimation
                Storyboard.TargetName="TxtBx"
                Storyboard.TargetProperty="Opacity"
                From="1"
                To="0"
                Duration="0:0:0.2" />
        </Storyboard>
    </Page.Resources>
    <Grid>
        <i:Interaction.Behaviors>
            <core:EventTriggerBehavior EventName="Tapped">
                <media:ControlStoryboardAction Storyboard="{StaticResource HideTextBoxAnimation}" />
            </core:EventTriggerBehavior>
        </i:Interaction.Behaviors>
        <TextBox x:Name="TxtBx" Opacity="1"
            BorderThickness="0"
            Height="40"
            Text="Text" />
    </Grid>
</Page>

这不是你等待的确切故事板，但我想你会得到。只需更改EventTriggerBehavior和Storyboard的EventName即可满足您的需求。

在页面顶部，您需要这些：

xmlns:i="using:Microsoft.Xaml.Interactivity"
xmlns:core="using:Microsoft.Xaml.Interactions.Core"
xmlns:media="using:Microsoft.Xaml.Interactions.Media"

希望这有帮助。

Answer 3

绝对可以在UWP中完成。他们不允许你使用样式触发器（为什么，我不知道），而是你必须使用VisualState和Storyboard。它们比WPF触发器，恕我直言更麻烦和复杂，但它们确实有效，这就是所有UWP默认样式的工作方式。

如果您还没有，请查看default UWP styles and templates。 Button是good place to start。您可以确切地看到他们如何更改Button的视觉属性以响应不同的VisualState。不幸的是 - 这就是触发器会派上用场的地方 - 输入事件和VisualState之间的关系都是在代码中完成的，所以如果内置的VisualState用于控件你就是'重新使用不足以满足您的需求，您需要在代码隐藏中手动设置它们。但是，您仍然可以对同一个控件使用不同的Style，这似乎是您的主要目标。

Blend对于这样的东西也非常有用，因为你可以很容易地测试所有Storyboard。

希望这会有所帮助。顺便说一句，大约一年前我放弃了Windows Store / UWP，直接回到WPF并没有回头。桌面应用程序转换器终于出现了，我看不出有任何理由使用UWP，除非你想要在XBox上，但那是你的电话。：）

网格的视觉状态

3 个答案: