Hi,

I am using card view to display the data . But by default the card view is oriented in vertical direction but i need the cards (row) to come in horizontal direction . How can i do this in xaml. Please provide me a sample code.

Thanx

From other thread i came to know that i have to set the ItemsPanel property of the DataGridControl with another one where the ItemsPanelTemplate contains a VirtualizingCardPanel with its Orientation property set to Horizontal. i tried to do this like below but it didnt worked out..

XAML:

    <Window.Resources>
     
        <ItemsPanelTemplate x:Key="IPT">
            <xcdg:VirtualizingCardPanel Orientation="Horizontal"/>
        </ItemsPanelTemplate>
       
       
    </Window.Resources>

        <StackPanel Grid.Row="1">
            <xcdg:DataGridControl Name="dataGridControl1"
                                  AutoCreateColumns="False" ReadOnly="True"
                                  ItemsPanel="{StaticResource IPT}">

                <xcdg:DataGridControl.Columns>
                    <xcdg:Column FieldName="Name" Visible="False"  Title="Name" ReadOnly="True" IsMainColumn="True" ></xcdg:Column>
                    <xcdg:Column FieldName="Help" ReadOnly="True" Title="Help" ></xcdg:Column>
                </xcdg:DataGridControl.Columns>

                <xcdg:DataGridControl.View>
                    <xcdg:CardView CardWidth="75" UseDefaultHeadersFooters="False" AllowCardResize="False">
                    </xcdg:CardView>
                </xcdg:DataGridControl.View>

            </xcdg:DataGridControl>
        </StackPanel>

Is there other way to do this. I want to do it in xaml code 

Thanks

Hi saurabh,

  It seems that when you affect the ItemsPanelTemplate with a CardViewItemsHost (formerly VirtualizingCardViewPanel), the Orientation is not correctly updated. I was able to reproduce and a I filled a bug report for this issue.

Fortunately, there is a workaround: redefine de DataGridControl's ControlTemplate

(ControlTemplate was extracted from "themes\common\CardView.GridElementTemplates.xaml", from the installation folder of the package.)

<!--**************************

* TEMPLATE: DataGridControl 

************************** -->

<ControlTemplate x:Key="customCardViewDataGridControlTemplate"

              TargetType="xcdg:DataGridControl">

   <Border Background="{TemplateBinding Background}"

        BorderBrush="{TemplateBinding BorderBrush}"

        BorderThickness="{TemplateBinding BorderThickness}">

      <!-- The AdornerDecorator will allow visual cues for Drag & Drop operations. -->

      <AdornerDecorator x:Name="PART_DragDropAdornerDecorator">

         <!-- The CardViewScrollViewer takes care of laying out the various sections of

        a DataGrid in CardView: FixedHeaders, FixedFooters, etc. -->

         <xcdg:CardViewScrollViewer x:Name="PART_ScrollViewer"

                                  Padding="{TemplateBinding Padding}">

 <!-- ORIENTATION CHANGED ON THIS ELEMENT --> 

            <xcdg:CardViewItemsHost Margin="0,15,0,5" Orientation="Horizontal"

                            FixedSize="{Binding RelativeSource={RelativeSource Self}, Path=(xcdg:DataGridControl.DataGridContext).CardWidth, Mode=TwoWay}"

                            AllowCardResize="{Binding RelativeSource={RelativeSource Self}, Path=(xcdg:DataGridControl.DataGridContext).AllowCardResize}"

                            SeparatorLinePen="{Binding RelativeSource={RelativeSource Self}, Path=(xcdg:DataGridControl.DataGridContext).SeparatorLinePen}" />

         </xcdg:CardViewScrollViewer>

      </AdornerDecorator>

   </Border>

</ControlTemplate>