Windows Phone 8 - 中心 PanoramaItem.Header答案

【问题标题】：Windows Phone 8 - Center PanoramaItem.HeaderWindows Phone 8 - 中心 PanoramaItem.Header
【发布时间】：2013-12-06 12:58:20
【问题描述】：

我正在为 Windows Phone 8 开发全景应用程序，但遇到了一个小问题。我在其中一个 Panorama.Item 的标题中添加了一个图像（它显示得很好），但我希望它居中而不是左对齐。我什至不知道这是否可能，或者您是否根本无法更改对齐方式。这是我正在谈论的标题的代码：

<phone:PanoramaItem.Header>
   <Image x:Name="Logo" Height="100" HorizontalAlignment="Center" Tap="Logo_Tap" />
</phone:PanoramaItem.Header>

不幸的是，HorizontalAlignment="Center"-Property 似乎没有这样做。任何帮助将不胜感激。

【问题讨论】：

标签： xaml windows-phone-8

【解决方案1】：

我会避免使用硬编码宽度。正确的方法是覆盖PanoramaItem 上的模板，就像这样（他们的关键部分是更改header 上的HorizontalAlignment ContentControl）

<ControlTemplate x:Key="CenteredHeaderPanoramaItemTemplate" TargetType="phone:PanoramaItem">
    <Grid Background="{TemplateBinding Background}" Margin="12,0,0,0">
        <Grid.RowDefinitions>
            <RowDefinition Height="auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
        <ContentControl x:Name="header" CharacterSpacing="-35" ContentTemplate="{TemplateBinding HeaderTemplate}" Content="{TemplateBinding Header}" FontSize="66" FontFamily="{StaticResource PhoneFontFamilySemiLight}" Margin="12,-2,0,38" HorizontalAlignment="Stretch">
            <ContentControl.RenderTransform>
                <TranslateTransform x:Name="headerTransform"/>
            </ContentControl.RenderTransform>
        </ContentControl>
        <ContentPresenter Content="{TemplateBinding Content}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" Grid.Row="1" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
    </Grid>
</ControlTemplate>

然后只需使用 StaticResource 分配模板

<phone:PanoramaItem Template="{StaticResource CenteredHeaderPanoramaItemTemplate}">
    <phone:PanoramaItem.Header>
        <Image x:Name="Logo" Height="100" HorizontalAlignment="Center" Tap="Logo_Tap" />
    </phone:PanoramaItem.Header>
    <Grid x:Name="PanoramaItemContent">
    </Grid>
</phone:PanoramaItem>

【讨论】：

感谢您的详细解答。我不明白这一切，因为我对 XAML 本身还是很陌生，但我了解您的目标。我试图在我的代码中使用这个 sn-p，但我收到一个错误，我不知道它来自哪里：Unexpected ATTRIBUTE in parse rule PropertyElement ::= . PROPERTYELEMENT Content? ENDTAG.. 好像我在某处缺少一个结束标签，但标记在编辑。我只在构建项目后才收到此错误。有什么想法吗？
您需要将ControlTemplate 放在“资源”部分。在页面顶部添加并将其放入其中。

【解决方案2】：

最简单的方法是：

<phone:PanoramaItem.Header>     
                        <Grid Width="432">
                            <Image x:Name="Logo"
                                   Height="100"
                                   HorizontalAlignment="Center"
                                   Tap="Logo_Tap" />
                        </Grid>
</phone:PanoramaItem.Header>

【讨论】：

哦，我没有想到这一点，但是将它包装在一个 Grid 中并将其置于该 Grid 中是有意义的。谢谢！

【解决方案3】：

<phone:PanoramaItem.Header>
<Grid  HorizontalAlignment="Center">
   <Image x:Name="Logo" Height="100" Tap="Logo_Tap" />
</Grid>
</phone:PanoramaItem.Header>

试试这个

【讨论】：