Question

我一直在创建一个菜单，当你单击一个按钮时，它会滑出并再次单击它滑入。有点像android菜单系统的工作方式，虽然你不拖动它只需单击它。

所以我想知道如何隐藏屏幕外的元素？我已经尝试设置全局偏移，但根据屏幕分辨率，我仍然可以看到应该隐藏的矩形和圆形。我确实使用边距让它工作，但这意味着我将有很大的余量来隐藏元素，只是看起来不正确。我无法使用可见性，因为我需要设置从按钮下方进入的菜单的动画。我一直在使用表达式混合4。

任何帮助都会很棒？

我解决了其中一个问题。我设法通过将组件对齐到底部或左侧来隐藏组件，然后更改渲染变换值以将其隐藏在屏幕外。我的新问题是当我点击日食按钮时，一个矩形应该填满整个背景，但它只填充了一部分。

嗨，感谢Joel的回复，我实际上发现通过设置设计视图的宽度和高度来实现。但在不同的决议上我可以看到这不起作用。我的代码是...... XAML：

<UserControl.Resources>
    <Style x:Key="ButtonStyle1" TargetType="Button">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="Button">
                    <Grid>
                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="CommonStates">
                                <VisualState x:Name="Normal"/>
                                <VisualState x:Name="MouseOver"/>
                                <VisualState x:Name="Pressed"/>
                                <VisualState x:Name="Disabled"/>
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>
                        <Ellipse x:Name="ellipse" Fill="#FF8D5216" Stroke="Black"/>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</UserControl.Resources>
<Grid Margin="0" Background="Transparent" Height="384" VerticalAlignment="Bottom">
    <VisualStateManager.VisualStateGroups>
        <VisualStateGroup x:Name="VisualStateGroup">
            <VisualStateGroup.Transitions>
                <VisualTransition GeneratedDuration="0:0:0.3"/>
            </VisualStateGroup.Transitions>
            <VisualState x:Name="Move">
                <Storyboard>
                    <DoubleAnimation Duration="0" To="0" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateY)" Storyboard.TargetName="grid" d:IsOptimized="True"/>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Margin)" Storyboard.TargetName="BlackBoarder">
                        <DiscreteObjectKeyFrame KeyTime="0">
                            <DiscreteObjectKeyFrame.Value>
                                <Thickness>0</Thickness>
                            </DiscreteObjectKeyFrame.Value>
                        </DiscreteObjectKeyFrame>
                    </ObjectAnimationUsingKeyFrames>
                    <DoubleAnimation Duration="0" To="20" Storyboard.TargetProperty="(FrameworkElement.Height)" Storyboard.TargetName="BaseBoarder" d:IsOptimized="True"/>
                </Storyboard>
            </VisualState>
            <VisualState x:Name="Down"/>
            <VisualState x:Name="SlideAcross"/>
            <VisualState x:Name="SlideBack"/>
            <VisualState x:Name="FlipForward">
                <Storyboard>
                    <DoubleAnimation Duration="0" To="0" Storyboard.TargetProperty="(UIElement.Projection).(PlaneProjection.RotationY)" Storyboard.TargetName="BlackBoarder" d:IsOptimized="True"/>
                    <DoubleAnimation Duration="0" To="0" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateY)" Storyboard.TargetName="BlackBoarder" d:IsOptimized="True"/>
                    <DoubleAnimation Duration="0" To="180" Storyboard.TargetProperty="(UIElement.Projection).(PlaneProjection.RotationX)" Storyboard.TargetName="BlackBoarder" d:IsOptimized="True"/>
                    <DoubleAnimation Duration="0" To="0" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateY)" Storyboard.TargetName="grid" d:IsOptimized="True"/>
                    <DoubleAnimation Duration="0" To="180" Storyboard.TargetProperty="(UIElement.Projection).(PlaneProjection.RotationY)" Storyboard.TargetName="grid" d:IsOptimized="True"/>
                    <DoubleAnimation Duration="0" To="0" Storyboard.TargetProperty="(UIElement.Projection).(PlaneProjection.RotationX)" Storyboard.TargetName="grid" d:IsOptimized="True"/>
                </Storyboard>
            </VisualState>
            <VisualState x:Name="FlipBack">
                <Storyboard>
                    <DoubleAnimation Duration="0" To="0" Storyboard.TargetProperty="(UIElement.Projection).(PlaneProjection.RotationY)" Storyboard.TargetName="BlackBoarder" d:IsOptimized="True"/>
                    <DoubleAnimation Duration="0" To="0" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateY)" Storyboard.TargetName="BlackBoarder" d:IsOptimized="True"/>
                    <DoubleAnimation Duration="0" To="0" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateY)" Storyboard.TargetName="grid" d:IsOptimized="True"/>
                </Storyboard>
            </VisualState>
        </VisualStateGroup>
    </VisualStateManager.VisualStateGroups>

    <Grid x:Name="grid" Height="400" VerticalAlignment="Bottom" Background="Orange" RenderTransformOrigin="0.5,0.5" Margin="0,0,0,-21">
        <Grid.Projection>
            <PlaneProjection/>
        </Grid.Projection>
        <Grid.RenderTransform>
            <CompositeTransform TranslateY="360"/>
        </Grid.RenderTransform>

        <Rectangle x:Name="MovingButtonTab" Fill="Black" Height="15" Margin="0,-14,0,0" Stroke="Black" VerticalAlignment="Top" HorizontalAlignment="Center" Width="250" MouseLeftButtonDown="ButtonTab_MouseLeftButtonDown"/>

        <Rectangle x:Name="BlackBoarder" Fill="Gray" Margin="0" Stroke="Black" RenderTransformOrigin="0.5,0.5">
            <Rectangle.Projection>
                <PlaneProjection/>
            </Rectangle.Projection>
            <Rectangle.RenderTransform>
                <CompositeTransform/>
            </Rectangle.RenderTransform>
        </Rectangle>
        <Rectangle x:Name="TitleRect" Fill="Black" Height="20" Margin="0" Stroke="Black" VerticalAlignment="Top"  RenderTransformOrigin="0.5,0.5" />
        <sdk:Label Height="20" Margin="0" Width="219" Content="" Background="Orange" Foreground="White" VerticalAlignment="Top" HorizontalAlignment="Center" RenderTransformOrigin="0.5,0.5"/>

    </Grid>
    <Rectangle x:Name="BaseBoarder" Fill="Gray" Height="20" Stroke="Black" VerticalAlignment="Bottom"/>

所以我猜测主要的父网格视图我应该添加xaml：

<RectangleGeometry Rect="0,0,640,480" />

只需将数字调整到所需的大小？这仍然会有不同于所有决议的问题吗？

另外，我创建的控件不透明，即使我将父网格设置为“透明”，它仍然具有“白色”背景。基本上，它会在菜单栏甚至在用户点击它之前就可以达到的高度填充屏幕。这周围有吗？

我解决了白色背景的问题。使用RenderTransform将对象移出“Base”状态下的查看区域似乎会导致问题。使用边距，实际上解决了这个问题。我不能告诉你为什么......我只是尝试了它并且它有效。

再次感谢

Answer 1

在Silverlight中，您需要将剪辑区域添加到基础容器中。

<Grid>
    <Grid.Clip>
        <RectangleGeometry Rect="0,0,640,480" />
    </Grid.Clip>
    // other content
</Grid>

您需要修改Rect参数或添加一些绑定以匹配您的应用程序。

一个警告：Blend尊重剪辑区域，因此一旦添加它，您将无法再看到“屏幕外”绘制的元素。

Silverlight - Expression Blend，如何在屏幕上隐藏组件

1 个答案: