WPF列表框大於窗口

Question

我正在學習wpf / c＃，並應用我所學到的有關wpf布局差異的知識。 我試圖建立一個簡單的員工列表/詳細信息窗口，但我有一點問題：

列表框的高度大於窗口的高度，而不是添加滾動條，其余元素未顯示（某些元素只顯示了一半）

這是一張圖片：

這是xaml：

<Window x:Class="elexim.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:elexim"
        mc:Ignorable="d"
        Title="MainWindow">

    <StackPanel Orientation="Vertical">
        <Label HorizontalAlignment="Center">Employés </Label>
        <Separator Margin="20,0,0,0"/>

        <Grid Margin="0,20,0,0">

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

            <Grid.ColumnDefinitions>
                <ColumnDefinition/>
                <ColumnDefinition/>
            </Grid.ColumnDefinitions>

            <GroupBox Header="Liste Employés" Margin="20,0,0,0">

                <ListBox>
                    <ListBox.ItemsPanel>
                        <ItemsPanelTemplate>
                            <UniformGrid Columns="3"/>
                        </ItemsPanelTemplate>
                    </ListBox.ItemsPanel>

                    <local:employeeInfo/>
                    <local:employeeInfo/>
                    <local:employeeInfo/>
                    <local:employeeInfo/>
                    <local:employeeInfo/>
                    <local:employeeInfo/>
                    <local:employeeInfo/>
                    <local:employeeInfo/>
                    <local:employeeInfo/>
                    <local:employeeInfo/>
                    <local:employeeInfo/>
                    <local:employeeInfo/>
                    <local:employeeInfo/>
                    <local:employeeInfo/>
                    <local:employeeInfo/>
                    <local:employeeInfo/>
                    <local:employeeInfo/>
                    <local:employeeInfo/>
                </ListBox>
            </GroupBox>

            <GroupBox Header="Detail Employé" Margin="20,0,0,0" Grid.Column="1">
                <Grid>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="auto"/>
                        <RowDefinition Height="auto"/>
                        <RowDefinition Height="auto"/>
                        <RowDefinition Height="auto"/>
                    </Grid.RowDefinitions>

                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="auto"/>
                        <ColumnDefinition/>
                    </Grid.ColumnDefinitions>

                    <Label Margin="10">Nom</Label>
                    <TextBox Grid.Column="1" VerticalAlignment="Center"/>

                    <Label Grid.Column="0" Grid.Row="1" Margin="10">Age</Label>
                    <TextBox Grid.Row="1" Grid.Column="1" VerticalAlignment="Center"/>

                    <Label Grid.Column="0" Grid.Row="2" Margin="10">Salaire</Label>
                    <TextBox Grid.Row="2" Grid.Column="1" VerticalAlignment="Center"/>

                    <StackPanel Orientation="Horizontal" Grid.Column="0" 
                                Grid.Row="3" Grid.ColumnSpan="2"
                                HorizontalAlignment="Right">
                        <Button Margin="10" MinWidth="100">Valider</Button>
                        <Button Margin="10" MinWidth="100">Annuler</Button>
                    </StackPanel> 

                </Grid>


            </GroupBox>
        </Grid>

    </StackPanel>

</Window>

如何使列表框添加滾動條而不是當前效果？

Answer 1

只需使用StackPanel Grid ：

讓我舉一個例子：

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
    </Grid.RowDefinitions>
    <Label HorizontalAlignment="Center">Employés </Label>
    <Separator Grid.Row="1" Margin="20,0,0,0"/>

    <Grid Grid.Row="2" Margin="0,20,0,0">

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

        <Grid.ColumnDefinitions>
            <ColumnDefinition/>
            <ColumnDefinition/>
        </Grid.ColumnDefinitions>

        <GroupBox Header="Liste Employés" Margin="20,0,0,0">

            <ListBox>
                <ListBox.ItemsPanel>
                    <ItemsPanelTemplate>
                        <UniformGrid Columns="3"/>
                    </ItemsPanelTemplate>
                </ListBox.ItemsPanel>

                <local:employeeInfo/>
                <local:employeeInfo/>
                <local:employeeInfo/>
                <local:employeeInfo/>
                <local:employeeInfo/>
                <local:employeeInfo/>
                <local:employeeInfo/>
                <local:employeeInfo/>
                <local:employeeInfo/>
                <local:employeeInfo/>
                <local:employeeInfo/>
                <local:employeeInfo/>
                <local:employeeInfo/>
                <local:employeeInfo/>
                <local:employeeInfo/>
                <local:employeeInfo/>
                <local:employeeInfo/>
                <local:employeeInfo/>
            </ListBox>
        </GroupBox>

        <GroupBox Header="Detail Employé" Margin="20,0,0,0" Grid.Column="1">
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition Height="auto"/>
                    <RowDefinition Height="auto"/>
                    <RowDefinition Height="auto"/>
                    <RowDefinition Height="auto"/>
                </Grid.RowDefinitions>

                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="auto"/>
                    <ColumnDefinition/>
                </Grid.ColumnDefinitions>

                <Label Margin="10">Nom</Label>
                <TextBox Grid.Column="1" VerticalAlignment="Center"/>

                <Label Grid.Column="0" Grid.Row="1" Margin="10">Age</Label>
                <TextBox Grid.Row="1" Grid.Column="1" VerticalAlignment="Center"/>

                <Label Grid.Column="0" Grid.Row="2" Margin="10">Salaire</Label>
                <TextBox Grid.Row="2" Grid.Column="1" VerticalAlignment="Center"/>

                <StackPanel Orientation="Horizontal" Grid.Column="0" 
                            Grid.Row="3" Grid.ColumnSpan="2"
                            HorizontalAlignment="Right">
                    <Button Margin="10" MinWidth="100">Valider</Button>
                    <Button Margin="10" MinWidth="100">Annuler</Button>
                </StackPanel> 

            </Grid>


        </GroupBox>
    </Grid>

</Grid>

或者將StackPanel放入ScrollViewer ：

<ScrollViewer VerticalScrollBarVisibility="Auto">
  <StackPanel ... />
</ScrollViewer>