[Bug] Nested tabview will show wrong tabviewitem content

[xiedongweo]

Description

I'm using a TabView(named as tab1) control on the MainPage. The TabView has five TabViewItem. In third TabViewItem, its content is a ContentView, and in this view, it has another one TabView(named as tab2) control.

So, the strange issue is coming.

When I set the SelectedIndex for the tab1, for example, I set the SelectedIndex to 3. Then it should show the fourth TabViewItem content. But the actual behavior is the TabStrip has locate to the correct postion(at 3 index), but the TabViewItem content will show the fifth TabViewItem content.

I've spent a long time to do troubleshoots on this issue. For the time being, I found that if the 'tab2' TabView is in front of the position that I want to set. then the issue will occur.

Steps to Reproduce

1. clone my demo to local and open it in visual studio 2019
2. deploy it to your android phone
3. click the 'device' button on the first tabviewitem

Expected Behavior

It should show device view.

Actual Behavior

The tabstrip locate to the correct position, but the tabviewitem content show the 'setting' view.

Basic Information

Sometimes this strange behavior doesn't occur, but most of the time it will be wrong. Please try it more often. You could kill the app process and start it again.

• Version with issue:
• Last known good version:
• IDE: Visual Studio 2019 Version 16.9.6
• Platform Target Frameworks:
  • iOS:
  • Android: Android 11.0 (R)
  • UWP:
• Android Support Library Version:
• Nuget Packages: 1.1.0
• Affected Devices:

Workaround

Reproduction imagery

Reproduction Link

https://github.com/xiedongweo/xamarin-samples

[jfversluis]

Thanks for the report!

There seems to be something weird with the sample code you linked. Pressing the button on the first try doesn't do anything due to the way it is setting the BindingContext only when the first tab change has happened (see here)

If I ignore that, the tab seems to change to the right one without a problem.

tabview.mov

Am I missing something here? :)

[xiedongweo]

@jfversluis As I said, please deploy it to a mobile phone. This problem seems to be difficult to reproduce in the emulator.

[xiedongweo]

@jfversluis And with my tests on my phone, the tab selection changed event will be fired when page appearing, so the bindingcontext should has been set. You do not need to switch the tab to fire the selection changed event manually. Pressing the button should work on the first try.

[ThomasAdrian]

@xiedongweo I've had a similar problem which only began to occur when I recently added another tab (making 5 in total).

I found a workaround: setting IsTabTransitionEnabled="False" on the tabview. I'm working with Android only. Worth seeing if this stops the issue for you and helps to get it resolved.

[xiedongweo]

@xiedongweo I've had a similar problem which only began to occur when I recently added another tab (making 5 in total).

I found a workaround: setting IsTabTransitionEnabled="False" on the tabview. I'm working with Android only. Worth seeing if this stops the issue for you and helps to get it resolved.

Thank you. I will try it.