androidOffscreenTabLimit is not working when the position is set to bottom

Hi. I see some issues with tab component in nativescript-angular. For managing loading and unloading views in tab items , androidOffscreenTabLimit is a good choice. I can scroll in first tab in a list view, go through the other tabs, come back to first tab, and I can see scroll position again (When tab is in top).

But when tab bar is in the bottom, no matter what the value of androidOffscreenTabLimit is, you can't see scroll position. Here we have had some discussion about it in tab template repository.

Any idea?

I found out that it doesn't work with ListView. It works fine with ScrollView.

@vahidvdn

Hi @vahidvdn,
I reviewed your case and found that setting up the tab bar at the bottom for Android will disable the preloaded functionality by design. You can check our documentation, this has been mentioned at the beginning.

@tsonevn

Hi @tsonevn , thanks for the answer. I tested in multiple devices and found out something strange. It keeps scroll position based on different android versions. See these videos:

Huawei P9 (Android 6 with new update of Huawei gui) VS Huawei Honor6 (Android 4.4.2)
--------------

Logically, it must keep the history of scroll position. As well as all real world apps.

@vahidvdn

Hi @vahidvdn,
I tested this behaviour on my side on Android API level 22, 23 and 25, however on all of them the ListView position's state was saved and reset correctly. For your convenience, I am attaching a sample project. Can you review it and check if I am missing something.
Archive.zip

@tsonevn

@tsonevn I tested your code, and it works fine in both devices. However I'm still wondering why the default template doesn't work fine in second device (or maybe in many devices). Would you please test it? (I attached the files or it's the same as you install from sidekick application)
tnsTabBar.zip

And one question. Does iOS keep the scroll position as well?

@tsonevn

@tsonevn Also there is a difference between your example and the one is in sidekick. In the default app which is available in sidekick, when going through the tabs, it pushes the page. (see second video)

NOTE: Also, in default template, when you go through the tabs very fast, app get crashed. But in your example, it doesn't.

@vahidvdn

Hi @vahidvdn,
Thank you for the attached sample project. I reviewed it and found that the difference between both projects is that in tnsTabBar one, new page-router-outlet is created for every Tab in the TabView component. This will create new Frame for each tab, which seems to be related to the case with the ListView position reset on Android devices and simulators with lower API levels (e.g. 23, 22). We spent some time researching the case, and for now, it seems that this is something related to the OS and we can not control it.

I can suggest removing the inner page-router outlets in the app.component.html and to define the Tabs as follow:

<TabView selectedIndex="1" selectedColor="#FF0000" androidTabsPosition="bottom">
    <StackLayout *tabItem="{title: 'Home', iconSource: getIconSource('home')}" >
        <GridLayout rows="" columns="">
                <home></home>
        </GridLayout>
       
    </StackLayout>
    <StackLayout *tabItem="{title: 'Browse', iconSource: getIconSource('browse')}">
        <GridLayout rows="" columns="">
                <browse></browse>
        </GridLayout>
        
    </StackLayout>
    <StackLayout *tabItem="{title: 'Search', iconSource: getIconSource('search')}">
        <GridLayout rows="" columns="">
                <search></search>
        </GridLayout>
    </StackLayout>
</TabView>

@tsonevn

Thanks @tsonevn
I understand. Although it has lots of benefit when we separate the templates specially in big projects. but as you mentioned it related to the OS and we can not control it. Btw, thanks for the support.

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.

Navigation Menu

Repository navigation

androidOffscreenTabLimit is not working when the position is set to bottom #5987

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

androidOffscreenTabLimit is not working when the position is set to bottom #5987

Description

Activity

vahidvdn commented on Jun 24, 2018

tsonevn commented on Jun 25, 2018

vahidvdn commented on Jun 25, 2018

tsonevn commented on Jun 25, 2018

vahidvdn commented on Jun 25, 2018

vahidvdn commented on Jun 25, 2018

tsonevn commented on Jun 26, 2018

vahidvdn commented on Jun 26, 2018

lock commented on Aug 26, 2019

Metadata

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Issue actions