代码之家  ›  专栏  ›  技术社区  ›  Gad

模仿iPhone垂直菜单的WPF用户界面控件?

  •  1
  • Gad  · 技术社区  · 15 年前

    我想知道是否有一个WPF控件或示例在其垂直菜单中模拟iPhone导航。(例如 http://davidcann.com/iphone/ )我真正感兴趣的部分是在父菜单中选择一个选项后,新菜单的水平滚动。

    我愿意征求意见。

    1 回复  |  直到 13 年前
        1
  •  3
  •   Dave    15 年前

    听起来是个有趣的项目!我不知道现有的WPF控件。

    你想模仿菜单的惯性吗?如果没有,您似乎可以使用一个列表框,其中列表项只是您的文本+网格中的图像。单击列表项后,启动情节提要动画,使另一个列表框转换为左侧。我模拟了一个非常简单的版本,这里没有任何剪辑,混合:

    <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>
    

    如果这不是你真正想要的,我提前道歉。