Вложенный WrapGrid/GridView внутри детали элемента ScrollViewer?

обновление от 17 сентября 2012 г.: переформулировал вопрос и добавил этапы восстановления.

Я пытаюсь добавить галерею изображений в стиле WrapGrid в ItemDetailPage. Пока единственное решение, которое я нашел для достижения этой цели, — это создание групповых стилей и использование селектора DataTemplate. Это кажется излишним, чтобы сделать это на странице сведений, поскольку мне нужно было бы создать класс для каждого столбца на моей странице.

Я попытался решить эту проблему, как показано ниже, но GridView прокручивается независимо от моего ScrollViewer, что неприемлемо.

Чтобы воссоздать начните с приложения Grid по умолчанию в VS:

Добавьте это свойство в SampleDataItem

// Add to SampleDataItem TODO: replace int with image url strings
private List<int> _subItems = null;
public List<int> SubItems
{
    get
    {
        if (_subItems == null)
        {
            _subItems = new List<int>();
            for (int i = 0; i < 50; i++)
                this._subItems.Add(i);
        }
        return this._subItems;
    }
    set { this.SetProperty(ref this._subItems, value); }
}

в ItemDetailPage.xaml замените RichTextColumns в ScrollViewer:

 <!--Fixed column layout, replaces RichTextColumns from template-->    
  <Grid Grid.Row="1">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="800"/>
            <ColumnDefinition Width="1400"/>
        </Grid.ColumnDefinitions>
        <StackPanel>
            <TextBlock Text="{Binding Title}"/>
            <Image x:Name="image" MaxHeight="480" Margin="0,20,0,10" Stretch="Uniform" Source="{Binding Image}"/>                                     
        </StackPanel>
        <GridView ScrollViewer.HorizontalScrollMode="Disabled"  VerticalAlignment="Top" ItemsSource="{Binding SubItems}"  Grid.Column="1" ItemTemplate="{StaticResource GridViewDataTemplate1}" >
        </GridView>
    </Grid>

Наконец, добавьте следующий DataTemplate

<DataTemplate x:Key="GridViewDataTemplate1">
    <Grid Background="Yellow" Width="200" Height="200"/>
</DataTemplate>

person kbeal2k    schedule 16.09.2012    source источник


Ответы (1)


Этого можно добиться, установив для параметра HorizontalScrollMode GridView значение Disabled.

<GridView ScrollViewer.HorizontalScrollMode="Disabled" />

Однако я призываю вас подумать о наилучшем подходе. Если элементы управления GridView не связаны с каждым из них, покажите их на отдельных страницах. Если они связаны, сгруппируйте один GridView. Вы можете по-разному стилизовать элементы групп, используя 12179853#12179853">Выбор шаблонов данных.

person Shawn Kendrot    schedule 17.09.2012
comment
Установка его на Disabled не сработала для меня. Я повторил свой вопрос и предоставил шаги для отдыха. - person kbeal2k; 17.09.2012
comment
kbeal2k: я обнаружил, что вы не можете поместить GridView в ScrollViewer, но вы можете поместить множество VariableSizedWrapGrid в StackPanel. - person Shawn Kendrot; 14.11.2012