UWP: проблемы с SplitView с VisualStateManager

Question

Я боролся с управлением SplitView, пытаясь создать образец (и простой!) UW App. Первый список вопросов, а затем код:

1. Я использую VisualStateManager контролировать DisplayState и Pane видимость. Поэтому я не использую соответствующие атрибуты (DisplayMode и IsPaneOpen) в XAML.
   Вопросы, относящиеся:
   a.иногда художник-дизайнер Exception from HRESULT: 0x88000FA8
   б. Панель всегда находится в Closed Состояние - в Дизайнере и в Runtime.
   c. Я также получаю исключение во время выполнения, показывая Debugger код, но после перезапуска Visual Studio он остановлен.
2. Если я добавлю два атрибута в разметке XAML (комментируя VisualStateManager), то для следующей комбинации кнопка Hamburger не работает: IsPaneOpen="False" DisplayMode="Overlay". Код для кнопки Hamburger ясно ваниль - MainSplitView.IsPaneOpen = !MainSplitView.IsPaneOpen;

Markup:

<VisualStateManager.VisualStateGroups> 
     <VisualStateGroup> 
      <VisualState> 
       <VisualState.StateTriggers> 
        <AdaptiveTrigger MinWindowWidth="721" /> 
       </VisualState.StateTriggers> 
       <VisualState.Setters> 
        <Setter Target="MainSplitView.DisplayMode" Value="Inline" /> 
        <Setter Target="MainSplitView.IsPaneOpen" Value="True" /> 
       </VisualState.Setters> 
      </VisualState> 
      <VisualState> 
       <VisualState.StateTriggers> 
        <AdaptiveTrigger MinWindowWidth="548" /> 
       </VisualState.StateTriggers> 
       <VisualState.Setters> 
        <Setter Target="MainSplitView.DisplayMode" Value="CompactOverlay" /> 
        <Setter Target="MainSplitView.IsPaneOpen" Value="True" /> 
       </VisualState.Setters> 
      </VisualState> 
      <VisualState> 
       <VisualState.StateTriggers> 
        <AdaptiveTrigger MinWindowWidth="0" /> 
       </VisualState.StateTriggers> 
       <VisualState.Setters> 
        <Setter Target="MainSplitView.DisplayMode" Value="Overlay" /> 
        <Setter Target="MainSplitView.IsPaneOpen" Value="False" /> 
       </VisualState.Setters> 
      </VisualState> 
     </VisualStateGroup> 
    </VisualStateManager.VisualStateGroups> 

    <RelativePanel Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"> 
     <Button Name="HamBurgerButton" Background="Transparent" Padding="0,-6" Margin="12" Click="HamBurgerButton_Click"> 
      <FontIcon FontFamily="{ThemeResource ContentControlThemeFontFamily}" 
         Glyph="&#x2261;" FontSize="32" Margin="0,-8,0,0"/> 
     </Button> 
     <TextBlock RelativePanel.RightOf="HamBurgerButton" 
        Style="{ThemeResource TitleTextBlockStyle}" Margin="5,0,0,0" 
        Text="Title"/> 
     <SplitView x:Name="MainSplitView" PaneBackground="{ThemeResource ApplicationPageBackgroundThemeBrush}" 
        RelativePanel.AlignLeftWithPanel="True" RelativePanel.AlignRightWithPanel="True" 
        RelativePanel.Below="HamBurgerButton" OpenPaneLength="200" CompactPaneLength="50"> 
      <SplitView.Pane> 
       <StackPanel Orientation="Horizontal" Background="Gray"> 
        <AppBarButton x:Name="AboutButton" Icon="Important" IsCompact="True" Click="AboutButton_Click"/> 
        <TextBlock Text="About"/> 
       </StackPanel> 
      </SplitView.Pane> 
      <SplitView.Content> 
       <ScrollViewer VerticalScrollBarVisibility="Auto" VerticalScrollMode="Auto" 
           HorizontalScrollBarVisibility="Disabled" HorizontalScrollMode="Disabled"> 
        <Frame x:Name="ContentFrame"/> 
       </ScrollViewer> 
      </SplitView.Content> 
     </SplitView> 
    </RelativePanel> 

Так может кто-либо подтвердить, что эти проблемы могут быть воспроизведены в их конце (т.е. они являются ошибки), или Я где-то ошибаюсь или есть обходные пути?

Answer 1

Этот код будет работать ...

<RelativePanel Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"> 
    <Button Name="HamBurgerButton" Background="Transparent" Padding="0,-6" Margin="12" Click="HamBurgerButton_Click"> 
     <FontIcon FontFamily="{ThemeResource ContentControlThemeFontFamily}" 
       Glyph="&#x2261;" FontSize="32" Margin="0,-8,0,0"/> 
    </Button> 
    <TextBlock RelativePanel.RightOf="HamBurgerButton" 
      Style="{ThemeResource TitleTextBlockStyle}" Margin="5,0,0,0" 
      Text="Title"/> 
    <SplitView x:Name="MainSplitView" IsPaneOpen="False" PaneBackground="{ThemeResource ApplicationPageBackgroundThemeBrush}" 
      RelativePanel.AlignLeftWithPanel="True" RelativePanel.AlignRightWithPanel="True" 
      RelativePanel.Below="HamBurgerButton" OpenPaneLength="200" CompactPaneLength="50"> 
     <SplitView.Pane> 
      <StackPanel Orientation="Horizontal" Background="Gray"> 
       <AppBarButton x:Name="AboutButton" Icon="Important" IsCompact="True" Click="AboutButton_Click"/> 
       <TextBlock Text="About"/> 
      </StackPanel> 
     </SplitView.Pane> 
     <SplitView.Content> 
      <ScrollViewer VerticalScrollBarVisibility="Auto" VerticalScrollMode="Auto" 
         HorizontalScrollBarVisibility="Disabled" HorizontalScrollMode="Disabled"> 
       <Frame x:Name="ContentFrame"/> 
      </ScrollViewer> 
     </SplitView.Content> 
    </SplitView> 
    <VisualStateManager.VisualStateGroups> 
     <VisualStateGroup> 
      <VisualState> 
       <VisualState.StateTriggers> 
        <AdaptiveTrigger MinWindowWidth="721" /> 
       </VisualState.StateTriggers> 
       <VisualState.Setters> 
        <Setter Target="MainSplitView.DisplayMode" Value="Inline" /> 
        <Setter Target="MainSplitView.IsPaneOpen" Value="True" /> 
       </VisualState.Setters> 
      </VisualState> 
      <VisualState> 
       <VisualState.StateTriggers> 
        <AdaptiveTrigger MinWindowWidth="548" /> 
       </VisualState.StateTriggers> 
       <VisualState.Setters> 
        <Setter Target="MainSplitView.DisplayMode" Value="CompactOverlay" /> 
        <Setter Target="MainSplitView.IsPaneOpen" Value="True" /> 
       </VisualState.Setters> 
      </VisualState> 
      <VisualState> 
       <VisualState.StateTriggers> 
        <AdaptiveTrigger MinWindowWidth="0" /> 
       </VisualState.StateTriggers> 
       <VisualState.Setters> 
        <Setter Target="MainSplitView.DisplayMode" Value="Inline" /> 
       </VisualState.Setters> 
      </VisualState> 
     </VisualStateGroup> 
    </VisualStateManager.VisualStateGroups> 
</RelativePanel> 

Кнопка гамбургер не работает, когда ширина составляла от 0 до 548, потому что режим установлен для наложения ... на самом деле была открыта панель и закрылся за рамкой ... поэтому не было видно, что заставило вас думать, что кнопка не работает. Это не ошибка в splitview ... Если это не работает комментарий ... поможет вам ...

Answer 2

Я не думаю, что ваш Adaptive Trigger работает в конце концов. Поместите его внутри relativePanel и посмотрите, активируется ли он.

<RelativePanel Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"> 
    <Button Name="HamBurgerButton" Background="Transparent" Padding="0,-6" Margin="12" Click="HamBurgerButton_Click"> 
     <FontIcon FontFamily="{ThemeResource ContentControlThemeFontFamily}" 
        Glyph="&#x2261;" FontSize="32" Margin="0,-8,0,0"/> 
    </Button> 
    <TextBlock RelativePanel.RightOf="HamBurgerButton" 
       Style="{ThemeResource TitleTextBlockStyle}" Margin="5,0,0,0" 
       Text="Title"/> 
    <SplitView x:Name="MainSplitView" PaneBackground="{ThemeResource ApplicationPageBackgroundThemeBrush}" 
       RelativePanel.AlignLeftWithPanel="True" RelativePanel.AlignRightWithPanel="True" 
       RelativePanel.Below="HamBurgerButton" OpenPaneLength="200" CompactPaneLength="50"> 
     <SplitView.Pane> 
      <StackPanel Orientation="Horizontal" Background="Gray"> 
       <AppBarButton x:Name="AboutButton" Icon="Important" IsCompact="True" Click="AboutButton_Click"/> 
       <TextBlock Text="About"/> 
      </StackPanel> 
     </SplitView.Pane> 
     <SplitView.Content> 
      <ScrollViewer VerticalScrollBarVisibility="Auto" VerticalScrollMode="Auto" 
          HorizontalScrollBarVisibility="Disabled" HorizontalScrollMode="Disabled"> 
       <Frame x:Name="ContentFrame"/> 
      </ScrollViewer> 
     </SplitView.Content> 
    </SplitView><VisualStateManager.VisualStateGroups> 
    <VisualStateGroup> 
     <VisualState> 
      <VisualState.StateTriggers> 
       <AdaptiveTrigger MinWindowWidth="721" /> 
      </VisualState.StateTriggers> 
      <VisualState.Setters> 
       <Setter Target="MainSplitView.DisplayMode" Value="Inline" /> 
       <Setter Target="MainSplitView.IsPaneOpen" Value="True" /> 
      </VisualState.Setters> 
     </VisualState> 
     <VisualState> 
      <VisualState.StateTriggers> 
       <AdaptiveTrigger MinWindowWidth="548" /> 
      </VisualState.StateTriggers> 
      <VisualState.Setters> 
       <Setter Target="MainSplitView.DisplayMode" Value="CompactOverlay" /> 
       <Setter Target="MainSplitView.IsPaneOpen" Value="True" /> 
      </VisualState.Setters> 
     </VisualState> 
     <VisualState> 
      <VisualState.StateTriggers> 
       <AdaptiveTrigger MinWindowWidth="0" /> 
      </VisualState.StateTriggers> 
      <VisualState.Setters> 
       <Setter Target="MainSplitView.DisplayMode" Value="Overlay" /> 
       <Setter Target="MainSplitView.IsPaneOpen" Value="False" /> 
      </VisualState.Setters> 
     </VisualState> 
    </VisualStateGroup> 
</VisualStateManager.VisualStateGroups> 
</RelativePanel>