Question

我想知道是否有一个Wpf控件或示例在其垂直菜单中模仿iphone导航。（例如http://davidcann.com/iphone/）。实际上让我感兴趣的部分是在父菜单中选择一个选项后水平滚动新菜单。

我愿意接受建议。

Answer 1

听起来像一个有趣的项目！我不知道现有的WPF控件。

点击时你想模仿菜单的惯性吗？如果没有，似乎你可以使用一个列表框，其中listitem只是你的文本+网格中的图像。单击listitem时，启动故事板动画以使另一个列表框转换为左侧。我在Blend中模拟了一个非常简单的版本，没有任何剪裁：

<Window.Resources>
    <Storyboard x:Key="OnSelected1">
        <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="next_menu" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)">
            <SplineDoubleKeyFrame KeyTime="00:00:01" Value="-309"/>
        </DoubleAnimationUsingKeyFrames>
    </Storyboard>
</Window.Resources>
<Window.Triggers>
    <EventTrigger RoutedEvent="Selector.Selected" SourceName="listBoxItem">
        <BeginStoryboard Storyboard="{StaticResource OnSelected1}"/>
    </EventTrigger>
</Window.Triggers>
<Grid x:Name="LayoutRoot">
    <ListBox x:Name="main_menu" HorizontalAlignment="Left" Margin="8,8,0,8" Width="296">
        <ListBoxItem x:Name="listBoxItem" Content="ListBoxItem"/>
        <ListBoxItem Content="ListBoxItem"/>
        <ListBoxItem Content="ListBoxItem"/>
    </ListBox>
    <ListBox x:Name="next_menu" HorizontalAlignment="Right" Margin="0,8,-302,8" Width="298" RenderTransformOrigin="0.5,0.5">
        <ListBox.RenderTransform>
            <TransformGroup>
                <ScaleTransform/>
                <SkewTransform/>
                <RotateTransform/>
                <TranslateTransform/>
            </TransformGroup>
        </ListBox.RenderTransform>
        <ListBoxItem Content="ListBoxItem"/>
        <ListBoxItem Content="ListBoxItem"/>
        <ListBoxItem Content="ListBoxItem"/>
        <ListBoxItem Content="ListBoxItem"/>
        <ListBoxItem Content="ListBoxItem"/>
        <ListBoxItem Content="ListBoxItem"/>
        <ListBoxItem Content="ListBoxItem"/>
    </ListBox>
</Grid>

如果这不是您真正想要的，请提前道歉。

模仿iphone垂直菜单的Wpf UI Control？

1 个答案: