Custom TabBarCellTemplate not working

[npagare]

Hi @stormlion227,

To provide Icon and Badge for a given TabBarCell, I provided following DataTemplate. But instead of seeing an icon and a badge text on the row 0 of the cell and the label Tab 2 on the row 1, I am seeing the output displayed as shown in the screenshot below.
Can you please help me fix this ?

You could also look my previous GitHub issue that can explain my end goal as well.

<stab:STabbedPage.TabBarCellTemplate>
    <DataTemplate>
        <Grid BackgroundColor="PaleVioletRed"
            ColumnSpacing="5">
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto"></RowDefinition>
                <RowDefinition Height="20"></RowDefinition>
            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="Auto"/>
                <ColumnDefinition Width="Auto"/>
            </Grid.ColumnDefinitions>
            <Label Text="Icon"
                Grid.Row="0" 
                Grid.Column="0"
                HorizontalOptions="EndAndExpand"
                VerticalOptions="EndAndExpand"
 	 			HorizontalTextAlignment="Center"
				VerticalTextAlignment="Center"
				/>
            <Label Text="Badge"
                Grid.Row="0" 
                Grid.Column="1"
                HorizontalOptions="StartAndExpand"
                VerticalOptions="EndAndExpand"                       
 	 			HorizontalTextAlignment="Center"
				VerticalTextAlignment="Center"
				/>
            <Label Text="{Binding Title}"
                Grid.Row="1" 
                Grid.ColumnSpan="2"
                HorizontalOptions="Center"
                VerticalOptions="Center"                       
 	 			HorizontalTextAlignment="Center"
				VerticalTextAlignment="Center"
				/>
        </Grid>
    </DataTemplate>
</stab:STabbedPage.TabBarCellTemplate>

[stormlion227]

            <Grid.RowDefinitions>
                <RowDefinition Height="Auto"></RowDefinition>
                <RowDefinition Height="20"></RowDefinition>
            </Grid.RowDefinitions>

Would you change this like this and test?

            <Grid.RowDefinitions>
                <RowDefinition Height="20"></RowDefinition>
                <RowDefinition Height="20"></RowDefinition>
            </Grid.RowDefinitions>

[npagare]

No change.

[npagare]

Hi @stormlion227 , any thoughts for the fix?

[stormlion227]

I'll fix it when I have time.

[npagare]

Hi @stormlion227, any possibility of the fix in this week?
I would appreciate that.

Thanks

[stormlion227]

I'll fix this week-end surely.

[npagare]

@stormlion227, thank you so much.
I will be more than happy to do parallel testing on my end if that will help you.

Thanks

[stormlion227]

Nobody use this package. I think only you and I use this.
Anyway, I will fix by this week.

[npagare]

It needs to be elevated in the NuGet site.
[I am not handy on Xamarin Native code; but willing to learn and contribute if you guide me with some pointers.]

It will be supper powerful and attractive, if it can offer -

1. top and bottom position on both Andorid and iOS (especially)
2. swipe functionality on iOS as well
3. Ability to render custom cell level custom view (data template) that take Icons (active / inactive state), Badge, label (upper case, custom case)
4. Scroll up functionality of the tab content page where the tab strip gets locked at the top of the screen only upto labels ( hide icons and badges) or shows all tab strip
5. ability to bind control templates to each tab Item (https://docs.microsoft.com/en-us/xamarin/xamarin-forms/app-fundamentals/templates/control-templates/) providing separation of concerns.

Thank you for your consideration and helping me and many out there.

[stormlion227]

1, 3, 5 : already done.
Documents is missing.
Because my English is very poor, I can't make document.

[npagare]

We can work together to document this renderer. So, don't worry about the English.
I will contribute needful from my end. Also keep in mind, google / bing translator will generate initial document that can be reviewed in our cycles.

3 is not working yet right? That's the bug to be addressed. Would you agree?

Another capability I would suggest is RTL (to support culture needs as well as for Apps that supports personalization) swipe. It is natural for left handed users to have (Hamburger) Menu icon on the right side of the screen and tabs to be swiped from right to left.

Thanks

[stormlion227]

Ok. After I fixed this issue, I hope you to contribute documents.

Thanks.

[npagare]

I will definitely do that and collaborate with you to put together all bindable properties, custom renderers and also update he sample test app.

Few examples of use cases where two layers of Tabbs are used in mixed modes (no badges in these though), which is where this NuGet Package will stand out along with RTL, swipe and scroll functionality.

[npagare]

Hi @stormlion227, Happy Sunday!
Just checking to see if there is any portion of the fix ready that you would like me to validate?
Thanks

[npagare]

Hi @stormlion227, will you be upgrading your XF version to 3.1 ? I would appreciate if you could also testing with XF 3.2 pre 2 as well.

Any update?

Thanks

[RicardoBelmont]

As update, your bug looks like is because you are replacing the binding context for the tabPage, looks like is needed for the correct tab functionallity (my apologies for my english e.e)