0

嗨，我正在开发一个 Windows 手机应用程序，我需要设置支持纵向和横向视图没有任何对齐问题。

我正在使用我的代码如下

<Grid Height="113" VerticalAlignment="Bottom" Grid.Row="3">
        <Grid.Background>
            <ImageBrush  ImageSource="Images/footer_bg .png"/>
        </Grid.Background>
        <StackPanel Margin="0,0,0,0" HorizontalAlignment="Left" >
            <Button BorderThickness="0"  Click="Home" Height="87">
                <Image Source="Images/home_30.png"  Stretch="Uniform"  VerticalAlignment="Top" Height="66" Width="68"  />
            </Button>
            <TextBlock Foreground="White" Text="Home" Padding="30,0,0,0" FontSize="20" FontFamily="Arial"></TextBlock>
        </StackPanel>
        <StackPanel Margin="60,0,224,0"  x:Name="reg"  Visibility="Visible">
            <Button BorderThickness="0"   Width="120"  Click="register" Height="87">
                <Image Source="Images/register_30.png"  Stretch="Uniform"  VerticalAlignment="Top" Height="66" Width="68"  />
            </Button>
            <TextBlock  Foreground="White" HorizontalAlignment="Center"  FontSize="20" FontFamily="Arial" Text="Register"></TextBlock>
        </StackPanel>
        <StackPanel Margin="60,0,224,0" x:Name="regi" >
            <Button BorderThickness="0"  Click="account" Width="120"  Height="87" >
                <Image Source="Images/register_30.png"   Stretch="Uniform"  VerticalAlignment="Top" Height="66" Width="68"  />
            </Button>
            <TextBlock Foreground="White" HorizontalAlignment="Center"  FontSize="20" FontFamily="Arial" Text="Account" ></TextBlock>
        </StackPanel>
        <StackPanel HorizontalAlignment="Center" Width="56" Margin="180,20,50,0">
            <Grid>
                <Image Source="Images/social_48.png"  Stretch="Uniform" x:Name="imgShareOff"  VerticalAlignment="Center"  ManipulationStarted="imgShareOff_ManipulationStarted_1"   />
                <Image Source="Images/social_48.png"  Stretch="Uniform" x:Name="imgShareOn" VerticalAlignment="Top" ManipulationStarted="imgShareOn_ManipulationStarted_1"    />
            </Grid>
            <TextBlock Foreground="White" Margin="-42,10,-27,0" Padding="10,0,0,0" FontSize="20" FontFamily="Arial" Text="Social Share"></TextBlock>
        </StackPanel>
        <StackPanel HorizontalAlignment="Right" Margin="0,0,0,0" Width="485">
            <Button BorderThickness="0"  Margin="352,0,0,0"  Click="Contact" Height="87">
                <Image Source="Images/msg_30.png"  Stretch="Uniform"  VerticalAlignment="Top" Height="66" Width="68"  />
            </Button>
            <TextBlock Foreground="White" Margin="352,0,0,0" Padding="20,0,0,0" FontSize="20" FontFamily="Arial" Text="Contact Us"></TextBlock>
        </StackPanel>
    </Grid>

我得到了下图的结果。在横向视图中，我需要在左右两侧获得适当的空间。我必须获得正确的横向视图

在此处输入图像描述 在此处输入图像描述

4

1 回答 1

0

您可以将菜单元素放在具有 4 列的网格中，每列的宽度为“*”。这种方式菜单跨越屏幕宽度。或者将它们放在具有“中心”水平对齐的 StackPanel 中。这样菜单就有一个对称的边距。

但是，您应该阅读最佳实践、设计指南和类似内容，而不是这样做：WP 应用程序 ID 的菜单始终位于硬件按钮的边缘。它不使用渐变甚至灰度。如果您不遵守这些规则，您的应用程序会给 WP 用户带来“错误”的感觉，并且会被差评。

于 2013-09-02T10:34:58.523 回答