Как заставить scrollviewer работать в этом сценарии?

Имею некоторые проблемы с моим MVVM-приложением. Так сценарий заключается в следующем:Как заставить scrollviewer работать в этом сценарии?

В моей MainWindow.xaml, у меня есть ContentControl помещены в грид колонке, его содержание связывают с CurrentViewModel выдаваемого на соответствующий View (в данном случае , Overview.xaml).
```
 <ContentControl Grid.Row="1" Grid.Column="1" Content="{Binding CurrentViewModel}"> 
```

В данном конкретном зрения (Overview.xaml) существуют многочисленные элементы управления UserControl, помещенные внутри StackPanel.

<ScrollViewer CanContentScroll="True" VerticalScrollBarVisibility="Visible" HorizontalScrollBarVisibility="Visible"> 
<StackPanel CanVerticallyScroll="True" CanHorizontallyScroll="True"> 
    <views:DiagramView DataContext="{Binding Path=DiagramViewModel, Source={StaticResource Locator}}" /> 
    <views:IncomeCollectionView DataContext="{Binding Path=IncomesViewModel, Source={StaticResource Locator}}" /> 
    <views:ExpenseCollectionView DataContext="{Binding Path=ExpensesViewModel, Source={StaticResource Locator}}" /> 
    <views:CheckCollectionView DataContext="{Binding Path=ChecksViewModel, Source={StaticResource Locator}}" /> 
    <views:BalanceCollectionView DataContext="{Binding Path=BalancesViewModel, Source={StaticResource Locator}}" /> 
    <views:VacationCollectionView DataContext="{Binding Path=VacationsViewModel, Source={StaticResource Locator}}" /> 
    <views:KHCollectionView DataContext="{Binding Path=KhViewModel, Source={StaticResource Locator}}" /> 
    <views:OctaviaCollectionView DataContext="{Binding Path=OctaviaViewModel, Source={StaticResource Locator}}" /> 
</StackPanel> 
</ScrollViewer>

Каждый UserControl в этом StackPanel имеет очень похожий внешний вид (очевидно, есть больше материала в XAML). В моей заявке нет постоянного значения относительно ширины или высоты..

 <ListView ItemsSource="{Binding Source={StaticResource groupedCollection}}" SelectedItem="{Binding CurrentItem}"> 
     <ListView.GroupStyle> 
      <GroupStyle> 
       <GroupStyle.HeaderTemplate> 
        <DataTemplate> 
         <TextBlock Text="{Binding Items[0].CurrentCategory}" /> 
        </DataTemplate> 
       </GroupStyle.HeaderTemplate> 
      </GroupStyle> 
     </ListView.GroupStyle> 
     <ListView.ItemsPanel> 
      <ItemsPanelTemplate> 
       <UniformGrid Columns="12" Rows="1" /> 
      </ItemsPanelTemplate> 
     </ListView.ItemsPanel> 
     <ListView.ItemContainerStyle> 
      <Style> 
       <Setter Property="Grid.Column" Value="{Binding GeneratedColumn}"/> 
      </Style> 
     </ListView.ItemContainerStyle> 
     <ListView.ItemTemplate> 
      <DataTemplate> 
       <StackPanel> 
        <TextBlock Text="{Binding EncryptedAmount}" /> 
        <StackPanel Orientation="Horizontal"> 
         <TextBlock Text="Got paid on " /> 
         <TextBlock Text="{Binding Date}" /> 
        </StackPanel> 
        <Button Content="details" 
          Command="{Binding Path=DataContext.ShowDialogCommand, 
          RelativeSource={RelativeSource AncestorType={x:Type UserControl}}}" 
          CommandParameter="QuickEdit"/> 
        <Button Content="remove" Command="{Binding RemoveCommand}" CommandParameter="Income removed." /> 
       </StackPanel> 
      </DataTemplate> 
     </ListView.ItemTemplate> 
    </ListView>

Проблема заключается в том, что я не могу показаться, чтобы сделать вертикальную ScrollViewer работу. Отображается, потому что я делаю это видимым, но он отключен. Очевидно, StackPanel будет расти неопределенно, но разве нет способа рассчитать, сколько пространства необходимо? Потому что большая часть контента просто отключена прямо сейчас. Итак, я попытался поместить scrollviewer в любое возможное место, но все они отключены.

 <Style TargetType="{x:Type ContentControl}"> 
      <Setter Property="Template"> 
       <Setter.Value> 
        <ControlTemplate TargetType="ContentControl"> 
         <ScrollViewer> 
          <ContentPresenter Cursor="{TemplateBinding Cursor}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" 
               Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" 
               Content="{TemplateBinding Content}" ContentTemplate="{TemplateBinding ContentTemplate}"/> 
         </ScrollViewer> 
        </ControlTemplate> 
       </Setter.Value> 
      </Setter> 
     </Style>

Итак, я попытался сбросить реализацию StackPanel и попробовал его с помощью Grid. Нет, это тоже не работает. Очевидно, что здесь отсутствует базовое решение, но просто не могу понять это. Любые идеи были бы оценены, по-видимому, очень распространенный сценарий, чтобы быть честным. Приветствия

<ScrollViewer CanContentScroll="True" 
       VerticalScrollBarVisibility="Visible" 
       HorizontalScrollBarVisibility="Visible"> 
    <Grid> 
     <Grid.RowDefinitions> 
      <RowDefinition /> 
      <RowDefinition /> 
      <RowDefinition /> 
      <RowDefinition /> 
      <RowDefinition /> 
      <RowDefinition /> 
      <RowDefinition /> 
      <RowDefinition /> 
     </Grid.RowDefinitions> 

     <views:DiagramView DataContext="{Binding Path=DiagramViewModel, Source={StaticResource Locator}}" /> 
     <views:IncomeCollectionView Grid.Row="1" DataContext="{Binding Path=IncomesViewModel, Source={StaticResource Locator}}" /> 
     <views:ExpenseCollectionView Grid.Row="2" DataContext="{Binding Path=ExpensesViewModel, Source={StaticResource Locator}}" /> 
     <views:CheckCollectionView Grid.Row="3" DataContext="{Binding Path=ChecksViewModel, Source={StaticResource Locator}}" /> 
      ...etc... 
    </Grid> 
</ScrollViewer>

Edit: DiagramView UserControl содержит следующее:

<UserControl x:Class="Expense.Manager.WPF.Views.DiagramView" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
     xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
     xmlns:pie="clr-namespace:Expense.Manager.WPF.CustomPie" 
     xmlns:local="clr-namespace:Expense.Manager.WPF.Shared" 
     mc:Ignorable="d"> 
<UserControl.Resources> 
    <local:BoolToBrushConverter x:Key="BoolToBrushConverter" /> 
</UserControl.Resources> 

<Grid> 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition Width="Auto" /> 
     <ColumnDefinition Width="Auto" /> 
     <ColumnDefinition Width="Auto" /> 
    </Grid.ColumnDefinitions> 

    <StackPanel> 
     <StackPanel Orientation="Horizontal"> 
      <TextBlock Text="Income this month: " /> 
      <TextBlock> 
       <TextBlock.Text> 
        <PriorityBinding FallbackValue="Retrieving data..."> 
         <Binding Path="EncryptedCurrentMonthIncome" Mode="TwoWay" IsAsync="True" /> 
        </PriorityBinding> 
       </TextBlock.Text> 
      </TextBlock> 
     </StackPanel> 
     <pie:PieChart Data="{Binding PieChartIncomeData, Mode=TwoWay}" Width="250" PieWidth="130" PieHeight="130" Height="140" /> 
    </StackPanel> 

    <StackPanel Grid.Row="0" Grid.Column="1"> 
     <StackPanel Orientation="Horizontal"> 
      <TextBlock Text="Expenses this month: " /> 
      <TextBlock> 
       <TextBlock.Text> 
        <PriorityBinding FallbackValue="Retrieving data..."> 
         <Binding Path="CurrentMonthExpense" Mode="TwoWay" IsAsync="True" /> 
        </PriorityBinding> 
       </TextBlock.Text> 
      </TextBlock> 
     </StackPanel> 
     <pie:PieChart Data="{Binding PieChartExpenseData, Mode=TwoWay}" Width="250" PieWidth="130" PieHeight="130" Height="140" /> 
    </StackPanel> 

    <StackPanel Grid.Column="2"> 
     <StackPanel Orientation="Horizontal"> 
      <TextBlock Text="{Binding VacationsLeft}" /> 
      <TextBlock Text=" days left" /> 
     </StackPanel> 
     <ItemsControl ItemsSource="{Binding VacationsPerYearCollection}"> 
      <ItemsControl.ItemsPanel> 
       <ItemsPanelTemplate> 
        <StackPanel Orientation="Horizontal" /> 
       </ItemsPanelTemplate> 
      </ItemsControl.ItemsPanel> 
      <ItemsControl.ItemTemplate> 
       <DataTemplate> 
        <Rectangle Margin="5, 0, 0, 0" Height="25" Width="4" Fill="{Binding Converter={StaticResource BoolToBrushConverter}}" /> 
       </DataTemplate> 
      </ItemsControl.ItemTemplate> 
     </ItemsControl> 

     <StackPanel Orientation="Horizontal"> 
      <TextBlock Text="Bank savings:" /> 
      <TextBlock Text="{Binding BankSavings}" /> 
     </StackPanel> 
    </StackPanel> 
</Grid>

IncomeCollectionView:

<UserControl x:Class="Expense.Manager.WPF.Views.IncomeCollectionView" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
     xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
     xmlns:views="clr-namespace:Expense.Manager.WPF.Views" 
     mc:Ignorable="d"> 
<UserControl.Resources> 
    <CollectionViewSource x:Key="groupedCollection" IsLiveGroupingRequested="True" Source="{Binding Collection}"> 
     <CollectionViewSource.GroupDescriptions> 
      <PropertyGroupDescription PropertyName="CurrentCategory" /> 
     </CollectionViewSource.GroupDescriptions> 
    </CollectionViewSource> 
</UserControl.Resources> 
    <Grid> 
     <Grid.RowDefinitions> 
      <RowDefinition Height="Auto" /> 
      <RowDefinition Height="Auto" /> 
     </Grid.RowDefinitions> 

     <TextBlock Text="{Binding DisplayName}" Foreground="White" FontWeight="SemiBold" Padding="5" Background="SteelBlue" /> 
      <ListView Grid.Row="1" ItemsSource="{Binding Source={StaticResource groupedCollection}}" SelectedItem="{Binding CurrentItem}"> 
       <ListView.GroupStyle> 
        <GroupStyle> 
         <GroupStyle.HeaderTemplate> 
          <DataTemplate> 
           <TextBlock Text="{Binding Items[0].CurrentCategory}" /> 
          </DataTemplate> 
         </GroupStyle.HeaderTemplate> 
        </GroupStyle> 
       </ListView.GroupStyle> 
       <ListView.ItemsPanel> 
        <ItemsPanelTemplate> 
         <UniformGrid HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Columns="12" Rows="1" /> 
        </ItemsPanelTemplate> 
       </ListView.ItemsPanel> 
       <ListView.ItemContainerStyle> 
        <Style> 
         <Setter Property="Grid.Column" Value="{Binding GeneratedColumn}"/> 
        </Style> 
       </ListView.ItemContainerStyle> 
       <ListView.ItemTemplate> 
        <DataTemplate> 
         <Grid> 
          <Grid.RowDefinitions> 
           <RowDefinition Height="Auto" /> 
           <RowDefinition Height="Auto" /> 
           <RowDefinition Height="Auto" /> 
           <RowDefinition Height="Auto" /> 
          </Grid.RowDefinitions> 

          <TextBlock Text="{Binding EncryptedAmount}" /> 
          <TextBlock Grid.Row="1" Text="{Binding Date}" /> 
          <Button Grid.Row="2" Content="details" 
           Command="{Binding Path=DataContext.ShowDialogCommand, 
           RelativeSource={RelativeSource AncestorType={x:Type UserControl}}}" 
           CommandParameter="QuickEdit"/> 
          <Button Grid.Row="3" Content="remove" Command="{Binding RemoveCommand}" CommandParameter="Income removed." /> 

         </Grid> 
        </DataTemplate> 
       </ListView.ItemTemplate> 
      </ListView> 
    </Grid>

и где он используется: Почему список не изменяет размер после изменения размера самого окна?

<ScrollViewer CanContentScroll="True" HorizontalScrollBarVisibility="Visible" VerticalScrollBarVisibility="Visible"> 
    <Grid HorizontalAlignment="Stretch" VerticalAlignment="Stretch"> 
     <Grid.RowDefinitions> 
      <RowDefinition Height="Auto" /> 
     </Grid.RowDefinitions> 

     <views:IncomeCollectionView Grid.Row="1" DataContext="{Binding Path=IncomesViewModel, Source={StaticResource Locator}}" /> 
    </Grid> 
</ScrollViewer>

источник

2014-10-07 user1930132

Я пытался уронить StackPanel реализации и попытался его с Grid. Нет, это тоже не работает.

Это почти правильно, кроме последнего предложения. Использование Grid является половиной ответа, потому что StackPanel не имеет функциональности для изменения размера своих элементов ... вам просто нужно сообщить ScrollViewer, когда прокручивать.Возьмем такой пример:

<ScrollViewer> 
    <Grid> 
     <Grid.RowDefinitions> 
      <RowDefinition Height="50" /> 
      <RowDefinition Height="50" /> 
      <RowDefinition Height="50" /> 
      <RowDefinition Height="50" /> 
      <RowDefinition Height="50" /> 
      <RowDefinition Height="50" /> 
      <RowDefinition Height="50" /> 
     </Grid.RowDefinitions> 
     <Rectangle Fill="Cyan" /> 
     <Rectangle Grid.Row="1" Fill="Green" /> 
     <Rectangle Grid.Row="2" Fill="Red" /> 
     <Rectangle Grid.Row="3" Fill="Blue" /> 
     <Rectangle Grid.Row="4" Fill="Orange" /> 
     <Rectangle Grid.Row="5" Fill="Purple" /> 
     <Rectangle Grid.Row="6" Fill="Yellow" /> 
    </Grid> 
</ScrollViewer>

Это XAML заставит ScrollViewer ScrollBar появляться (когда Window.Height достаточно мал), но если вы удалите RowDefinition.Height значения (тем самым давая каждой строке долю всей Grid.Height), вы будете см. предыдущую ситуацию, когда нет ScrollBar.

Теперь ни один из нас не хочет жестко кодировать постоянные значения в наших пользовательских интерфейсах, но вы можете сделать это, используя настройки Auto на свойствах RowDefinition.Height. В отличие от этих Rectangle с, ваши средства управления будут иметь некоторые Height, поэтому ваше решение установить каждый из ваших Grid.RowDefinition с так:

<RowDefinition Height="Auto" />

Это обеспечит элементы управления с столько пространства, сколько им нужно в Grid и поэтому (надеюсь) они будут иметь больше Height вместе, чем ScrollViewer, и поэтому ScrollViewer будет отображать вертикальные ScrollBar.

источник

2014-10-07 11:12:04 Sheridan

Нет, к сожалению, не работает, как показано ниже: dropbox.com/s/b6e5uj1coxtvi0t/grid.jpg?dl=0 – user1930132

Даже не работает с 1 UserControl. Горизонтальная полоса прокрутки работает нормально, но вертикальная отключена на всех times.' < /Grid.RowDefinitions> <просмотров: DiagramView DataContext = "{Binding Path = DiagramViewModel , Source = {StaticResource Locator}} "/> ' – user1930132

Эй, давайте будем ясно ... возможно * ваш код * не работает, но * этот код * работает просто отлично. Если вы этого не сделали, попробуйте сейчас ... вы увидите, что он * работает *. Я объяснил, как решить вашу проблему. Содержимое 'ScrollViewer' просто должно сообщать о большей общей' Height', чем 'ScrollViewer.Height'. – Sheridan

Как заставить scrollviewer работать в этом сценарии?

ответ

Смежные вопросы