badgeview on sfbutton shows behind button when binding BadgeIcon.

[David Brenchley]

I want a badge icon to popup on button when selected, so I bind the badgeicon.

This works "almost".  The problem is, the badge shows up behind the button and you can only see part of it.

<badge:SfBadgeView  x:DataType="cos:EmailAddress" HorizontalOptions="Center" VerticalOptions="Center" Margin="3">

                                                                            <badge:SfBadgeView.BadgeSettings>

                                                                                <badge:BadgeSetting BadgeType="Success"   Offset="0, -10" 

                                                                                                    BadgePosition="BottomRight" 

                                                                                                    BadgeIcon="{Binding IsPrimary, Converter={StaticResource badgeIconConverter}}">

                                                                                </badge:BadgeSetting>

                                                                            </badge:SfBadgeView.BadgeSettings>

                                                                            <badge:SfBadgeView.Content>

                                                                                    <Frame CornerRadius="30"  Padding="3" BackgroundColor="White">

                                                                                          ...

                                                                                     </Frame>

                                                                            </badge:SfBadgeView.Content>

                                                                        </badge:SfBadgeView>

[Ramya Soundar Rajan]

Hi David, 

 

Thanks for contacting Syncfusion support. 

 

We can resolve the problem by adding the badge view content inside the grid layout as like in below code. 

 

    <badge:SfBadgeView  x:DataType="cos:EmailAddress" HorizontalOptions="Center" VerticalOptions="Center" Margin="3"> 

        <badge:SfBadgeView.BadgeSettings> 

            <badge:BadgeSetting BadgeType="Success"   Offset="0, -10"  

             BadgePosition="BottomRight"  

           BadgeIcon="Available"> 

            </badge:BadgeSetting> 

        </badge:SfBadgeView.BadgeSettings> 

        <badge:SfBadgeView.Content> 

            <Grid> 

            <Frame CornerRadius="30" WidthRequest="50" HeightRequest="50"  Padding="3" BackgroundColor="White"> 

                

            </Frame> 

            </Grid> 

        </badge:SfBadgeView.Content> 

    </badge:SfBadgeView> 

 

Sample Link: https://www.syncfusion.com/downloads/support/forum/151004/ze/BadgeView-Demo-174239513 

 

Please let us know if you have any concerns. 

 

Regards, 

Ramya. 

[David Brenchley]

Thank you, this has fixed the issue

[Ramya Soundar Rajan]

Hi David, 

 

Thanks for the update. Please let us know if you need any further assistance. 

 

Regards, 

Ramya