集线器页面标题模板无法按预期工作

时间:2017-10-13 10:03:28

标签: xaml uwp

我正在将一些Win RT代码移植到UWP。其中一个不能按预期工作的页面是HubPage。

我在HubSection HeaderTemplate中有一个按钮,应该替换“查看更多”HyperLink。我的模板中的按钮出现但不接受点击。

文档声明我应该能够用我自己的模板替换“看到更多”超链接,我相信这是我的代码正在做但不起作用。

如果我试图替换IsHeaderInteractive HubSection,我不确定HeaderTemplate应该是什么价值。任何有用的帮助

<Page
    x:Class="Hub_Page.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:Hub_Page"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">

    <Page.Resources>
        <Style TargetType="HubSection">
            <Setter Property="HeaderTemplate">
                <Setter.Value>
                    <DataTemplate>
                        <Button Content="This doesn't click!"
                                Background="DarkCyan" Tapped="UIElement_OnTapped"/>
                    </DataTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </Page.Resources>

    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">

        <Grid x:Name="outerGrid">
            <Grid x:Name="innerGrid"
              VerticalAlignment="Top">
                <Hub x:Name="hub" SectionHeaderClick="Hub_OnSectionHeaderClick" >
                    <Hub.Header>
                        <!-- Back button and page title -->
                        <Grid>
                            <StackPanel Margin="13,0,20,0" Orientation="Horizontal">
                                <Button x:Name="backButton"  Margin="0,0,20,0"/>
                                <TextBlock Text="x Manage Playlists" Margin="0,0,10,5" HorizontalAlignment="Left"/>
                                <Button Content="This does click"
                                        Background="DarkGray" Tapped="UIElement_OnTapped"/>
                            </StackPanel>
                        </Grid>
                    </Hub.Header>

                    <!-- Playlists section -->
                    <HubSection Header="x Playlists" IsHeaderInteractive="True" >
                        <DataTemplate>
                            <ListView x:Name="playlistListView"
                                  HorizontalAlignment="Stretch"
                                  VerticalAlignment="Top"
                                  SelectionMode="Single">
                                <ListView.ItemContainerStyle>
                                    <Style TargetType="ListViewItem">
                                        <Setter Property="HorizontalContentAlignment" Value="Stretch" />
                                    </Style>
                                </ListView.ItemContainerStyle>
                                <ListView.ItemTemplate>
                                    <DataTemplate>
                                        <!-- A playlist -->
                                        <Grid  HorizontalAlignment="Stretch">
                                            <StackPanel Margin="10" Orientation="Vertical" HorizontalAlignment="Stretch" MaxWidth="500">
                                                <TextBlock  Text="{Binding Name}" TextTrimming="WordEllipsis" />
                                            </StackPanel>
                                        </Grid>
                                    </DataTemplate>
                                </ListView.ItemTemplate>
                            </ListView>
                        </DataTemplate>
                    </HubSection>
                </Hub>
            </Grid>
        </Grid>
    </Grid>
</Page>

1 个答案:

答案 0 :(得分:0)

这是设计的。您可以自己制作自己的HubSection按钮。例如,如下所示:

<HubSection>
     <DataTemplate>
          <StackPanel>
               <Button Content="Header" Click="Button_Click" Margin="0 0 0 10"></Button>
               <TextBlock Text="here is content."></TextBlock>
          </StackPanel>
    </DataTemplate>
</HubSection>