SL4数据网格与数据页面和分页器 [英] SL4 datagrid with datapager and gridsplitter

查看：138
本文介绍了SL4数据网格与数据页面和分页器的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我有一个带有两行和一个GridSplitter的网格。
在第一行中，我有一个StackPanel，其中包含DataPager和DataGrid。
在第二行中，我将扩展器控件垂直底部对齐，并向上展开方向。
DataGrid将占据两行的所有空间（垂直伸展）的想法，但是当Expander头被点击时，它将向上扩展，DataGrid将自动缩小。



但这没有发生。当我点击扩展器时，它会扩展，但页面大小增加而不是DataGrid（行0）向上收缩。
任何人都知道我该如何实现？
我的代码如下。我已经尝试将ScrollViewers放在DataGrid级别，StackPanel级别以及Grid级别上，但没有成功。

 < Grid x ：Name =contentGridHorizo​​ntalAlignment =StretchGrid.Column =1> 
< Grid.RowDefinitions> 
< RowDefinition /> 
< RowDefinition /> 
< /Grid.RowDefinitions> 
< tools：GridSplitter x：Name =rowSplitterGrid.Row =1VerticalAlignment =TopHorizo​​ntalAlignment =Stretch/> 
< ScrollViewer Horizo​​ntalScrollBarVisibility =AutoVerticalScrollBarVisibility =Auto> 
< StackPanel Grid.Row =0Orientation =VerticalVerticalAlignment =Stretch> 
< StackPanel Orientation =Horizo​​ntalWidth =autoHeight =30> 
< TextBlock Text =搜索Margin =20,10,0,0TextAlignment =CenterVerticalAlignment =CenterHeight =25/> 
< TextBox Width =200Margin =5,0,0,0x：Name =txtSearchHeight =25/> 
< ComboBox x：Name =cboFilterSelectedIndex =0SelectedValuePath =NameVerticalAlignment =CenterHeight =25> 
< ComboBoxItem Name =Code>行否< / ComboBoxItem> 
< ComboBoxItem Name =Description1>标题< / ComboBoxItem> 
< ComboBoxItem Name =Description2>快乐文本< / ComboBoxItem> 
< ComboBoxItem Name =PromotionType>促销类型< / ComboBoxItem> 
< / ComboBox> 
< CheckBox x：Name =chkIsGroupingMargin =10,5,0,0Content =启用分组Checked =chkIsGrouping_Checked/> 
< / StackPanel> 
< sdk：DataPager Height =25Name =dataPager1Source ={Binding ElementName = productDomainDataSource，Path = Data}/> 
 
< sdk：DataGrid AutoGenerateColumns =FalseHorizo​​ntalScrollBarVisibility =AutoVerticalScrollBarVisibility =AutoHorizo​​ntalAlignment =StretchItemsSource ={Binding ElementName = productDomainDataSource，Path = Data}Name = productDataGridRowDetailsVisibilityMode =VisibleWhenSelectedVerticalAlignment =TopSelectionChanged =productDataGrid_SelectionChanged> 
< sdk：DataGrid.Columns> 
< sdk：DataGridTextColumn x：Name =codeColumnBinding ={Binding Path = Code}Header =CodeWidth =SizeToHeader/> 
< sdk：DataGridTextColumn x：Name =description1ColumnBinding ={Binding Path = Description1}Header =Description 1Width =SizeToHeader/> 
< sdk：DataGridTextColumn x：Name =description2ColumnBinding ={Binding Path = Description2}Header =Description 2Width =SizeToHeader/> 
< sdk：DataGridTextColumn x：Name =productIDColumnBinding ={Binding Path = ProductID，Mode = OneWay}Header =Product IDIsReadOnly =TrueWidth =SizeToHeaderVisibility =Collapsed /> 
< sdk：DataGridTextColumn x：Name =promotionIDColumnBinding ={Binding Path = PromotionID}Header =Promotion IDWidth =SizeToHeaderVisibility =Collapsed/> 
< sdk：DataGridTextColumn x：Name =promotionTypeIDColumnBinding ={Binding Path = PromotionTypeID}Header =Promotion Type IDWidth =SizeToHeaderVisibility =Collapsed/> 
< sdk：DataGridTextColumn x：Name =retailPriceColumnBinding ={Binding Path = RetailPrice}Header =Retail PriceWidth =SizeToHeader/> 
< sdk：DataGridTextColumn x：Name =retailPriceUnitColumnBinding ={Binding Path = RetailPriceUnit}Header =零售价单位Width =SizeToHeader/> 
< sdk：DataGridTextColumn x：Name =templateIDColumnBinding ={Binding Path = TemplateID}Header =Template IDWidth =SizeToHeader/> 
< sdk：DataGridTextColumn x：Name =wasPriceColumnBinding ={Binding Path = WasPrice}Header =Was PriceWidth =SizeToHeader/> 
< sdk：DataGridTextColumn x：Name =wasPriceUnitColumnBinding ={Binding Path = WasPriceUnit}Header =is Price UnitWidth =SizeToHeader/> 
< / sdk：DataGrid.Columns> 
< / sdk：DataGrid> 
 
< / StackPanel> 
< / ScrollViewer> 
< expandertoolkit：Expander x：Name =Expander1Margin =0,10,0,0Grid.Row =1VerticalAlignment =Bottom
 ExpandDirection =Up
 HeaderTemplate ={StaticResource DTHeader}
 ContentTemplate ={StaticResource DTContent}> 
 
< / expandertoolkit：Expander> 
< / Grid>


解决方案

通常如果你想要一行）收缩另一个（比如说顶行），那么底行是自动调整大小，顶部是星号。



问题是自动大小的行会适合他们的内容，而Star的大小只会占据其余部分，但如果没有限制整体规模，自动调整的行数将会增长，而星标行将会采取任何可以满足其内容的方式。



如果您想要提及的崩溃/增长行为，您需要设置控件的总体大小（如果使用的位置）。



请注意，我无法弄清楚为什么你在这个例子中有一个Gridsplitter，所以我可能会缺少一些细节。


I have a grid with two Rows and a GridSplitter. In the first Row I have a StackPanel which has the DataPager and DataGrid in it. In the second Row I have the Expander Control vertically bottom aligned and Expand Direction Upward. The idea that the DataGrid will occupy all the space (vertically stretch) of both Rows but when the Expander header will be clicked, it will expand upward and DataGrid will shrink automatically.

But this is not happening. When I click on the expander, it does expand but the page size increase instead of DataGrid(Row 0) shrinks upward. Anybody know How I can achieve that? My Code is as below . I have tried by putting the ScrollViewers at DataGrid level, StackPanel level and also Grid level too but without success.

 <Grid x:Name="contentGrid" HorizontalAlignment="Stretch" Grid.Column="1">
                <Grid.RowDefinitions>
                    <RowDefinition />
                    <RowDefinition/>
                </Grid.RowDefinitions>
                <tools:GridSplitter x:Name="rowSplitter" Grid.Row="1"  VerticalAlignment="Top" HorizontalAlignment="Stretch"/>
                <ScrollViewer HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto">
                    <StackPanel Grid.Row="0" Orientation="Vertical" VerticalAlignment="Stretch" >
                    <StackPanel Orientation="Horizontal" Width="auto" Height="30">
                        <TextBlock Text="Search" Margin="20,10,0,0" TextAlignment="Center" VerticalAlignment="Center" Height="25"/>
                        <TextBox Width="200" Margin="5,0,0,0" x:Name="txtSearch" Height="25"/>
                        <ComboBox x:Name="cboFilter" SelectedIndex="0" SelectedValuePath="Name" VerticalAlignment="Center" Height="25">
                            <ComboBoxItem Name="Code">Line No</ComboBoxItem>
                            <ComboBoxItem Name="Description1">Heading</ComboBoxItem>
                            <ComboBoxItem Name="Description2">Happy Text</ComboBoxItem>
                            <ComboBoxItem Name="PromotionType">Promotion Type</ComboBoxItem>
                        </ComboBox>
                        <CheckBox x:Name="chkIsGrouping" Margin="10,5,0,0" Content="Enable Grouping" Checked="chkIsGrouping_Checked"/>
                         </StackPanel>
                    <sdk:DataPager Height="25" Name="dataPager1"  Source="{Binding ElementName=productDomainDataSource, Path=Data}" />

                    <sdk:DataGrid  AutoGenerateColumns="False"   HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto" HorizontalAlignment="Stretch" ItemsSource="{Binding ElementName=productDomainDataSource, Path=Data}" Name="productDataGrid" RowDetailsVisibilityMode="VisibleWhenSelected" VerticalAlignment="Top" SelectionChanged="productDataGrid_SelectionChanged" >
                        <sdk:DataGrid.Columns>
                            <sdk:DataGridTextColumn x:Name="codeColumn" Binding="{Binding Path=Code}" Header="Code" Width="SizeToHeader" />
                            <sdk:DataGridTextColumn x:Name="description1Column" Binding="{Binding Path=Description1}" Header="Description 1" Width="SizeToHeader" />
                            <sdk:DataGridTextColumn x:Name="description2Column" Binding="{Binding Path=Description2}" Header="Description 2" Width="SizeToHeader" />
                            <sdk:DataGridTextColumn x:Name="productIDColumn" Binding="{Binding Path=ProductID, Mode=OneWay}" Header="Product ID" IsReadOnly="True" Width="SizeToHeader" Visibility="Collapsed" />
                            <sdk:DataGridTextColumn x:Name="promotionIDColumn" Binding="{Binding Path=PromotionID}" Header="Promotion ID" Width="SizeToHeader" Visibility="Collapsed"/>
                            <sdk:DataGridTextColumn x:Name="promotionTypeIDColumn" Binding="{Binding Path=PromotionTypeID}" Header="Promotion Type ID" Width="SizeToHeader" Visibility="Collapsed" />
                            <sdk:DataGridTextColumn x:Name="retailPriceColumn" Binding="{Binding Path=RetailPrice}" Header="Retail Price" Width="SizeToHeader" />
                            <sdk:DataGridTextColumn x:Name="retailPriceUnitColumn" Binding="{Binding Path=RetailPriceUnit}" Header="Retail Price Unit" Width="SizeToHeader" />
                            <sdk:DataGridTextColumn x:Name="templateIDColumn" Binding="{Binding Path=TemplateID}" Header="Template ID" Width="SizeToHeader" />
                            <sdk:DataGridTextColumn x:Name="wasPriceColumn" Binding="{Binding Path=WasPrice}" Header="Was Price" Width="SizeToHeader" />
                            <sdk:DataGridTextColumn x:Name="wasPriceUnitColumn" Binding="{Binding Path=WasPriceUnit}" Header="Was Price Unit" Width="SizeToHeader" />
                        </sdk:DataGrid.Columns>
                    </sdk:DataGrid>

                </StackPanel>
                </ScrollViewer>
                <expandertoolkit:Expander x:Name="Expander1" Margin="0,10,0,0" Grid.Row="1" VerticalAlignment="Bottom"
                       ExpandDirection="Up"
                       HeaderTemplate="{StaticResource DTHeader}"
                       ContentTemplate="{StaticResource DTContent}">

                    </expandertoolkit:Expander>
            </Grid>

解决方案

Normally if you want one row (say the bottom row) to shrink another (say the top row) then the bottom row is Auto-sized and the top is Star-sized.

The problem is that Auto-size rows will fit to their content and the Star sized will just grab the remainder, but if there is nothing restraining the overall size Auto-sized rows will just grow and the Star-sized rows will take whatever they can get to fit their content.

You need to set the overall size of the control, where it is used, if you want the collapse/grow behaviour you mention.

Please note I could not work out why you have a Gridsplitter in that example in the first place, so I may be missing some details.

这篇关于SL4数据网格与数据页面和分页器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！

查看全文
相关文章
其他开发最新文章
热门教程
热门工具
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆