I've been working with the xamDataGrid and have a few questions:
1) I can bind to xml data, but when I make that data Hierarchical, only the parent nodes show up. Take for example the following data:
<Items> <Item Name="Apple" Color="Red" Price="$1" /> <Item Name="Orange" Color="Orange" Price="$1" /> <Item Name="Bag" Color="Tan" Price="$6" > <Item Name="Pen" Color="Blue" Price="$1" /> <Item Name="Eraser" Color="Pink" Price="$1" /> </Item> </Items>
I have also tried child nodes with a different tag than "Item".
2) I've noticed that all examples of hierarchical data in the xamDataGrid have column headers on each level. Is it possible to remove the headers from the child nodes? One forum post has lead me to believe that this is not possible.
3) Is it possible to have a completely different layout in the children? Lets say I want a child template that is a vertical stack panel of values, or something much more complex with an image and text data layed out in some other way.
Thanks for your help.-Jeff
Hi Jeff,
1) In order for the XML to be displayed hierarchically, it must be structured like this. Notice, the first element in the result set must have children, otherwise the others will not display children either (I'm not sure why it's set up that way).
<XmlDataProvider x:Key="xmlData" XPath="items/item"> <x:XData> <items xmlns=""> <item name="item a" id="1"> <subItems> <subItem name="sub item a" /> </subItems> </item> <item name="item b" id="2" /> <item name="item c" id="3" /> </items> </x:XData></XmlDataProvider>
2) This blog post shows how to remove the field headers from the child records.
3) You can arrange a FieldLayout's Fields to be in any custom arrangement you like. The xamFeatureBrowser application, which is installed when you install NetAdvantage for WPF, has a demo of this. Under XamDataGrid > Layout and Behavior > Record Layout Customization
The grid in that demo is declared as:
<igDP:XamDataGrid Grid.Row="1" x:Name="XamDataGrid1" DataSource="{Binding Source={StaticResource QuarterbackData}, XPath=season}"> <igDP:XamDataGrid.FieldLayoutSettings> <igDP:FieldLayoutSettings AutoArrangeCells="Never" AutoGenerateFields="False"/> </igDP:XamDataGrid.FieldLayoutSettings> <igDP:XamDataGrid.FieldLayouts> <igDP:FieldLayout> <igDP:FieldLayout.Fields> <igDP:Field Name="team" Label="Team" Row="0" Column="0" ColumnSpan="5" /> <igDP:Field Name="games" Label="Games Played" Row="1" Column="0"/> <igDP:Field Name="qbrate" Label="Rating" Row="1" Column="1"/> <igDP:Field Name="comp" Label="Completions" Row="1" Column="2"/> <igDP:Field Name="att" Label="Attempts" Row="1" Column="3"/> <igDP:Field Name="pct" Label="Passing %" Row="1" Column="4"/> <igDP:Field Name="passingyards" Label="Total Passing Yards" Row="2" Column="0" /> <igDP:Field Name="passingyardsperattempt" Label="Passing Yards/Attempt" Row="2" Column="1" /> <igDP:Field Name="passingyardspergame" Label="Passing Yards/Game" Row="2" Column="2" /> <igDP:Field Name="passingtd" Label="Passing Touchdowns" Row="2" Column="3" /> <igDP:Field Name="int" Label="Interceptions" Row="2" Column="4" /> <igDP:Field Name="rushs" Label="Rushes" Row="3" Column="0" /> <igDP:Field Name="rushyrds" Label="Rushing Yards" Row="3" Column="1" /> <igDP:Field Name="rushyardspergame" Label="Rushing Yard/Game" Row="3" Column="2" /> <igDP:Field Name="rushavg" Label="Rushing Average" Row="3" Column="3" /> <igDP:Field Name="rushtd" Label="Rushing Touchdowns" Row="3" Column="4" /> <igDP:Field Name="sack" Label="Sacks" Row="4" Column="0" /> <igDP:Field Name="yardslost" Label="Yards Lost" Row="4" Column="1" /> <igDP:Field Name="fum" Label="Fumbles" Row="4" Column="2" /> <igDP:Field Name="fuml" Label="Fumbles Lost" Row="4" Column="3" /> </igDP:FieldLayout.Fields> </igDP:FieldLayout> </igDP:XamDataGrid.FieldLayouts> </igDP:XamDataGrid>
Josh,
I followed your blog post to remove child headers (#2 above), when I alter your code to instead use a XmlDataProvider, the Headers reappear. I also changed the field names and set AutoGenerateFields="False". Any thoughts?
Here's the xaml:
<Window.Resources>
<XmlDataProvider x:Key="xmlData" XPath="items/item"> <x:XData> <items xmlns=""> <item name="item a" id="1"> <subItems> <subItem name="sub item a" /> </subItems> </item> <item name="item b" id="2" /> <item name="item c" id="3" /> </items> </x:XData> </XmlDataProvider>
</Window.Resources>
<igDP:XamDataGrid x:Name="xamDataGrid" DataSource="{Binding Mode=Default, Source={StaticResource xmlData}}" FieldLayoutInitialized="xamDataGrid_FieldLayoutInitialized" GroupByAreaLocation="None" >
<igDP:XamDataGrid.Resources> <!-- This Style enables us to monitor changes to field widths. --> <Style TargetType="{x:Type igDP:LabelPresenter}"> <EventSetter Event="FrameworkElement.SizeChanged" Handler="OnLabelPresenterSizeChanged" /> </Style> </igDP:XamDataGrid.Resources>
<igDP:XamDataGrid.FieldLayouts> <igDP:FieldLayout Key="master"> <igDP:FieldLayout.Fields> <igDP:Field Name="name" /> <igDP:Field Name="id"> <igDP:Field.Settings> <igDP:FieldSettings LabelWidth="260" CellWidth="260" /> </igDP:Field.Settings> </igDP:Field> </igDP:FieldLayout.Fields> <igDP:FieldLayout.FieldSettings> <igDP:FieldSettings> <igDP:FieldSettings.CellValuePresenterStyle> <Style TargetType="{x:Type igDP:CellValuePresenter}"> <Setter Property="FontWeight" Value="Bold" /> </Style> </igDP:FieldSettings.CellValuePresenterStyle> </igDP:FieldSettings> </igDP:FieldLayout.FieldSettings> </igDP:FieldLayout>
<igDP:FieldLayout Key="detail"> <igDP:FieldLayout.Fields> <igDP:Field Name="name" /> <igDP:Field Name="id" /> </igDP:FieldLayout.Fields> <igDP:FieldLayout.FieldSettings> <igDP:FieldSettings AllowResize="False" LabelMaxHeight="0"> <igDP:FieldSettings.CellValuePresenterStyle> <!-- This Style aligns the child record cell text with the parent cells regardless of whether the record is selected, mouseover, etc. --> <Style TargetType="{x:Type igDP:CellValuePresenter}"> <Setter Property="Margin" Value="-3,0,0,0" /> <Style.Triggers> <DataTrigger Binding="{Binding Path=IsMouseOver, RelativeSource={RelativeSource AncestorType={x:Type igDP:DataRecordPresenter}}}" Value="True" > <Setter Property="Margin" Value="-3,0,0,0" /> </DataTrigger> <DataTrigger Binding="{Binding Path=IsSelected, RelativeSource={RelativeSource AncestorType={x:Type igDP:DataRecordPresenter}}}" Value="True" > <Setter Property="Margin" Value="-3,0,0,0" /> </DataTrigger> </Style.Triggers> </Style> </igDP:FieldSettings.CellValuePresenterStyle> </igDP:FieldSettings> </igDP:FieldLayout.FieldSettings> <igDP:FieldLayout.Settings> <igDP:FieldLayoutSettings AutoGenerateFields="False" HighlightAlternateRecords="True" /> </igDP:FieldLayout.Settings> </igDP:FieldLayout> </igDP:XamDataGrid.FieldLayouts>
<igDP:XamDataGrid.FieldSettings> <igDP:FieldSettings AllowEdit="False" CellClickAction="SelectRecord" /> </igDP:XamDataGrid.FieldSettings>
</igDP:XamDataGrid></Window>