Как включить прокрутку в Expander без фиксированной высоты - PullRequest
Новая
       56

Как включить прокрутку в Expander без фиксированной высоты

0 голосов
/ 13 декабря 2018

У меня проблемы с прокруткой внутри Расширителя .Поскольку поведение Expander по умолчанию расширяется, чтобы соответствовать всему контенту, прокрутка не работает ни для каких дочерних элементов управления, поскольку нет ограничения по высоте.

Вот макет, который я пытаюсь заставить работать.Я хочу, чтобы расширители растягивались до высоты окна, а не над ним, и ListView внутри первого расширителя должен прокручиваться.

enter image description here

Я могу заставить его работать, если я установлю фиксированную высоту на Expander (как в этот ответ ), но, поскольку окно приложения должно быть изменяемого размера, фиксированная высота не является решением.

Что я могу сделать? 

<Page.Resources>
  <Style TargetType="my:Expander">
    <Setter Property="ExpandDirection" Value="Right"/>
    <Setter Property="VerticalContentAlignment" Value="Stretch"/>
  </Style>
  <Style TargetType="ListView" x:Key="ListStyle">
    <Setter Property="Width" Value="350"/>
    <Setter Property="Padding" Value="10"/>
    <Setter Property="BorderBrush" Value="Gray"/>
    <Setter Property="BorderThickness" Value="0,0,1,0"/>
  </Style>
</Page.Resources>

<my:MasterDetailsView ItemsSource="{x:Bind Models}" 
                      HorizontalAlignment="Stretch" 
                      VerticalAlignment="Stretch">
  <my:MasterDetailsView.ItemTemplate>
    <DataTemplate x:DataType="local:Model">
      <TextBlock Text="{x:Bind Title}"/>
    </DataTemplate>
  </my:MasterDetailsView.ItemTemplate>
  <my:MasterDetailsView.DetailsTemplate>
    <DataTemplate x:DataType="local:Model">
      <ScrollViewer VerticalScrollMode="Disabled"
                    VerticalScrollBarVisibility="Hidden"
                    HorizontalScrollMode="Enabled"
                    HorizontalScrollBarVisibility="Auto">
        <StackPanel x:Name="root" Orientation="Horizontal">

          <my:Expander Header="Expander 1" IsExpanded="True">
            <!-- Should be scrollable! -->
            <ListView ItemsSource="{x:Bind Items}"
                      Style="{StaticResource ListStyle}"
                      ScrollViewer.VerticalScrollBarVisibility="Auto"
                      ScrollViewer.VerticalScrollMode="Enabled">
              <ListView.ItemTemplate>
                <DataTemplate x:DataType="x:String">
                  <TextBlock Text="{x:Bind}" TextWrapping="Wrap"/>
                </DataTemplate>
              </ListView.ItemTemplate>
            </ListView>
          </my:Expander>

          <my:Expander Header="Expander 2"></my:Expander>
          <my:Expander Header="Expander 3"></my:Expander>
        </StackPanel>
      </ScrollViewer>
    </DataTemplate>
  </my:MasterDetailsView.DetailsTemplate>
</my:MasterDetailsView>

1 Ответ

0 голосов
/ 14 декабря 2018

Вы довольно близки к тому, чтобы заставить его работать, вам просто нужно изменить VerticalScrollBarVisibility вашего ScrollViewer на Disabled

            <ScrollViewer VerticalScrollMode="Disabled"
                          VerticalScrollBarVisibility="Disabled"
                          HorizontalScrollMode="Enabled"
                          HorizontalScrollBarVisibility="Auto">
...