Xamarin表单通过点击选项卡式页面顶部栏滚动到选项卡式页面内部的listView的顶部

Question

Current Situation

I have made a xamarin forms cross-platform app which has a tabbed Page with an infinite scroll listView. The listView is populated in increments of 10 items whenever the last item appears.

The normal behaviour

Usually when we tap the top bar of the tabbed page (the bar containing the tabbed page's Title) for the first time (if we are not viewing the tab at that moment), the app will switch to view that page. Which is fine.

When we tap the top bar for the second time (when tapping the top bar of current viewing tabbed page), nothing happens (unlike twitter, u can tap to scroll to the top )

My Problem

I want to be able to make the listView to scroll back to the top (to the first Item on the list) when the top bar is tapped (something like how twitter does in its android app) while still maintaining all the already loaded items in my listView.

Any idea on how to make that top bar react to the tap to scroll the listView back to the top?

Answer 1

You should try something like this for scrolling up

ListViewName.ScrollTo(yourobject,ScrollToPosition.Start, true);
// true means boolean for animated.

I hope this help you

Answer 2

The TabbedPage exposes a CurrentPageChanged event (or you can override OnCurrentPageChanged) that fires only when the selected tab changes, so you'll need to subscribe to that if you want to scroll when the user changes tabs. It doesn't seem like this is needed, but just in case...

Xamarin.Forms doesn't have a built-in event that fires when the already-selected tab is selected a second time. You can make that happen with custom renderers though, by subclassing Xamarin's TabbedPage renderers. I wrote it up here and have a working Xamarin.Forms solution for iOS, Android, and UWP here .

You don't mention the platforms, so assuming you want iOS and Android, the core bits are below.

iOS custom renderer

public class MainTabPageRenderer : TabbedRenderer
{
    private UIKit.UITabBarItem _prevItem;

    public override void ViewDidAppear(bool animated)
    {
        base.ViewDidAppear(animated);

        if (SelectedIndex < TabBar.Items.Length)
            _prevItem = TabBar.Items[SelectedIndex];
    }

    public override void ItemSelected(UIKit.UITabBar tabbar,
                                      UIKit.UITabBarItem item)
    {
        if (_prevItem == item && Element is MainPage)
        {
            // the same tab was selected a second time, so do something
        }
        _prevItem = item;
    }
}

Android custom renderer

public class MainTabPageRenderer : TabbedPageRenderer, TabLayout.IOnTabSelectedListener
{
    void TabLayout.IOnTabSelectedListener.OnTabReselected(TabLayout.Tab tab)
    {
        if (Element is MainPage)
        {
            // the same tab was selected a second time, so do something
        }
    }
}

Once you have captured that event, use the ListView.ScrollTo method to scroll to the top.