We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

GroupDropArea

Hi.

How can I do GroupDropArea smaller, please?

Thanks.
Regards,
Juraj

5 Replies

SC Saravanan C Syncfusion Team May 20, 2014 03:39 AM UTC

Hi Suraj,

 

Thank you for contacting Syncfusion Support,

 

We have analyzed your requirement “to make GroupDropArea smaller” and you can achieve your requirement by apply style to GroupDropArea. And you can achieve minimized GroupDropArea by setting  IsGroupDropArea=”False”. Please refer the following code snippet:

 

Code Snippet[XAML]:

<Window.Resources>

    <Style TargetType="syncfusion:GroupDropArea">

        <Setter Property="Height" Value="80"></Setter>

    </Style>

</Window.Resources>

 

<Syncfusion:SfDataGrid x:Name=”dataGrid”

                               ItemsSource=”{Binding Path=OrdersDetails}”

                               AllowDraggingColumns=”True”

                               ShowGroupDropArea=”True”

                               AllowGrouping=”True”

                               GroupDropAreaText=”Hai”

                               IsGroupDropAreaExpanded=”False”

                               AutoExpandGroups=”True”

                               ColumnSizer=”Star”>

 

We have prepared a sample based on your requirement please find the sample in the attachments.

 

Please let us know if  this solution helps you.

 

Regards,

Saravanan C


Attachment: ColumnHeaderDraggingTextBox_b852d759.zip


JT Juraj Tomana May 20, 2014 06:17 AM UTC

Hi.

Thanks, but of course I know, that GroupDropArea can be expanded. But I want to set style of this area to make it thiner in expanded state.

See attached screenshot...

Regards,
Juraj

Attachment: 116317_dec70278.zip


SC Saravanan C Syncfusion Team May 23, 2014 08:34 AM UTC

Hi Juraj,

 

We have analyzed your query to thinner GroupDropArea and it can be achieved by applying style to GroupDropArea. By adjusting the property Opacity=”0.5” you can achieve your requirement. And also you can adjust the height for GroupDropArea by setting the property MinHeight=”0” and MaxHeight=”80”. Please find the code snippet in below:

 

Code Snippet[XAML]:   

<Style TargetType=”yncfusion:GroupDropArea”>

            <Setter Property=”MinHeight” Value=”0”/>

            <Setter Property=”MaxHeight” Value=”80”/>

            <Setter Property=”BorderThickness” Value=”1,1,1,0”/>

            <Setter Property=”Opacity” Value=”0.3”/>

            <Setter Property=”Background” Value=”LightBlue”/>

            <Setter Property=”Foreground” Value=”Gray”/>

</Style>

 

We have prepared a sample based on your requirement. Please find the sample in the attachments.

 

Please let us know if  this solution helps you.

 

Thanks,

Saravanan C

 


Attachment: GroupDropArea_557e5caa.zip


JT Juraj Tomana May 23, 2014 12:44 PM UTC

Hi.

See attached screenshot..

I really want to reduce the space below 'PART_GroupDropAreaBorder'. (Or maybe it would be even better, it this PART_GroupDropAreaBorder doesn't fixed height (==28), but Height=NaN;

Thanks.
Regards,
Juraj

Attachment: gdascr_c167487e.zip


SC Saravanan C Syncfusion Team May 27, 2014 01:22 PM UTC

Hi Juraj,

 

We have analyzed your requirement “to reduce the unused space in below PART_GroupDropAreaBorder when expanded state” and you can achieve your requirement by editing the GroupDropArea control template. Please find the code snippet in below:

 

Code Snippet[XAML]:

<VisualState x:Name=”Expanded”>

    <Storyboard>

        <ObjectAnimationUsingKeyFrames Storyboard.TargetName=”PART_GroupDropAreaBorder” Storyboard.TargetProperty=”(FrameworkElement.Margin)”>

            <DiscreteObjectKeyFrame KeyTime=”0:0:0”>

                <DiscreteObjectKeyFrame.Value>

                   <Thickness>0,0,0,0</Thickness>

                </DiscreteObjectKeyFrame.Value>

            </DiscreteObjectKeyFrame>

        </ObjectAnimationUsingKeyFrames>

        <DoubleAnimationUsingKeyFrames Storyboard.TargetName=”PART_GroupDropAreaBorder” Storyboard.TargetProperty=”(FrameworkElement.Height)”>

            <EasingDoubleKeyFrame KeyTime=”0:0:0.2” Value=”28”>

                <EasingDoubleKeyFrame.EasingFunction>

                    <CircleEase />

                </EasingDoubleKeyFrame.EasingFunction>

            </EasingDoubleKeyFrame>

        </DoubleAnimationUsingKeyFrames>

    </Storyboard>

</VisualState>

 

Please find the attached sample based on your requirement.

 

Please let us know the provided solution helps you.

 

Thanks,

Saravanan C


Attachment: PART_GroupDropArea_446d2b80.zip

Loader.
Live Chat Icon For mobile
Up arrow icon