如何在保持启用ScrollViewer的同时动态更新ListView的高度?

时间:2019-05-01 19:09:04

标签: xaml listview uwp scrollview uwp-xaml

ListView放在UserControl内部,该控件在父XAML中设置为星号“ *”的高度。 当有超过ListView的项目时,我想使用ListView来滚动项目。它应该适用于不同大小的窗口。

当我使用固定的整数设置Grid的RowDefinitions时,它工作正常,但是当我尝试使用星号“ *”时,ScrollViewer禁用。

我还尝试通过重写的MeasureOverride方法中的某些代码来绑定和更新RowDefinition的高度,但未按预期工作。

这是我的UserControl中的代码:

<Grid x:Name="ContentArea"
          Background="{StaticResource MixerBackground}">
        <Grid.RowDefinitions>
            <RowDefinition Height="{x:Bind ListViewHeight}" />
        </Grid.RowDefinitions>
        <ListView
            ItemsSource="{x:Bind ViewModel.Source,Mode=TwoWay}"
            CanDragItems="True"
            CanReorderItems="True"
            AllowDrop="True"
            SelectionMode="Single"
            ScrollViewer.VerticalScrollBarVisibility="Visible">
            <ListView.ItemTemplate>
                <DataTemplate x:DataType="models:Track">
                    <Grid
                        Background="LightGray"
                        HorizontalAlignment="Left"
                        VerticalAlignment="Stretch"
                        BorderBrush="Black">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="100"/>
                            <ColumnDefinition Width="*"/>
                        </Grid.ColumnDefinitions>
                        <Grid.RowDefinitions>
                            <RowDefinition Height="100"/>
                        </Grid.RowDefinitions>

                        <TextBlock
                            Text="{x:Bind Id}"
                            VerticalAlignment="Center"
                            HorizontalAlignment="Center"
                            FontSize="24"
                            Margin="20,5,20,5"/>

                        <Grid
                            Background="Black"
                            Width="500"
                            HorizontalAlignment="Stretch"
                            VerticalAlignment="Stretch"
                            Grid.Column="1">
                        </Grid>
                    </Grid>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>

我希望ScrollViewer能够正常工作,但是ListView保持旧尺寸或滚动条被禁用-取决于Height值。

有什么方法可以通过滚动来动态调整ListView的大小?

修改

这是父页面XAML代码,可通过Light MVVM框架加载到Frame中:

<Grid
        x:Name="ContentArea">
        <Grid
            Background="{ThemeResource SystemControlPageBackgroundChromeLowBrush}">
            <Grid.RowDefinitions>
                <RowDefinition Height="100" />
                <RowDefinition Height="*" />
                <RowDefinition Height="300" />
            </Grid.RowDefinitions>
            <maineditor:MainEditorMenuControl x:Name="ProjectMenu" />
            <maineditor:MainEditorWorkspaceControl x:Name="Workspace" Grid.Row="1"/>
            <maineditor:MainEditorMixerControl x:Name="Mixer" Grid.Row="2" />
        </Grid>
    </Grid>

How it looks now, and also after trying Nico solution (image)

编辑2 我认为问题可能与我使用Visual Studio的Windows Template Studio插件创建的MVVM模板有关。如果我尝试像我的应用程序一样从头开始创建具有所有属性1:1的最小解决方案,那么它可以在新项目中使用,而在我的项目中不可用。

1 个答案:

答案 0 :(得分:0)

  

如何在启用ScrollViewer的同时动态更新ListView的高度?

如果要使RowDefinition的高度与ListView相同,则可以给ListView一个名称,并使用{Binding ElementName=MyListView,Path=ActualHeight}语法来绑定两个height属性。

<Grid x:Name="ContentArea">
    <Grid.RowDefinitions>
        <RowDefinition Height="{Binding ElementName=MyListView,Path=ActualHeight}" />
    </Grid.RowDefinitions>
    <ListView
    Name="MyListView"
    CanDragItems="True"
    CanReorderItems="True"
    AllowDrop="True"
    Loaded="MyListView_Loaded"
    SelectionMode="Single"
    ScrollViewer.VerticalScrollBarVisibility="Visible">
        <ListView.ItemTemplate>
            <DataTemplate >
                <Grid
                Background="LightGray"
                HorizontalAlignment="Left"
                VerticalAlignment="Stretch"
                BorderBrush="Black">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="100"/>
                        <ColumnDefinition Width="*"/>
                    </Grid.ColumnDefinitions>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="100"/>
                    </Grid.RowDefinitions>

                    <TextBlock
                    Text="{Binding}"
                    VerticalAlignment="Center"
                    HorizontalAlignment="Center"
                    FontSize="24"
                    Margin="20,5,20,5"/>

                    <Grid
                    Background="Black"
                    Width="500"
                    HorizontalAlignment="Stretch"
                    VerticalAlignment="Stretch"
                    Grid.Column="1">
                    </Grid>
                </Grid>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>
</Grid>

enter image description here