syncfusion AddNewRowControl style change when sfDataGrid contains records

[lincy joseph]

Hi,

I need to change the syncfusion:AddNewRowControl background color to LightPink highlighting the grid as required field in the page.

When there is row entered in the grid I want remove the pink highlight on the syncfuion:AddNewRowControl and change it back to default control style.

When all the rows are deleted it should again highlight in lightpink and the Text should contain text(should be in Red color) with asterix (* Click here to add a new row). So far I have this in my code(attached). Please refer the screenshot of the UI

Attachment: sfDataGrid_AddNewRowControl_c7a5e20a.rar

[Sathiyathanam Jeyakumar]

Hi lincy, 

 

We have analyzed your query, and you can change the AddNewRow Background, Foreground and AddNewRowText based on the records count by overriding the AddNewRowControl style. Please find the below code snippets. 

 

XAML 

<Window.Resources> 

    <Style  TargetType="{x:Type Syncfusion:AddNewRowControl}"> 

        <Setter Property="BorderBrush" Value="Gray" /> 

        <Setter Property="BorderThickness" Value="0" /> 

             

        <Setter Property="Template"> 

            <Setter.Value> 

                <ControlTemplate TargetType="{x:Type Syncfusion:AddNewRowControl}"> 

                    <Grid> 

                        <VisualStateManager.VisualStateGroups> 

                            <VisualStateGroup x:Name="AddNewRowStates"> 

                                <VisualState x:Name="Normal" /> 

                                <VisualState x:Name="Edit"> 

                                    <Storyboard> 

                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="PART_AddNewRowTextBorder" Storyboard.TargetProperty="(UIElement.Visibility)"> 

                                            <DiscreteObjectKeyFrame KeyTime="0"> 

                                                <DiscreteObjectKeyFrame.Value> 

                                                    <Visibility>Collapsed</Visibility> 

                                                </DiscreteObjectKeyFrame.Value> 

                                            </DiscreteObjectKeyFrame> 

                                        </ObjectAnimationUsingKeyFrames> 

                                    </Storyboard> 

                                </VisualState> 

                            </VisualStateGroup> 

                            <VisualStateGroup x:Name="BorderStates"> 

                                <VisualState x:Name="NormalRow" /> 

                                <VisualState x:Name="FooterRow"> 

                                    <Storyboard BeginTime="0"> 

                                        <ThicknessAnimationUsingKeyFrames BeginTime="0" 

                                                                        Duration="1" 

                                                                        Storyboard.TargetName="PART_AddNewRowBorder" 

                                                                        Storyboard.TargetProperty="BorderThickness"> 

                                            <EasingThicknessKeyFrame KeyTime="0" Value="0, 1, 0, 0" /> 

                                        </ThicknessAnimationUsingKeyFrames> 

                                        <ThicknessAnimationUsingKeyFrames BeginTime="0" 

                                                                        Duration="1" 

                                                                        Storyboard.TargetName="PART_AddNewRowBorder" 

                                                                        Storyboard.TargetProperty="Margin"> 

                                            <EasingThicknessKeyFrame KeyTime="0" Value="0, -1, 0, 0" /> 

                                        </ThicknessAnimationUsingKeyFrames> 

                                    </Storyboard> 

                                </VisualState> 

                            </VisualStateGroup> 

                        </VisualStateManager.VisualStateGroups> 

                        <Rectangle x:Name="PART_CurrentFocusRow" 

                                Margin="2,2,0,2" 

                                HorizontalAlignment="Right" 

                                Stroke="DarkGray" 

                                StrokeDashArray="2,2" 

                                StrokeThickness="1" 

                                Visibility="{TemplateBinding CurrentFocusRowVisibility}" /> 

                        <Border Background="{TemplateBinding RowSelectionBrush}" 

                            Clip="{TemplateBinding SelectionBorderClipRect}" 

                            Visibility="{TemplateBinding SelectionBorderVisiblity}" /> 

                        <Border x:Name="PART_AddNewRowBorder" 

                            Background="{Binding Path=DataContext.BackGround,ElementName=datagrid}" 

                            BorderBrush="{TemplateBinding BorderBrush}" 

                            BorderThickness="{TemplateBinding BorderThickness}"> 

                            <ContentPresenter /> 

                        </Border> 

                        <Border x:Name="PART_AddNewRowTextBorder" 

                            Background="{Binding Path=DataContext.BackGround,ElementName=datagrid}" 

                            BorderBrush="Transparent" 

                            BorderThickness="0,0,1,1" 

                            Clip="{TemplateBinding TextBorderClip}" 

                            IsHitTestVisible="False"> 

                            <ContentPresenter Margin="{TemplateBinding TextMargin}" 

                                            HorizontalAlignment="Left"  

                                            TextBlock.Foreground="{Binding Path=DataContext.ForeGround,ElementName=datagrid}" 

                                            VerticalAlignment="Center"  

                                            Content="{Binding Path=DataContext.AddNewRowText,ElementName=datagrid}" /> 

                        </Border> 

                    </Grid> 

                </ControlTemplate> 

            </Setter.Value> 

        </Setter> 

    </Style> 

</Window.Resources> 

 

 

You can download the sample from the below location. 

AddNewRow1167015600 

 

If the above provided information is differ from your exact requirement, kindly share more details about your requirement. This would be more helpful for us to proceed further. 

 

 

Regards, 

Sathiyathanam