UWP PivotItem ListView TabChange问​​题

时间:2016-05-04 14:38:54

标签: .net win-universal-app windows-10 windows-10-universal

我遇到了一个奇怪的问题。我的Xaml中有Pivot,如下所示:

<Page.Resources>
    <ResourceDictionary>
        <SolidColorBrush x:Key="NavButtonPressedBackgroundBrush" Color="White" Opacity="0.3" />
        <SolidColorBrush x:Key="NavButtonCheckedBackgroundBrush" Color="White" Opacity="0.2" />
        <SolidColorBrush x:Key="NavButtonHoverBackgroundBrush" Color="White" Opacity="0.1" />

        <Style x:Key="NavRadioButtonStyle" TargetType="RadioButton">
            <Setter Property="Background" Value="Transparent"/>
            <Setter Property="Padding" Value="3"/>
            <Setter Property="HorizontalAlignment" Value="Stretch"/>
            <Setter Property="VerticalAlignment" Value="Center"/>
            <Setter Property="HorizontalContentAlignment" Value="Left"/>
            <Setter Property="VerticalContentAlignment" Value="Center"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="RadioButton">
                        <Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}">
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="CommonStates">
                                    <VisualState x:Name="Normal"/>
                                    <VisualState x:Name="PointerOver">
                                        <Storyboard>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="BackgroundGrid">
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource NavButtonHoverBackgroundBrush}"/>
                                            </ObjectAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Pressed">
                                        <Storyboard>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="BackgroundGrid">
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource NavButtonPressedBackgroundBrush}"/>
                                            </ObjectAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Disabled" />
                                </VisualStateGroup>
                                <VisualStateGroup x:Name="CheckStates">
                                    <VisualState x:Name="Checked">
                                        <Storyboard>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="BackgroundGrid">
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource NavButtonCheckedBackgroundBrush}"/>
                                            </ObjectAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Unchecked"/>
                                    <VisualState x:Name="Indeterminate"/>
                                </VisualStateGroup>
                                <VisualStateGroup x:Name="FocusStates">
                                    <VisualState x:Name="Focused"/>
                                    <VisualState x:Name="Unfocused"/>
                                    <VisualState x:Name="PointerFocused"/>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                            <Grid Name="BackgroundGrid" Background="Transparent" VerticalAlignment="Stretch">
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="48"/>
                                    <ColumnDefinition Width="*"/>
                                </Grid.ColumnDefinitions>
                                <TextBlock FontSize="34" Height="38" Text="{TemplateBinding Tag}" FontFamily="Segoe MDL2 Assets" Margin="5,8,5,5" VerticalAlignment="Center" HorizontalAlignment="Center"/>
                                <ContentPresenter x:Name="ContentPresenter" AutomationProperties.AccessibilityView="Raw" ContentTemplate="{TemplateBinding ContentTemplate}" ContentTransitions="{TemplateBinding ContentTransitions}" Content="{TemplateBinding Content}" Grid.Column="1" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" TextWrapping="Wrap" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                            </Grid>
                        </Border>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </ResourceDictionary>
</Page.Resources>


<SplitView  x:Name="MySplitView" DisplayMode="CompactOverlay" IsPaneOpen="False" 
            CompactPaneLength="48" OpenPaneLength="240" PaneBackground="DarkGray">
    <SplitView.Pane>
        <StackPanel x:Name="SplitViewPanel">

            <RadioButton x:Name="HamburgerRadioButton" Click="HamburgerRadioButton_Click" Style="{StaticResource NavRadioButtonStyle}"
                         Background="Gray" GroupName="Hamburger" Tag="" />

            <RadioButton x:Name="HomeRadioButton" Click="HomeRadioButton_Click" Style="{StaticResource NavRadioButtonStyle}"
                         Background="Gray" Content="Home" GroupName="Navigation" Tag=""/>

            <RadioButton x:Name="SettingRadioButton" Click="SettingRadioButton_Click" Style="{StaticResource NavRadioButtonStyle}"
                         Background="Gray" Content="Settings" GroupName="Navigation" Tag=""/>

        </StackPanel>
    </SplitView.Pane>
    <SplitView.Content>
        <SplitView Background="Azure" IsPaneOpen="True" OpenPaneLength="400" DisplayMode="Inline">
            <!--To Show Listing-->
            <SplitView.Pane>
                <Frame Name="FrameListing">
                    <RelativePanel>
                        <!--List Pane Header-->

                            <TextBlock Text="MY RISKS" Name="ListHeaderPanelTitle" RelativePanel.AlignLeftWithPanel="True" Padding="10"/>
                            <Button Name="ListHeaderAdd" FontFamily="Segoe MDL2 Assets" Content="" 
                                    RelativePanel.AlignRightWithPanel="True" Background="Transparent" Padding="10"/>
                            <Button Name="ListHeaderFilter" FontFamily="Segoe MDL2 Assets" Content="" 
                                    RelativePanel.LeftOf="ListHeaderAdd" Background="Transparent" Padding="10"/>

                        <!--Tabs Layout-->
                        <Pivot x:Name="rootPivot" RelativePanel.Below="ListHeaderPanelTitle">
                            <PivotItem Header="Assigned">
                                <ListView ItemsSource="{x:Bind Risks}"  IsItemClickEnabled="True" 
                                           ItemClick="ListView_ItemClick" x:Name="AssignedRisksList">
                                <ListView.ItemTemplate>
                                    <DataTemplate x:DataType="data:Risk">
                                        <StackPanel Orientation="Vertical">
                                            <TextBlock FontSize="10" Text="{x:Bind Status}"/>
                                            <TextBlock FontSize="16" Text="{x:Bind Description}"/>
                                            <TextBlock FontSize="14" Text="{x:Bind AssignedTo}"/>
                                        </StackPanel>
                                    </DataTemplate>
                                </ListView.ItemTemplate>
                                </ListView>
                                <!--<TextBlock Text="Assigned Listing will go here."/>-->
                            </PivotItem>
                            <PivotItem Header="Logged">
                                <TextBlock Text="Logged Listing will go here."/>
                            </PivotItem>
                            <PivotItem Header="All" >
                                <TextBlock Text="All Listing will go here."/>
                            </PivotItem>
                        </Pivot>

                    </RelativePanel>
                </Frame>
            </SplitView.Pane>
            <!--To SHow Detail-->
            <SplitView.Content>
                <Frame Name="FrameRiskDetail">

                </Frame>
            </SplitView.Content>
        </SplitView>
    </SplitView.Content>
</SplitView>

问题在于,当我运行应用程序时,它会向我显示已分配数据透视表项目或选项卡,并显示列表(ListView)。但是,一旦我尝试更改tab / PivotItem,就没有任何反应。标签不会改变。当我再次点击已分配标签时,列表会消失。

现在,当我设置SelectedIndex="1"并运行应用时,它会将已记录标签显示为已选中且其他每个标签都正常工作且未显示任何不当行为,即使列表未在上消失已分配标签。

<Pivot x:Name="rootPivot" RelativePanel.Below="ListHeaderPanelTitle" SelectedIndex="1">

我想将已分配标签显示为默认选定标签。即使设置SelectedIndex="0"也无法解决问题。

我做错了什么?

注意:如果需要更多信息,我会分享。

由于

1 个答案:

答案 0 :(得分:1)

可能的问题是我前面提到的Pivot的宽度。请尝试定义枢轴的某个宽度。我将您的枢轴宽度标记为打开的拆分窗格。现在工作正常。请记住,仅在任何视觉元素上捕获滑动。因此,如果您尝试在屏幕的下方滑动它将无法正常工作。要使其工作,您必须再次在那里定义容器。我使用了您的代码并在数据透视部分进行了修改。下面是代码部分使用它并测试。

                            <!--Tabs Layout-->
                        <Pivot x:Name="rootPivot" RelativePanel.Below="ListHeaderPanelTitle" Width="400">
                            <PivotItem Header="Assigned">
                                <ListView ItemsSource="{x:Bind Risks}" IsItemClickEnabled="True" 
                                       ItemClick="ListView_ItemClick" x:Name="AssignedRisksList">
                                    <ListView.ItemTemplate>
                                        <DataTemplate x:DataType="local:Risk">
                                            <StackPanel Orientation="Vertical">
                                                <TextBlock FontSize="10" Text="{x:Bind Status}"/>
                                                <TextBlock FontSize="16" Text="{x:Bind Description}"/>
                                                <TextBlock FontSize="14" Text="{x:Bind AssignedTo}"/>
                                            </StackPanel>
                                        </DataTemplate>
                                    </ListView.ItemTemplate>
                                </ListView>
                                <!--<TextBlock Text="Assigned Listing will go here."/>-->
                            </PivotItem>
                            <PivotItem Header="Logged">
                                <TextBlock Text="Logged Listing will go here."/>
                            </PivotItem>
                            <PivotItem Header="All">
                                <TextBlock Text="All Listing will go here."/>
                            </PivotItem>
                        </Pivot>