tabs - Xamarin.Android 的底部选项卡(在 Xamarin.forms 应用程序中)

标签 tabs xamarin.android xamarin.forms

我正在使用 Xamarin.forms 制作应用程序。

您都知道 Xamarin.forms 的 TabbedPage 的 Android 常规选项卡位于顶部。
因为如果它是尊重 Android UX 的原生 Android 应用程序,它应该在那里。

但现在情况发生了变化。
甚至谷歌也宣布了新的底部标签栏,称为“底部导航”。
https://github.com/roughike/BottomBar
许多主要应用程序都在使用底部标签栏。

但我不能使用新的底部导航。
因为我的应用程序基于 Xamarin.forms 并使用表单中的 TabbedPage。
如果我尝试使用底部导航,它会变得更加复杂。

(我也在用表单制作 iOS 应用程序)

所以最好的方法是将原生标签移动到底部。

所以我找到了这个。 (也许老了)
http://envyandroid.com/align-tabhost-at-bottom/

但不知道如何在 Xamarin.Android 中使用。
你可以帮帮我吗?

最佳答案

遇到了同样的问题,尝试从 GitHub 上的代码创建一个自定义的 TabbedPageRenderer,但由于几个类和接口(interface)的范围为内部,所以没有运气。找到了一个解决方案,虽然是一个hacky,但在我们的案例中似乎工作正常。

只需创建一个继承自 TabbedPage 的新 BottomTabbedPage,这样您就可以链接一个新的 Renderer for Android,然后创建一个新的 Renderer,如下所示:

[assembly: ExportRenderer(typeof(BottomTabbedPage), typeof(BottomTabbedPageRenderer))]
namespace My.XForms.Droid.Renderers
{
    public class BottomTabbedPageRenderer : TabbedPageRenderer
    {
        protected override void OnLayout(bool changed, int l, int t, int r, int b)
        {
            InvertLayoutThroughScale();

            base.OnLayout(changed, l, t, r, b);
        }

        private void InvertLayoutThroughScale()
        {
            ViewGroup.ScaleY = -1;

            TabLayout tabLayout = null;
            ViewPager viewPager = null;

            for (int i = 0; i < ChildCount; ++i)
            {
                Android.Views.View view = (Android.Views.View)GetChildAt(i);
                if (view is TabLayout) tabLayout = (TabLayout)view;
                else if (view is ViewPager) viewPager = (ViewPager)view;
            }

            tabLayout.ScaleY = viewPager.ScaleY = -1;
            viewPager.SetPadding(0, -tabLayout.MeasuredHeight, 0, 0);
        }
    }
}

仅缩放页面布局然后再次缩放子级并不能解决问题,因为原始的 TabbedPageRenderer 将 ViewPager 填充为不与 TabLayout 重叠,因此您包含的页面会出现一个起始间隙,因此插入负填充修复该问题。

不是一个理想的解决方案,只是工作,但至少你没有运行完整的 TabbedPage 实现。

关于tabs - Xamarin.Android 的底部选项卡(在 Xamarin.forms 应用程序中),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38446426/

相关文章:

r - 如何在 Shiny 应用程序中访问/打印/跟踪当前选项卡选择?

xamarin - 在 Xamarin Android 中存档时出现错误

xamarin - 如何为Xamarin native iOS和Android应用程序的新页面添加ViewModel

navigation - 从导航堆栈中删除页面 - xamarin.forms

c# - Xamarin Form 在空字符串的搜索栏中触发搜索命令

html - 更改链接到 radio 的选定 CSS 选项卡的背景图像

angular - 激活星云主题选项卡

php - 删除单个产品选项卡并在 Woocommerce 中添加相关内容

android - 使用 MAJOR.MINOR.PATCH 转换为 Android Manifest 中版本代码的整数

android - 如何在 Xamarin Forms 中设置页面图标?