SfDatagrid filter pop up checkbox cropped

[Brice Yoan Chaton]

Hello, 

 

With the syncfusion library for windows store app, i have the first checkbox after the "Select All" checkbox that is cropped as shown below:

 

Please see the attachement 

 

Is there a way to manipulate the style to fix this issue? Thank you for your response

[Brice Yoan Chaton]

Hello, 

 

With the syncfusion library for windows store app, i have the first checkbox after the "Select All" checkbox that is cropped as shown below:

 

Please see the attachement 

 

Is there a way to manipulate the style to fix this issue? Thank you for your response

Attachement uploaded

Attachment: filter_image_91372254.zip

[Susmitha Sundar]

Hi Brice,   

   

Thank you for using Syncfusion controls.   

   

We have checked the reported issue and we are unable to replicate the issue from our end. We have checked with FilterPopUI, checkbox does not overlap, and it is working fine in our end.   

Please refer the below screenshot.  

   

    

   

We have prepared a sample for your reference.     

     

Sample link:   https://www.syncfusion.com/downloads/support/forum/147880/ze/DataGrid_UWP_FilterPopUp-1656276548   

We have tested with Syncfusion version 17.2.0.46.     

     

Please check the above sample. if you still facing the same issue, please modify the sample based on your scenario and revert us to back with following details.  

·       Machine configuration details   

·       Syncfusion updated version   

·       Did you apply any styles for FilterPopUp?   

   

 It will be helpful for us to analyze on it and provide you with the solution at the earliest.       

     

Regards,     

Susmitha S     

[Brice Yoan Chaton]

Hello,

Thank you for your response.

Actually we didnt apply any styling to this but we would like to.

Actually if you see in your screenshot provided, there is no overlapping between "Select All' and "ALFKI" and we would like to achieve the same, in the screenshot i provided you.

Is there a possibility to get access to the 'Select All' value/property so that we can resize or manipulation the padding/marging properties?

Thanking you in advance,

Kind Regards,

Brice Yoan Chaton

[Susmitha Sundar]

Hi Brice, 

 

Thanks for your update. 

 

You can customize the padding and margin for CheckBoxFilter UI by overriding the FilterPopUpStyle. Please refer the below code snippet. 

Xaml: 

<<<<<<<<<<<ß--------------------------------- 

 

<Border Grid.Row="1" 

                                            Margin="6,0,20,2" 

                                            Padding="0,0,0,0" 

                                            VerticalAlignment="Top" 

                                            Background="{TemplateBinding Background}" 

                                            Visibility="{Binding ItemsSource, 

                                                                     ElementName=PART_ItemsControl, 

                                                                     ConverterParameter=ItemsControl, 

                                                                     Converter={StaticResource ResourceKey=listItemsVisiblityConverter}}"> 

                                            <CheckBox x:Name="PART_CheckBox" 

                                                      HorizontalAlignment="Stretch" 

                                                      VerticalAlignment="Center" 

                                                      Content="{Binding SelectAll, 

                                                                        Source={StaticResource resourceString}}" 

                                                      FontFamily="{TemplateBinding FontFamily}" 

                                                      FontSize="{TemplateBinding FontSize}" 

                                                      FontStretch="{TemplateBinding FontWeight}" 

                                                      FontStyle="{TemplateBinding FontStyle}" 

                                                      FontWeight="{TemplateBinding FontWeight}" 

                                                      Foreground="{TemplateBinding Foreground}" 

                                                      IsTabStop="False" 

                                                      IsThreeState="True" 

                                                      Style="{StaticResource ckbStyle}" 

                                                      Visibility="{Binding Visibility, 

                                                                           ElementName=PART_ItemsControl}" /> 

                                        </Border> 

                                    </Grid> 

                                </Grid> 

                            </Border> 

-----------------------------------------------------------à>>>>> 

 

<syncfusion:SfDataGrid x:Name="dataGrid" 

                               AllowEditing="True" 

                               AllowFiltering="True" 

                               FilterPopupStyle="{StaticResource GridFilterControlStyle}" 

                               AutoGenerateColumns="False" 

                               ItemsSource="{Binding Orders}" > 

            <syncfusion:SfDataGrid.Columns> 

                <syncfusion:GridNumericColumn MappingName="OrderID"/> 

                <syncfusion:GridTextColumn MappingName="CustomerName"/> 

                <syncfusion:GridTextColumn MappingName="CustomerID"/> 

                <syncfusion:GridTextColumn MappingName="Country"/> 

                <syncfusion:GridTextColumn MappingName="ShipCity"/> 

            </syncfusion:SfDataGrid.Columns> 

        </syncfusion:SfDataGrid> 

 

You can customize above highlighted margin and padding based on your requirement.  

 

Sample link: https://www.syncfusion.com/downloads/support/forum/147880/ze/DataGrid_UWP_FilterPopUp_Customization1607602895 

 

Please let us know, if you need further assistance. 

 

Regards, 

Susmitha S