UWP PivotItem ListView TabChange 问题
UWP PivotItem ListView TabChange issue
我遇到了奇怪的问题。我的 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>
问题是，当我 运行 应用程序时，它向我显示 Assigned 枢轴项目或选项卡，并显示列表 (ListView)。但是，当我尝试更改 tab/PivotItem 时，什么也没有发生。选项卡不会更改。当我再次单击 已分配 选项卡时，列表消失了。
现在，当我设置 SelectedIndex="1" 和 运行 应用程序时，它显示 Logged 选项卡被选中，其他所有选项卡都工作正常，甚至没有显示不当行为已分配 选项卡上的列表不会消失。
<Pivot x:Name="rootPivot" RelativePanel.Below="ListHeaderPanelTitle" SelectedIndex="1">
我想将 已分配 选项卡显示为默认选择的选项卡。即使设置 SelectedIndex="0" 也不能解决问题。
我做错了什么？
注意：如果需要更多信息，我会分享。
谢谢
可能的问题是我之前提到的 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>
我遇到了奇怪的问题。我的 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>
问题是，当我 运行 应用程序时，它向我显示 Assigned 枢轴项目或选项卡，并显示列表 (ListView)。但是，当我尝试更改 tab/PivotItem 时，什么也没有发生。选项卡不会更改。当我再次单击 已分配 选项卡时，列表消失了。
现在，当我设置 SelectedIndex="1" 和 运行 应用程序时，它显示 Logged 选项卡被选中，其他所有选项卡都工作正常，甚至没有显示不当行为已分配 选项卡上的列表不会消失。
<Pivot x:Name="rootPivot" RelativePanel.Below="ListHeaderPanelTitle" SelectedIndex="1">
我想将 已分配 选项卡显示为默认选择的选项卡。即使设置 SelectedIndex="0" 也不能解决问题。
我做错了什么？
注意：如果需要更多信息，我会分享。
谢谢
可能的问题是我之前提到的 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>