stack cell in a row | Infragistics Forums

495

stack cell in a row

Armin posted over 13 years ago

Is it possible to define the following layout:

A row consists of:

Column 1: Cell A and Cell B stacked (vertically)

Column 2: Cell C (height of C = height A + height B)

Thanks.

3520

Verified Answer
Offline Galina Edinakova posted over 13 years ago in reply to Armin

Hi Dunken,

Please ignore the above post.

I hope I got your idea right. Here are the styles I created to achieve the label layout you're describing:

<igc:XamDataPresenter.Resources>
                <Style TargetType="{x:Type igc:LabelPresenter}" x:Key="rowspanLabel">
                    <Setter Property="Template">
                        <Setter.Value>
                            <ControlTemplate TargetType="{x:Type igc:LabelPresenter}">
                                <Grid>
                                    <Grid.RowDefinitions>
                                        <RowDefinition Height="26"/>
                                        <RowDefinition Height="26"/>
                                        <RowDefinition Height="26"/>
                                    </Grid.RowDefinitions>
                                    <Label Content="My Additional Label" Grid.Row="0" />
                                    <Label Content="My Custom Label" Grid.RowSpan="2" Grid.Row="1" HorizontalContentAlignment="Center" VerticalContentAlignment="Center"/>
                                </Grid>
                            </ControlTemplate>
                        </Setter.Value>
                    </Setter>
                </Style>
                <Style TargetType="{x:Type igc:LabelPresenter}" x:Key="hideLabel">
                    <Setter Property="Visibility" Value="Collapsed" />
                </Style>
            </igc:XamDataPresenter.Resources>

Then I applied these 2 styles to the 2 labels as follows:

<igc:Field Name="name" Row="0" Column="0" >
                            <igc:Field.Settings>
                                <igc:FieldSettings LabelPresenterStyle="{StaticResource rowspanLabel}" />
                            </igc:Field.Settings>
                        </igc:Field>
                        <igc:Field Name="department" Row="1" Column="0" >
                            <igc:Field.Settings>
                                <igc:FieldSettings LabelPresenterStyle="{StaticResource hideLabel}" />
                            </igc:Field.Settings>
                        </igc:Field>

Please let me know If this has helped you.
Cancel
Reply

Reject Answer

Cancel
3520

Offline Galina Edinakova posted over 13 years ago

Hi Dunken,

In order to achieve the layout you're describing, first you need to set 2 properties of FieldLayoutSettings as follows: AutoArrangeCells = "Never" and AutoGenerateFields="False". Next, you should define the desired field layout - you need to define the position (row and column) and the rowspan(colspan) of each field. For example:

<igc:XamDataPresenter.FieldLayouts>
<igc:FieldLayout>
<igc:FieldLayout.Fields>
<igc:Field Name="name" Row="0" Column="0" />
<igc:Field Name="department" Row="1" Column="0" />
<igc:Field Name="salary" Row="0" Column="1" RowSpan="2" />
<igc:Field Name="email" Row="0" Column="2" />
</igc:FieldLayout.Fields>
</igc:FieldLayout>
</igc:XamDataPresenter.FieldLayouts>

Hope this helps.
Cancel
Reply

Cancel
495

Offline Armin posted over 13 years ago

OK, I just figured it out:

                        <igDP:FieldLayout.Fields>
                            <igDP:Field Name="A" Column="0" RowSpan="2" />
                            <igDP:Field Name="B" Column="1" />
                            <igDP:Field Name="C" Row="1" Column="1" />
                            <igDP:Field Name="D" Column="2" />
                            <igDP:Field Name="E" Row="1" Column="2" />
                        </igDP:FieldLayout.Fields>

B, C and D,E are stacked now. Instead of having a label for B and C itself, I would rather like to have a label for B, C together... Can I do that? Even better, I would like an additional label like a header of a header --> "Column A" "A", "Column B" "B "C", ...
Cancel
Reply

Cancel