Question

对于我的生活，我无法弄清楚为什么下面的简单设置不起作用。我只是希望边框在加载后放大（“放大”），放大功能包含在资源样式中。但是当下面的XAML运行时，边框只会以100％的比例加载，不会发生动画。非常感谢您的帮助！

    <Style x:Key="SZoomIn" TargetType="FrameworkElement">
        <Setter Property="RenderTransform">
            <Setter.Value>
                <ScaleTransform/>
            </Setter.Value>
        </Setter>
        <Style.Triggers>
            <EventTrigger RoutedEvent="Loaded">
                <BeginStoryboard>
                    <Storyboard>
                        <DoubleAnimationUsingKeyFrames BeginTime="0:0:0" Storyboard.TargetProperty="RenderTransform.(ScaleTransform.ScaleX)">
                            <LinearDoubleKeyFrame KeyTime="0:0:0" Value="0"/>
                            <LinearDoubleKeyFrame KeyTime="0:0:0.5" Value="1"/>
                        </DoubleAnimationUsingKeyFrames>
                        <DoubleAnimationUsingKeyFrames BeginTime="0:0:0" Storyboard.TargetProperty="RenderTransform.(ScaleTransform.ScaleY)">
                            <LinearDoubleKeyFrame KeyTime="0:0:0" Value="0"/>
                            <LinearDoubleKeyFrame KeyTime="0:0:0.5" Value="1"/>
                        </DoubleAnimationUsingKeyFrames>
                    </Storyboard>
                </BeginStoryboard>
            </EventTrigger>
        </Style.Triggers>            
    </Style>
    <Style x:Key="SBorder" BasedOn="{StaticResource SZoomIn}" TargetType="Border">
        <Setter Property="VerticalAlignment" Value="Center"/>
        <Setter Property="HorizontalAlignment" Value="Center"/>
        <Setter Property="RenderTransformOrigin" Value="0.5,0.5"/>
    </Style>

    <!-- ....... -->

    <Border Style="{StaticResource SBorder}"/>

编辑：我没有显示上面的完整标记，因此可以保持简单，但我的完整标记位于下方。请注意，因为Border中有按钮，所以Border 在运行时具有高度/宽度。

<Window x:Name="StartWindow" x:Class="MEACruncher.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:local="clr-namespace:MEACruncher"
    mc:Ignorable="d"
    Title="MEA Cruncher" Height="393" Width="659" Margin="0" WindowState="Maximized">
<Window.Background>
    <ImageBrush ImageSource="Resources/NeuronBackground.jpg" Stretch="UniformToFill"/>
</Window.Background>
<Window.Resources>
    <SolidColorBrush x:Key="BabyBlue">#FF4D7EB8</SolidColorBrush>
    <SolidColorBrush x:Key="BlackBkgrd">#B2000000</SolidColorBrush>
    <Style x:Key="SBtn" TargetType="Button">
        <Setter Property="Margin" Value="0,5"/>
        <Setter Property="Background" Value="{StaticResource BabyBlue}"/>
        <Setter Property="BorderBrush" Value="{x:Null}"/>
        <Setter Property="Padding" Value="10,3"/>
        <Setter Property="FontSize" Value="24"/>
    </Style>
    <Style x:Key="STopBtn" BasedOn="{StaticResource SBtn}" TargetType="Button">
        <Setter Property="Margin" Value="0,0,0,5"/>
    </Style>
    <Style x:Key="SBottomBtn" BasedOn="{StaticResource SBtn}" TargetType="Button">
        <Setter Property="Margin" Value="0,5,0,0"/>
    </Style>
    <Style x:Key="SZoomIn" TargetType="FrameworkElement">
        <Setter Property="RenderTransform">
            <Setter.Value>
                <ScaleTransform/>
            </Setter.Value>
        </Setter>
        <Style.Triggers>
            <EventTrigger RoutedEvent="Loaded">
                <BeginStoryboard>
                    <Storyboard>
                        <DoubleAnimationUsingKeyFrames BeginTime="0:0:0" Storyboard.TargetProperty="RenderTransform.(ScaleTransform.ScaleX)">
                            <LinearDoubleKeyFrame KeyTime="0:0:0" Value="0"/>
                            <LinearDoubleKeyFrame KeyTime="0:0:0.5" Value="1"/>
                        </DoubleAnimationUsingKeyFrames>
                        <DoubleAnimationUsingKeyFrames BeginTime="0:0:0" Storyboard.TargetProperty="RenderTransform.(ScaleTransform.ScaleY)">
                            <LinearDoubleKeyFrame KeyTime="0:0:0" Value="0"/>
                            <LinearDoubleKeyFrame KeyTime="0:0:0.5" Value="1"/>
                        </DoubleAnimationUsingKeyFrames>
                    </Storyboard>
                </BeginStoryboard>
            </EventTrigger>
        </Style.Triggers>            
    </Style>
    <Style x:Key="SBorder" BasedOn="{StaticResource SZoomIn}" TargetType="Border">
        <Setter Property="BorderBrush" Value="{StaticResource BabyBlue}"/>
        <Setter Property="BorderThickness" Value="2"/>
        <Setter Property="Background" Value="{StaticResource BlackBkgrd}"/>
        <Setter Property="CornerRadius" Value="5"/>
        <Setter Property="Padding" Value="10"/>
        <Setter Property="VerticalAlignment" Value="Center"/>
        <Setter Property="HorizontalAlignment" Value="Center"/>
        <Setter Property="RenderTransformOrigin" Value="0.5,0.5"/>
    </Style>
    <Style x:Key="SStackPnl" TargetType="StackPanel">
        <Setter Property="VerticalAlignment" Value="Center"/>
        <Setter Property="HorizontalAlignment" Value="Center"/>            
    </Style>
</Window.Resources>

<Border x:Name="MainBorder" Style="{StaticResource SBorder}">
    <StackPanel x:Name="MainStackPnl" Style="{StaticResource SStackPnl}">
        <Button x:Name="ViewProjectsBtn" Content="View Projects" Style="{StaticResource STopBtn}" Click="ViewProjectsBtn_Click"/>
        <Button x:Name="AboutBtn" Content="About" Style="{StaticResource SBtn}" Click="AboutBtn_Click"/>
        <Button x:Name="ExitBtn" Content="Exit" Style="{StaticResource SBottomBtn}" Click="ExitBtn_Click"/>
    </StackPanel>
</Border>

</Window>

Answer 1

如果以上是XAML，请按以下步骤更改您的代码：

<Border Style="{StaticResource SBorder}" Background="Red" Height="200" Width="200"/>

您已将VerticalAlignment和HorizontalAlignment设为Center，而未设置为Height＆amp;边框中的Width因此无法显示一点都不给高度和高度宽度某个值或设置我会VerticalAlignment和HorizontalAlignment到Stretch 看到Animation会正常工作。如下：

 <Style x:Key="SBorder" BasedOn="{StaticResource SZoomIn}" TargetType="Border">
        <Setter Property="VerticalAlignment" Value="Stretch"/>
        <Setter Property="HorizontalAlignment" Value="Stretch"/>
        <Setter Property="RenderTransformOrigin" Value="0.5,0.5"/>
    </Style>

如果您有其他控制层次结构，那么请更新相关内容，我会更新我的答案。

<强>更新

在您更新的标记中，边框将有Height＆amp;渲染时Width。但SZoomIn样式似乎与之前给出的XAML不同。您没有正确设置Storyboard.TargetProperty属性。您在其中缺少RenderTransform前缀。

所以解决方案是：

在Storyboard中XAML替换Storyboard中的XAML。

Answer 2

所以，正如评论中所提到的，我在这里发布的代码确实可以正常工作。问题出在一个其他标记元素上，我从原始帖子中删除了。我创建了一个名为DraggableArea的类，它继承自ContentControl，这个元素包围了我的Border（参见下面的FULL标记）。 DraggableArea使用鼠标可以拖动任何内容。我把它留在了b / c我想每个人都会专注于那个而不是看周围的XAML，在那里我确定问题所在。事实证明我错了，像往常一样我的自定义代码导致了错误。不知道为什么虫子正在发生，但你去了。感谢所有的帮助！

<local:DraggableArea>
    <Border x:Name="MainBorder" Style="{StaticResource SBorder}">
        <StackPanel x:Name="MainStackPnl" Style="{StaticResource SStackPnl}">
            <Button x:Name="ViewProjectsBtn" Content="View Projects" Style="{StaticResource STopBtn}" Click="ViewProjectsBtn_Click"/>
            <Button x:Name="AboutBtn" Content="About" Style="{StaticResource SBtn}" Click="AboutBtn_Click"/>
            <Button x:Name="ExitBtn" Content="Exit" Style="{StaticResource SBottomBtn}" Click="ExitBtn_Click"/>
        </StackPanel>
    </Border>
</local:DraggableArea>

在加载WPF时使边框向上扩展

2 个答案: