Silverlight,XAML,DataGrid不会自动调整大小,也不会自动滚动条

时间:2012-07-24 15:41:30

标签: silverlight xaml datagrid

有人能告诉我为什么这个例子中的datagrid在超过包含它的Grid.Row边界时会被切断吗?以下是您可以在VS 2010“Silverlight应用程序”模板中使用的xaml和代码隐藏。提前谢谢。

<UserControl
x:Class="SilverlightApplication3.MainPage"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
xmlns:sdk="http://schemas.microsoft.com/winfx/2006/xaml/presentation/sdk"
xmlns:toolkit="http://schemas.microsoft.com/winfx/2006/xaml/presentation/toolkit"
mc:Ignorable="d" >

<Grid>

    <Border>

        <Grid>

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

            <!-- header -->
            <Border Grid.Row="0" HorizontalAlignment="Stretch" VerticalAlignment="Top" Height="40" >
            </Border>

            <!-- employee category selection -->
            <Grid Grid.Row="1" Margin="10">
                <StackPanel>
                    <StackPanel Orientation="Horizontal">
                        <TextBlock Text="Category:" Margin="0,0,10,0" VerticalAlignment="Center" />
                        <ComboBox ItemsSource="{Binding EmployeeTypes}" SelectedItem="{Binding EmployeeType, Mode=TwoWay}" MinWidth="100" />
                    </StackPanel>
                    <Border BorderBrush="Black" BorderThickness="10" Height="2" Margin="0,10,0,0" ></Border>
                </StackPanel>
            </Grid>

            <!-- content -->
            <Grid Grid.Row="2">

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

                <!-- daily employee grid -->
                <Grid Grid.Row="0" Visibility="Visible" Margin="10">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="Auto" />
                        <ColumnDefinition Width="*" />
                    </Grid.ColumnDefinitions>
                    <StackPanel Grid.Column="0">

                        <TextBlock Text="Category Type:" />
                        <ComboBox ItemsSource="{Binding Categories}"
                              SelectedItem="{Binding Category, Mode=TwoWay}"
                              DisplayMemberPath="Name" HorizontalAlignment="Left" Width="250">
                        </ComboBox>

                        <TextBlock Text="Category Types:" Margin="0,10,0,0" />
                        <sdk:DataGrid x:Name="dataGrid" AutoGenerateColumns="True"
                                          HorizontalAlignment="Left" VerticalAlignment="Stretch" MinWidth="250" VerticalScrollBarVisibility="Visible" >
                            <sdk:DataGrid.ColumnHeaderStyle>
                                <Style TargetType="sdk:DataGridColumnHeader">
                                    <Setter Property="FontWeight" Value="Bold"/>
                                </Style>
                            </sdk:DataGrid.ColumnHeaderStyle>
                        </sdk:DataGrid>

                    </StackPanel>

                </Grid>

            </Grid>

            <!-- buttons -->
            <StackPanel Grid.Row="3" Orientation="Horizontal" HorizontalAlignment="Right" Margin="0,10,0,0" >

                <Button Command="{Binding SaveCommand}"
                        Width="80" HorizontalContentAlignment="Center" Margin="0,0,2,0">
                    <StackPanel Orientation="Horizontal">
                        <Image Source="../Images/Approve24x24.png" Height="24" Width="24"/>
                        <TextBlock Text="Save" VerticalAlignment="Center" Margin="2"/>
                    </StackPanel>
                </Button>

                <Button Command="{Binding CancelCommand}" 
                        Width="80" HorizontalContentAlignment="Center">
                    <StackPanel Orientation="Horizontal">
                        <Image Source="../Images/Delete24x24.png" Height="24" Width="24"/>
                        <TextBlock Text="Cancel" VerticalAlignment="Center" Margin="2"/>
                    </StackPanel>
                </Button>

            </StackPanel>

        </Grid>
    </Border>
</Grid>

和代码隐藏:

using System.Collections.Generic;

使用System.Windows.Controls;

命名空间SilverlightApplication3 {     public partial class MainPage:UserControl     {         公共MainPage()         {             的InitializeComponent();

        List<string> testItems = new List<string>();

        for (int i = 0; i < 50; i++)
        {
            testItems.Add(string.Format("Item Number {0}", i.ToString()));
        }

        this.dataGrid.ItemsSource = testItems;
    }
}

}

1 个答案:

答案 0 :(得分:0)

您使用StackPanel显示一些元素和数据网格。所以这里datagrid不限制在任何高度,而且stackpanel高度的父网格是Auto。因此,没有任何地方可以让网格占据固定的大小。

我在网格中修改了你的代码。

                <!-- content -->
            <Grid Grid.Row="2">
                <Grid.RowDefinitions>
                    <RowDefinition Height="*" />                      
                    <RowDefinition Height="Auto" />                     
                </Grid.RowDefinitions>  
                <!-- daily employee grid -->
                <Grid Grid.Row="0" Visibility="Visible" Margin="10">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto"/>
                        <RowDefinition Height="28" />
                        <RowDefinition Height="*"/>                     
                    </Grid.RowDefinitions>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="Auto" />
                        <ColumnDefinition Width="*" />
                    </Grid.ColumnDefinitions>
                    <StackPanel>
                        <TextBlock Text="Category Type:" />
                        <ComboBox ItemsSource="{Binding Categories}"
                          SelectedItem="{Binding Category, Mode=TwoWay}"
                          DisplayMemberPath="Name" HorizontalAlignment="Left" Width="250">
                        </ComboBox>

                    </StackPanel>
                    <TextBlock Text="Category Types:" Margin="0,10,0,0" Grid.Row="1" />
                    <sdk:DataGrid x:Name="dataGrid" AutoGenerateColumns="True" Grid.Row="2" ScrollViewer.VerticalScrollBarVisibility="Visible" Margin="10"
                                      HorizontalAlignment="Left" VerticalAlignment="Top" MinWidth="250" VerticalScrollBarVisibility="Visible" >
                        <sdk:DataGrid.ColumnHeaderStyle>
                            <Style TargetType="sdk:DataGridColumnHeader">
                                <Setter Property="FontWeight" Value="Bold"/>
                            </Style>
                        </sdk:DataGrid.ColumnHeaderStyle>
                    </sdk:DataGrid>
                </Grid>
            </Grid>

这应该会给你预期的结果。