ItemsControl [of Views] Полоса прокрутки не работает при заполнении BindableCollection

Доброе утро, stackoverflow,

В настоящее время у меня возникла проблема с полосой прокрутки, окружающей мой ItemsControl. Когда содержимое ItemsControl (привязанное к BindableCollection, заполненное экземпляром моего ListItemViewModel) выходит за границы моего окна, полоса прокрутки отображается, однако, она выглядит отключенной (нет меньшей перетаскиваемой полосы в центре). Таким образом, я не могу прокручивать расширенное содержимое. При раскрытии окна отображается содержимое ниже. Я попытался установить для CanContentScroll значение true и false, ни один из них не работал.

Вот мой базовый вид:

<Controls:MetroWindow x:Class="DataIntegrator.Views.BaseView"
         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:i="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity"
         xmlns:cal="http://www.caliburnproject.org"
         xmlns:Controls="clr-namespace:MahApps.Metro.Controls;assembly=MahApps.Metro"
         xmlns:cefSharp="clr-namespace:CefSharp.Wpf;assembly=CefSharp.Wpf">
<Grid AllowDrop="True" cal:Message.Attach="[Event Drop] = [Action AddItems($eventArgs)]" Height="Auto" Width="Auto" VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="14*"/>
        <ColumnDefinition Width="5*"/>
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition Height="*"/>
        <RowDefinition Height="28"/>
    </Grid.RowDefinitions>
    <ScrollViewer Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="2" VerticalAlignment="Stretch">
        <ItemsControl HorizontalAlignment="Stretch" VerticalAlignment="Stretch" ItemsSource="{Binding List}">
            <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <ContentControl cal:View.Model="{Binding}"/>
                </DataTemplate>
            </ItemsControl.ItemTemplate>
            <ItemsControl.ItemsPanel>
                <ItemsPanelTemplate>
                    <StackPanel/>
                </ItemsPanelTemplate>
            </ItemsControl.ItemsPanel>
        </ItemsControl>
    </ScrollViewer>
    <Button x:Name="Reprocess" Content="Reprocess Selected Elements" Grid.RowSpan="1" Grid.Row="1" Grid.ColumnSpan="1" Grid.Column="1"/>
</Grid>

the view of items being added to the ItemsControl:

<UserControl x:Class="DataIntegrator.Views.ListItemView"
         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:local="clr-namespace:DataIntegrator.Views"
         xmlns:cal="http://www.caliburnproject.org"
         mc:Ignorable="d" 
         d:DesignHeight="300" d:DesignWidth="300">
<Grid Height="20" HorizontalAlignment="Stretch">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="4*"/>
        <ColumnDefinition Width="1"/>
        <ColumnDefinition/>
        <ColumnDefinition Width="1"/>
        <ColumnDefinition Width="30"/>
    </Grid.ColumnDefinitions>

    <TextBlock x:Name="File" Grid.ColumnSpan="1" Padding="3" Grid.Column="0" Background="#FF5A5A5A" Foreground="Cyan" ></TextBlock>
    <TextBlock x:Name="Type" Grid.ColumnSpan="1" Padding="3" Grid.Column="2" Foreground="Cyan" Background="#FF5A5A5A"></TextBlock>
    <Rectangle Grid.Column="4" Fill="#FF5A5A5A" ></Rectangle>
    <CheckBox x:Name="Reprocess" HorizontalAlignment="Center" VerticalAlignment="Center" Height="18" Width="18" Grid.Column="4" IsChecked="{ Binding Path=Reprocess, Mode=TwoWay }"/>
</Grid>

and the code adding the list items:

public void AddToList(string filePath)
    {
        List.Add(new ListItemViewModel(_eventAggregator){File=filePath});
        NotifyOfPropertyChange(() => List);
    }

Если список переменных уже объявлен и создан как BindableCollection.

Я считаю, что могу делать что-то не так с caliburn.micro, поскольку верно следующее:

  1. Без изменения окружающего XAML, простое добавление ItemsControl.Items в ItemsControl вручную позволяет добиться ожидаемого поведения полосы прокрутки.
  2. Установка высоты ItemsPanelTemplate StackPanel обеспечит ожидаемое поведение полосы прокрутки, пока моя привязываемая коллекция не заполнит область и не переполнит окно (в это время действующая полоса прокрутки заменяется полосой без перетаскиваемой полосы).

Мне кажется, что когда элементы выходят за пределы экрана, появляется другая полоса прокрутки, но если я удалю окружающий ScrollViewer, тогда при выходе за пределы экрана полосы прокрутки не будет.

Если вы не знаете, куда идти дальше, мы будем благодарны за любой ввод.

Спасибо!


person mdlss    schedule 04.08.2016    source источник
comment
Сначала проверьте свой код без калибровки   -  person AnjumSKhan    schedule 04.08.2016
comment
Как указано выше (с некоторыми более подробными сведениями), когда программно добавляемые модели просмотра вместо этого жестко запрограммированы в ItemsControl.Items, ожидаемое поведение демонстрируется полосой прокрутки, то есть ‹ItemsControl.Items› ‹views: ListItemView /› .... ‹views: ListItemView /› .... ‹ просмотры: ListItemView / ›‹ /ItemsControl.Items ›   -  person mdlss    schedule 04.08.2016
comment
Попробуйте добавить ScrollViewer.CanContentScroll="True" в свой ItemsPanelTemplate, поскольку в нем есть StackPanel.   -  person Abin    schedule 04.08.2016
comment
Вы имеете в виду сам StackPanel в ItemsPanelTemplate? Я пробовал это, и, похоже, это не сработало. Спасибо за предложение, я не пробовал это на StackPanel.   -  person mdlss    schedule 04.08.2016
comment
ты тоже пробовал это? <ScrollViewer VerticalScrollBarVisibility="Auto"> <ItemsControl> ... </ItemsControl>   -  person Abin    schedule 04.08.2016


Ответы (1)


Добавить ScrollViwer в ControlTemplate

 <ItemsControl >
   <ItemsControl.Template>
    <ControlTemplate>
        <ScrollViewer VerticalScrollBarVisibility="Auto">
            <ItemsPresenter />
        </ScrollViewer>
    </ControlTemplate>
  </ItemsControl.Template>
</ItemsControl>

Чтобы быть ясным, я протестировал его с помощью нижеприведенного XAML, и он отлично работает для меня, поскольку я могу просматривать средство просмотра прокрутки и прокручивать.

Просмотр

<Grid Height="200">
    <ItemsControl Grid.Column="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" ItemsSource="{Binding List}">
        <ItemsControl.Template>
            <ControlTemplate>
                <ScrollViewer VerticalScrollBarVisibility="Visible">
                    <ItemsPresenter />
                </ScrollViewer>
            </ControlTemplate>
        </ItemsControl.Template>
        <ItemsControl.ItemTemplate>
            <DataTemplate>
                <TextBlock Text="MynewTest"/>
            </DataTemplate>
        </ItemsControl.ItemTemplate>
        <ItemsControl.ItemsPanel>
            <ItemsPanelTemplate>
                <StackPanel ScrollViewer.CanContentScroll="True"/>
            </ItemsPanelTemplate>
        </ItemsControl.ItemsPanel>
    </ItemsControl>
</Grid>

ViewModel

public class ViewModel
{
    public ViewModel()
    {
        List = new ObservableCollection<string>() { "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "" };
    }
    private ObservableCollection<string> _MyProperty;
    public ObservableCollection<string> List
    {
        get { return _MyProperty; }
        set { _MyProperty = value; }
    }
}
person Abin    schedule 04.08.2016
comment
Я просто попробовал их оба, и, к сожалению, ни один из них не сработал. - person mdlss; 04.08.2016
comment
Я пробовал предложения по этой ссылке, но безрезультатно. Я переместил средство просмотра прокрутки повсюду и попробовал все свойства, которые я мог придумать на стороне XAML, поэтому я считаю, что это связано с привязкой данных Caliburn (учитывая, что это работает, когда я их жестко кодирую, а не добавляю программно их) - person mdlss; 04.08.2016
comment
вы пробовали изменить свой ItemsPanelTemplate на Grid, а не на StackPanel? - person Abin; 04.08.2016
comment
Я не думаю, что это bcos вашего Caliburn, поскольку MVVM означает отделение View от ViewModel. - person Abin; 04.08.2016
comment
Я пробовал сетку, в которой все элементы складываются друг на друга. Я знаю, что это кажется маловероятным, но проблема возникает только тогда, когда я добавляю привязку данных MVVM в уравнение. Макет, который я настроил, работает без добавления элементов программным способом. - person mdlss; 04.08.2016
comment
хорошо, я попробую создать образец и проверить со своей стороны. Я уверен, что проблема не в привязке данных. - person Abin; 04.08.2016
comment
Я обнаружил несвязанную проблему, которая, как мне кажется, приводила к тому, что полоса прокрутки не работала (полностью отключив ее). Однако это действительно работает. Спасибо за терпение и помощь в этом вопросе. - person mdlss; 04.08.2016