Round Button or Image on SfTabView

[ronak]

I am trying to get a Circular Icon of my Application Logo right in middle of sftab bar menu's, I have 5 Tab Menu's where the third one i want it to look like this

trying to get this on Android & Ios

i have tried custom rendering by removing the padding but still not able to get the desired result, i found one solution updating icon using SetTabIcons Method but this method does not get trigger when we are working with bottom tabbed bar in Android, please suggest me something which can help me to get this for both android & Ios,

could u please help me with it ?

[Dhanasekar R]

Hi Ronak, 

  

Greetings from Syncfusion. 

  

Query: “Round Button or Image on SfTabView” 

  

We have validated your query and your requirement can achieved by using a CenterButtonView property. By using a CenterButtonView property you can add the image and customize the size and color in the CenterButtonSettings. We have prepared a sample based on your provided image. Please have the sample from the following link 

 

Code snippet: 

      <tabView:SfTabView> 

            <tabView:SfTabView.CenterButtonSettings> 

                <tabView:CenterButtonSettings Height="60" Width="60"/> 

            </tabView:SfTabView.CenterButtonSettings> 

            <tabView:SfTabView.CenterButtonView> 

                <Image Source="Compose.png" 

                    Aspect="AspectFill" 

                    VerticalOptions="CenterAndExpand" 

                    HorizontalOptions="CenterAndExpand"> 

                    <Image.GestureRecognizers> 

                        <TapGestureRecognizer 

                        Tapped="CenterButton_Tapped" /> 

                    </Image.GestureRecognizers> 

                </Image> 

            </tabView:SfTabView.CenterButtonView> 

            <tabView:SfTabItem > 

                <tabView:SfTabItem.Content> 

                    <Grid/> 

                </tabView:SfTabItem.Content> 

            </tabView:SfTabItem> 

        </tabView:SfTabView> 

 

  

Sample: http://www.syncfusion.com/downloads/support/forum/141647/ze/TabView-1008796705 

  

Please have the KB link for showcasing the CenterButton in SfTabView as reference
https://www.syncfusion.com/kb/9594/showcasing-the-centerbutton-in-sftabview  

  

Regards, 

Dhanasekar