对于WPF中的列表视图,垂直滚动条不在网格内查看

时间:2014-09-02 07:42:20

标签: c# wpf xaml listview scrollbar

我的用户控件设计。该控件包含许多行和列,其中包含子网格,行和列。其中一个最内行包含一个ListView,其水平和垂直滚动条设置为自动。

我能够查看listview的水平滚动条以及最外面的网格,但是我无法查看listview的Vertical Scroll bar,但外网格工作正常。

这是同样的xaml。

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
        <RowDefinition />
    </Grid.RowDefinitions>

    <StackPanel Grid.Row="0" Orientation="Horizontal" VerticalAlignment="Center" Margin="8,0,0,0">
        <Image Source="pack://application:,,,/EMC.DD.CommonFrameworkLayer;component/Images/Items1.png" Width="50" Height="50"></Image>
        <TextBlock Text="Items" VerticalAlignment="Center" Style="{StaticResource  DashboardTextBlockStyle}" Margin="8,0,0,0" ></TextBlock>
    </StackPanel>

    <StackPanel Orientation="Horizontal" Grid.Row="1" Background="#eaeaea" Margin="8,0,0,0">
        <Image Source="pack://application:,,,/EMC.DD.CommonFrameworkLayer;component/Images/HomeDashBoard.png"></Image>
        <TextBlock Text="DashBoard" Style="{StaticResource HomeDashBoardTextBlockStyle}" VerticalAlignment="Center" Margin="8,0,0,0"></TextBlock>
        <TextBlock Text=">" VerticalAlignment="Center" Margin="5,0,0,0" Style="{StaticResource HomeDashBoardTextBlockStyle}" FontWeight="Medium"></TextBlock>
        <TextBlock Text="Items" VerticalAlignment="Center" Margin="5,0,0,0" Style="{StaticResource HomeDashBoardTextBlockStyle}" FontWeight="Medium"></TextBlock>
        <TextBlock x:Name="ItemsTextBlock" x:FieldModifier="private" Margin="5,0,0,0" VerticalAlignment="Center"></TextBlock>
    </StackPanel>

    <ScrollViewer VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Auto" Grid.Row="2" Grid.Column="0">

        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="*"/>
            </Grid.RowDefinitions>

            <StackPanel Grid.Row="0" Orientation="Horizontal" VerticalAlignment="Center" Margin="8,10,0,10">
                <TextBox x:Name="ItemTextBox" MinWidth="160" Height="25">
                </TextBox>
            </StackPanel>

            <StackPanel Grid.Row="1" Orientation="Horizontal" VerticalAlignment="Center" Margin="8,2,0,10">
                <ComboBox x:Name="CategoryComboBox" DisplayMemberPath="CategoryName" SelectedValue="CategoryID" SelectedValuePath="CategoryName" 
                  Margin="2,2,0,3" MinHeight="27" MinWidth="250" Grid.Row="2" Grid.Column="2" HorizontalAlignment="Left" Grid.ColumnSpan="2" SelectedIndex="-1"/>
                <Button Style="{StaticResource CRUDButtonStyle}" Content="Search" Margin="5,0,0,0" Click="SearchButton_Click"></Button>

                <StackPanel Orientation="Horizontal" Margin="150,0,0,0">
                    <Button Style="{StaticResource CRUDButtonStyle}" Content="New Item" Click="ItemButton_Click" ></Button>
                    <Button Style="{StaticResource CRUDButtonStyle}" Content="Delete Item" Margin="5,0,0,0" Click="DeleteButton_Click"></Button>
                    <Button Style="{StaticResource CRUDButtonStyle}" Content="Delete All" Margin="2,0,0,0" Click="DeleteAllItem_Click"></Button>
                </StackPanel>
            </StackPanel>

            <Grid Grid.Row="2" Margin="8,0,0,0">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="900"/>
                    <ColumnDefinition Width="Auto" MinWidth="200"/>
                </Grid.ColumnDefinitions>

                <Grid Grid.Column="0">

                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto" />
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="10" />
                    </Grid.RowDefinitions>

                    <Border Grid.Row="0" Style="{StaticResource DefaultBorderStyle}">
                        <StackPanel Grid.Row="0" Orientation="Horizontal" VerticalAlignment="Top" Margin="0,0,0,0">
                            <Image Source="pack://application:,,,/EMC.DD.CommonFrameworkLayer;component/Images/Items1.png"></Image>
                            <TextBlock Text="List Of Items" Margin="5,0,0,0" VerticalAlignment="Center" 
                             Style="{StaticResource HomeDashBoardTextBlockStyle}" FontWeight="Normal"/>
                        </StackPanel>
                    </Border>

                    <ListView x:Name="ItemsListView" x:FieldModifier="private" Grid.Row="1" MouseDown="ListViewItem_PreviewMouseDown" 
                      SelectionChanged="ListView_SelectionChanged" ScrollViewer.HorizontalScrollBarVisibility="Auto" ScrollViewer.VerticalScrollBarVisibility="Auto">
                        <ListView.Resources>
                            <Style TargetType="{x:Type GridViewColumnHeader}" x:Key="MyHeaderStyle">
                                <Setter Property="FontFamily"  Value="Segoe UI Light"/>
                                <Setter Property="FontWeight" Value="DemiBold"></Setter>
                                <Setter Property="Height" Value="30"></Setter>
                            </Style>

                            <local:IntToBoolConverter x:Key="IntBoolKey"></local:IntToBoolConverter>

                            <Style x:Key="TextStyle" TargetType="{x:Type TextBlock}">
                                <EventSetter Event="Hyperlink.Click" Handler="EditClicked" />
                            </Style>

                            <local:BackgroundConverter x:Key="BackgroundKey"/>

                            <Style x:Key="columnHeaderContianerStyle" TargetType="ListViewItem">
                                <Setter Property="Background">
                                    <Setter.Value>
                                        <Binding RelativeSource="{RelativeSource Self}" Converter="{StaticResource BackgroundKey}"/>
                                    </Setter.Value>
                                </Setter>
                                <!--<EventSetter Event="PreviewMouseDown" Handler="ListViewItem_PreviewMouseDown"></EventSetter>-->
                            </Style>

                            <Style x:Key="myHeaderStyle" TargetType="{x:Type GridViewColumnHeader}">
                                <Style.Triggers>
                                    <Trigger Property="IsMouseOver" Value="False">
                                        <Setter Property="Background" Value="#1570a6"/>
                                        <Setter Property="Foreground" Value="#FFFFFF"/>
                                    </Trigger>
                                    <Trigger Property="IsMouseOver" Value="True">
                                        <Setter Property="Foreground" Value="#000000"/>
                                    </Trigger>
                                </Style.Triggers>
                            </Style>

                        </ListView.Resources>
                        <ListView.ItemContainerStyle>
                            <Style TargetType="{x:Type ListViewItem}" BasedOn="{StaticResource columnHeaderContianerStyle}">
                                <Setter Property="HorizontalContentAlignment" Value="Center"/>
                                <Style.Triggers>
                                    <Trigger Property="IsKeyboardFocusWithin" Value="True">
                                        <Setter Property="IsSelected" Value="True" />
                                    </Trigger>
                                </Style.Triggers>
                            </Style>
                        </ListView.ItemContainerStyle>
                        <ListView.View>
                            <GridView AllowsColumnReorder="true" ColumnHeaderContainerStyle="{StaticResource MyHeaderStyle}">
                                <GridViewColumn Width="50" HeaderContainerStyle="{StaticResource myHeaderStyle}">
                                    <GridViewColumn.CellTemplate>
                                        <DataTemplate>
                                            <CheckBox Width ="20" Height="20" IsChecked="{Binding Path=IsActive,Converter={StaticResource IntBoolKey}}"></CheckBox>
                                        </DataTemplate>
                                    </GridViewColumn.CellTemplate>
                                </GridViewColumn>
                                <GridViewColumn Header="Item ID" Width="110"  DisplayMemberBinding="{Binding Path=ItemID,Mode=OneWay}" 
                                 HeaderContainerStyle="{StaticResource myHeaderStyle}"/>
                                <GridViewColumn Header="Item Name" Width="200" DisplayMemberBinding="{Binding Path=ItemName,Mode=OneWay}" 
                                 HeaderContainerStyle="{StaticResource myHeaderStyle}"/>
                                <GridViewColumn Header="Item Price" Width="200" DisplayMemberBinding="{Binding Path=Price,Mode=OneWay}" 
                                 HeaderContainerStyle="{StaticResource myHeaderStyle}" >
                                </GridViewColumn>
                                <GridViewColumn Header="Category" Width="200" DisplayMemberBinding="{Binding Path=Category.CategoryName,Mode=OneWay}" 
                                 HeaderContainerStyle="{StaticResource myHeaderStyle}"/>
                                <GridViewColumn Header="Item Image" Width="200" HeaderContainerStyle="{StaticResource myHeaderStyle}">
                                    <GridViewColumn.CellTemplate>
                                        <DataTemplate>
                                            <Image Width="100" Height="50" VerticalAlignment="Center" HorizontalAlignment="Center" 
                                                 Source="{Binding Path=ItemImagePath,Mode=OneWay}"></Image>
                                        </DataTemplate>
                                    </GridViewColumn.CellTemplate>
                                </GridViewColumn>
                                <GridViewColumn Width="100" HeaderContainerStyle="{StaticResource myHeaderStyle}">
                                    <GridViewColumn.CellTemplate>
                                        <DataTemplate>
                                            <TextBlock  Name="urlToContent" MinWidth="150" Width="Auto" Style="{StaticResource TextStyle}">
                                              <Hyperlink NavigateUri="{Binding Path=URL}" Name="hlkURL">
                                                <TextBlock Text="Edit" HorizontalAlignment="Center"/>  
                                             </Hyperlink>
                                         </TextBlock>
                                        </DataTemplate>
                                    </GridViewColumn.CellTemplate>
                                </GridViewColumn>
                            </GridView>
                        </ListView.View>
                    </ListView>

                </Grid>

                <Grid Grid.Column="1">

                    <GroupBox x:Name="ItemDetails" Header="Item Details" FontFamily="Segoe UI" HorizontalAlignment="Center" Margin="2,-10,0,0" 
                      VerticalAlignment="Top" Height="Auto" Width="Auto" Grid.Row="0">
                        <Grid Margin="2,5,0,0" HorizontalAlignment="Center">

                            <Grid.RowDefinitions>
                                <RowDefinition Height="Auto"/>
                                <RowDefinition Height="*"/>
                            </Grid.RowDefinitions>

                            <Grid Grid.Row="0" HorizontalAlignment="Center">

                                <Grid.RowDefinitions>
                                    <RowDefinition Height="Auto"></RowDefinition>
                                    <RowDefinition Height="Auto"></RowDefinition>
                                    <RowDefinition Height="Auto"></RowDefinition>
                                </Grid.RowDefinitions>

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

                                <TextBlock Text="Item Name" FontFamily="Segoe UI" VerticalAlignment="Center" HorizontalAlignment="Right" Grid.Row="0" Grid.Column="1"
                         Margin="0,0,0,5"/>
                                <TextBlock x:Name="ItemNameTextBlock"  Text="{Binding Path=ItemName,Mode=OneWay}" FontFamily="Segoe UI" FontWeight="DemiBold" VerticalAlignment="Top" 
                         HorizontalAlignment="Left" Grid.Row="0" Grid.Column="2" Margin="5,0,0,0"/>

                                <TextBlock Text="Category" FontFamily="Segoe UI" VerticalAlignment="Center" HorizontalAlignment="Right" Grid.Row="1" Grid.Column="1"
                         Margin="0,0,0,5"></TextBlock>
                                <TextBlock x:Name="CategoryTextBlock" Text="{Binding Path=Category.CategoryName,Mode=OneWay}" FontFamily="Segoe UI" FontWeight="DemiBold" VerticalAlignment="Top"
                         HorizontalAlignment="Left" Grid.Row="1" Grid.Column="2" Margin="5,0,0,0"/>

                                <TextBlock Text="Item Quantity" FontFamily="Segoe UI" VerticalAlignment="Center" HorizontalAlignment="Right"  Grid.Row="2" Grid.Column="1"
                         Margin="0,0,0,5"></TextBlock>
                                <TextBlock x:Name="ItemQuantityTextBlock" Text="{Binding Path=ItemQuantity,Mode=OneWay}" FontFamily="Segoe UI" FontWeight="DemiBold" VerticalAlignment="Top"
                         HorizontalAlignment="Left" Grid.Row="2" Grid.Column="2" Margin="5,0,0,0"/>

                            </Grid>

                            <ListView x:Name="ItemIngredientsListView" Grid.Row="1" Margin="2,0,0,5" ScrollViewer.HorizontalScrollBarVisibility="Auto"
                              ScrollViewer.VerticalScrollBarVisibility="Auto">
                                <ListView.Resources>
                                    <Style TargetType="{x:Type GridViewColumnHeader}" x:Key="MyHeaderStyle">
                                        <Setter Property="FontFamily"  Value="Segoe UI Light"/>
                                        <Setter Property="FontWeight" Value="DemiBold"></Setter>
                                        <Setter Property="Height" Value="30"></Setter>
                                    </Style>

                                    <Style x:Key="myHeaderStyle" TargetType="{x:Type GridViewColumnHeader}">
                                        <Style.Triggers>
                                            <Trigger Property="IsMouseOver" Value="False">
                                                <Setter Property="Background" Value="#1570a6"/>
                                                <Setter Property="Foreground" Value="#FFFFFF"/>
                                            </Trigger>
                                            <Trigger Property="IsMouseOver" Value="True">
                                                <Setter Property="Foreground" Value="#000000"/>
                                            </Trigger>
                                        </Style.Triggers>
                                    </Style>

                                    <local:BackgroundConverter x:Key="BackgroundKey"/>

                                    <Style x:Key="columnHeaderContianerStyle" TargetType="ListViewItem">
                                        <Setter Property="Background">
                                            <Setter.Value>
                                                <Binding RelativeSource="{RelativeSource Self}" Converter="{StaticResource BackgroundKey}"/>
                                            </Setter.Value>
                                        </Setter>
                                        <!--<EventSetter Event="PreviewMouseDown" Handler="ListViewItem_PreviewMouseDown"></EventSetter>-->
                                    </Style>

                                </ListView.Resources>
                                <ListView.ItemContainerStyle>
                                    <Style TargetType="{x:Type ListViewItem}" BasedOn="{StaticResource columnHeaderContianerStyle}">
                                        <Setter Property="HorizontalContentAlignment" Value="Center"/>
                                        <Style.Triggers>
                                            <Trigger Property="IsKeyboardFocusWithin" Value="True">
                                                <Setter Property="IsSelected" Value="True" />
                                            </Trigger>
                                        </Style.Triggers>
                                    </Style>
                                </ListView.ItemContainerStyle>
                                <ListView.View>
                                    <GridView AllowsColumnReorder="true" ColumnHeaderContainerStyle="{StaticResource MyHeaderStyle}">
                                        <GridViewColumn Header="Ingredient ID" Width="80" DisplayMemberBinding="{Binding Path=ItemIngredientID,Mode=OneWay}" 
                                          HeaderContainerStyle="{StaticResource myHeaderStyle}"/>
                                        <GridViewColumn Header="Ingredient" Width="200" DisplayMemberBinding="{Binding Path=IngredientName,Mode=OneWay}" 
                                          HeaderContainerStyle="{StaticResource myHeaderStyle}"/>
                                    </GridView>
                                </ListView.View>
                            </ListView>
                        </Grid>
                    </GroupBox>

                </Grid>
            </Grid>

        </Grid>
    </ScrollViewer>
</Grid>

可能是我发布了巨大的xaml,因为我不确定整个用户控件到底出了什么问题。

有一个,请查看我的xaml并告诉我在哪里需要更改rowHeight或其他一些东西。

任何帮助都非常感谢。

1 个答案:

答案 0 :(得分:1)

WPF的ScrollViewer为其子元素提供了无限空间 - 我认为这会阻碍您查看ListView的垂直滚动条。让我们分析一下你的情况:

  1. 滚动查看器为其子网格提供了无限空间(让我们称之为A)。
  2. A分为三行:前两行&#39;高度将根据它们显示的内容(<RowDefinition Height="Auto" />)计算。最后一行将占用滚动查看器提供的剩余无限空间。
  3. 在最后一行中,放置了另一个网格(让我们称之为B),它有两列和三行。第二行占用剩余空间(仍为无限),因为其高度设置为*
  4. 在这一行中,放置了列表视图。这意味着它在WPF布局系统中具有无限的垂直空间,并且无需显示其垂直滚动条。
  5. 解决方案可能是限制此行的高度,但提供GridSplitter以便用户可以更改高度。 @pushpraj指出的另一个解决方案(当我写这篇文章时)是限制列表视图的高度。

    如果您有任何其他问题,请随时提出。