在 android 上的 tabclick FreshTabbedNavigationContainer 上弹出到 root
Pop to root on tabclick FreshTabbedNavigationContainer on android
考虑一个带有“主页”和“个人资料”按钮的标签栏,当我单击其中一个时,我会在两个页面之间切换,在“主页”页面上,用户可以在导航堆栈中向上导航多次,但仍将焦点放在“主页”选项卡表明这是用户的来源。
现在,在 iOS 上,每当用户从导航堆栈的高处点击“主页”时,用户就会跳转到 root 并且一切正常,但是 android 上情况并非如此, 在 android 上,用户必须通过单击后退按钮一次弹出一页才能到达根目录。
这是预期的行为吗?我做错了什么吗?有人知道我可以做些什么来获得所需的行为吗?
这是 iOS 和 Android 之间的预期行为。
如果你需要让Android和iOS效果一样,你需要自定义TabbedPageRenderer to achieve that. And the bottom tab bar effect can custom a FreshTabbedNavigationContainer . Last, we will use MessagingCenter发送消息到要弹出到根页面的表单。
例如,CustomFreshTabbedNavigationContainer class:
public class CustomFreshTabbedNavigationContainer : FreshTabbedNavigationContainer
{
public CustomFreshTabbedNavigationContainer()
{
On<Android>().SetToolbarPlacement(ToolbarPlacement.Bottom);
MessagingCenter.Subscribe<object>(this, "Hi", (sender) =>
{
// Do something whenever the "Hi" message is received
PopToRoot(true);
});
}
}
用于App.xaml.cs:
public App()
{
InitializeComponent();
var container = new CustomFreshTabbedNavigationContainer();
container.AddTab<FirstPageModel>("Home", default);
container.AddTab<ProfilePageModel>("Profile", default);
MainPage = container;
}
现在我们将在 Android:
中创建一个 CustomTabbedPageRenderer
public class CustomTabbedPageRenderer : TabbedPageRenderer, BottomNavigationView.IOnNavigationItemSelectedListener
{
public CustomTabbedPageRenderer(Context context) : base(context)
{
}
int previousItemId = 0;
bool BottomNavigationView.IOnNavigationItemSelectedListener.OnNavigationItemSelected(IMenuItem item)
{
base.OnNavigationItemSelected(item);
if (item.IsChecked)
{
if (previousItemId != item.ItemId)
{
previousItemId = item.ItemId;
}
else
{
Console.WriteLine("ok");
MessagingCenter.Send<object>(this, "Hi");
}
}
return true;
}
}
效果:
注意:如果需要和Android中的top Tabbar一样的效果,CustomTabbedPageRenderer
中有不同的代码。你可以看看这个discussion.
考虑一个带有“主页”和“个人资料”按钮的标签栏,当我单击其中一个时,我会在两个页面之间切换,在“主页”页面上,用户可以在导航堆栈中向上导航多次,但仍将焦点放在“主页”选项卡表明这是用户的来源。
现在,在 iOS 上,每当用户从导航堆栈的高处点击“主页”时,用户就会跳转到 root 并且一切正常,但是 android 上情况并非如此, 在 android 上,用户必须通过单击后退按钮一次弹出一页才能到达根目录。
这是预期的行为吗?我做错了什么吗?有人知道我可以做些什么来获得所需的行为吗?
这是 iOS 和 Android 之间的预期行为。
如果你需要让Android和iOS效果一样,你需要自定义TabbedPageRenderer to achieve that. And the bottom tab bar effect can custom a FreshTabbedNavigationContainer . Last, we will use MessagingCenter发送消息到要弹出到根页面的表单。
例如,CustomFreshTabbedNavigationContainer class:
public class CustomFreshTabbedNavigationContainer : FreshTabbedNavigationContainer
{
public CustomFreshTabbedNavigationContainer()
{
On<Android>().SetToolbarPlacement(ToolbarPlacement.Bottom);
MessagingCenter.Subscribe<object>(this, "Hi", (sender) =>
{
// Do something whenever the "Hi" message is received
PopToRoot(true);
});
}
}
用于App.xaml.cs:
public App()
{
InitializeComponent();
var container = new CustomFreshTabbedNavigationContainer();
container.AddTab<FirstPageModel>("Home", default);
container.AddTab<ProfilePageModel>("Profile", default);
MainPage = container;
}
现在我们将在 Android:
中创建一个 CustomTabbedPageRendererpublic class CustomTabbedPageRenderer : TabbedPageRenderer, BottomNavigationView.IOnNavigationItemSelectedListener
{
public CustomTabbedPageRenderer(Context context) : base(context)
{
}
int previousItemId = 0;
bool BottomNavigationView.IOnNavigationItemSelectedListener.OnNavigationItemSelected(IMenuItem item)
{
base.OnNavigationItemSelected(item);
if (item.IsChecked)
{
if (previousItemId != item.ItemId)
{
previousItemId = item.ItemId;
}
else
{
Console.WriteLine("ok");
MessagingCenter.Send<object>(this, "Hi");
}
}
return true;
}
}
效果:
注意:如果需要和Android中的top Tabbar一样的效果,CustomTabbedPageRenderer
中有不同的代码。你可以看看这个discussion.