ListView становится не прокручиваемым

Question

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

Итак Я пытаюсь использовать 3 списка на одной странице у всех должен быть заголовок и поясняющее изображение , но вместо разработки всех 3 ListViews на одной странице I передал один просмотр списка с изображением и заголовком в элемент управления , который я использую на своей странице.

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

Я предоставил проект песочницы , где я поместил элемент управления и т. Д., Как в приложении, над которым я работаю. SampleProject

Их вам просто нужно нажать на старт, и списки заполнятся. Но они не показывают полосу прокрутки.

Заранее спасибо!

Редактировать 1: В соответствии с просьбой я делюсь своим кодом ниже. Если вы откроете пример проекта, вам не нужно читать дальше, пока не будет выполнено второе редактирование.

Элемент управления, содержащий просмотр списка:

<Grid>
    <Grid x:Name="Section"
        HorizontalAlignment="Stretch">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
        <Grid x:Name="grdTitleArea"
            HorizontalAlignment="Stretch"
            Height="50">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="100" />
                <ColumnDefinition Width="*" />
            </Grid.ColumnDefinitions>
            <BitmapIcon 
                VerticalAlignment="Center"
                HorizontalAlignment="Center"
                Tapped="grdTitleArea_Tapped"
                UriSource="ms-appx:///Assets/area.png"
                Height="40" />
            <TextBlock
                VerticalAlignment="Center"
                HorizontalAlignment="Stretch"
                Tapped="grdTitleArea_Tapped"
                Text="Area"
                Grid.Column="1" />
        </Grid>

        <!--<ScrollViewer 
            VerticalAlignment="Stretch"
            VerticalScrollBarVisibility="Auto"
            VerticalScrollMode="Enabled"
            HorizontalAlignment="Stretch"
            HorizontalContentAlignment="Stretch"
            HorizontalScrollBarVisibility="Hidden"
            HorizontalScrollMode="Disabled"
            >-->
            <ListView x:Name="ListView" 
                ScrollViewer.VerticalScrollBarVisibility="Visible"
                ScrollViewer.VerticalScrollMode="Auto"
                Grid.Row="1">
                <ListView.ItemContainerStyle>
                    <Style TargetType="ListViewItem">
                        <Setter Property="HorizontalAlignment" Value="Stretch"/>
                        <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
                    </Style>
                </ListView.ItemContainerStyle>
                <ListView.ItemTemplate>
                    <DataTemplate>
                        <Grid
                        VerticalAlignment="Stretch"
                        HorizontalAlignment="Stretch"
                        BorderThickness="1"
                        Margin="1"
                        Height="50">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="*" />
                            </Grid.ColumnDefinitions>
                            <TextBlock Text="{Binding ActionDescription}"
                                   HorizontalAlignment="Stretch"
                                   VerticalAlignment="Stretch" />
                        </Grid>
                    </DataTemplate>
                </ListView.ItemTemplate>
            </ListView>
        <!--</ScrollViewer>-->
    </Grid>
</Grid>

Элемент управления, который содержит элемент управления выше 3 раз:

<Grid x:Name="ProgressControl">
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto" />
                <RowDefinition Height="Auto" />
                <RowDefinition Height="Auto" />
                <RowDefinition Height="Auto" />
            </Grid.RowDefinitions>
            <local:SynchronizeSettingsControl
                Visibility="Visible"
                x:Name="Settings" />
            <local:SynchronizeSectionControl
                x:Name="ActualAction"
                Visibility="Visible"
                Grid.Row="1" />
            <local:SynchronizeSectionControl
                x:Name="Error"
                Visibility="Visible"
                Grid.Row="2" />
            <local:SynchronizeSectionControl
                x:Name="Log"
                Visibility="Visible"
                Grid.Row="3" />
        </Grid>

Страница, которая содержит элемент управления, который содержит просмотр списка:

<Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="50" />
            <RowDefinition Height="50" />
            <RowDefinition Height="*" />
            <RowDefinition Height="50"/>
        </Grid.RowDefinitions>
        <Grid Grid.Row="0">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*" />
                <ColumnDefinition Width="*" />
                <ColumnDefinition Width="*" />
            </Grid.ColumnDefinitions>
            <TextBlock Grid.Column="1" 
                Text="Demo" 
                HorizontalAlignment="Center" 
                VerticalAlignment="Center" />
        </Grid>
        <Grid Grid.Row="1">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*" />
                <ColumnDefinition Width="*" />
                <ColumnDefinition Width="*" />
            </Grid.ColumnDefinitions>
            <Button Grid.Column="0" Width="70" 
                VerticalAlignment="Stretch" 
                Content="Useless Button" />
        </Grid>
        <Controls:SynchronizeControl
            x:Name="ctlSync"
            Grid.Row="2"
            VerticalAlignment="Stretch"
            HorizontalAlignment="Stretch" />
    <Button VerticalAlignment="Stretch" HorizontalAlignment="Stretch" 
            x:Name="btnStart" 
            Content="Start" 
            Tapped="btnStart_Tapped"
            Grid.Row="3" />            
    </Grid>

Answer 1

Дело в том, что вы использовали свойство Auto для высоты ваших строк в вашем элементе управления.

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

В основном элемент управления отображается в максимальном размере, но выходит за его границы.

Вы можете предотвратить это, если используете * в качестве значения высоты. Это приведет к тому, что контроль займет все доступное пространство. Вы можете дополнительно ограничить это с помощью свойства MaxHeight.

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

Answer 2

Проблема в том, что вы использовали Auto высоту на странице.В основном это означает, что страница сообщает элементу управления local:SynchronizeSectionControl: «Вы можете использовать любую высоту, какую хотите».

Элемент управления имеет в качестве высоты второй строки *, что означает «использовать оставшееся пространство».имеется в наличии".Но поскольку страница предлагает практически «бесконечную высоту», высота ListView будет максимально растянута, чтобы вместить все ее элементы, и, следовательно, она не будет прокручиваться, поскольку ее высота достаточно велика, чтобы отобразить все, хотя она обрезана.выключен и не виден, потому что высота окна, конечно, ограничена.