如何使用 Xamarin 表单中的滚动菜单制作许多内容页面的选项卡式页面？

Question

我想制作一个包含 7 个内容页面的标签页（以 xamarin 形式，而不是在本机项目中）。 但是红色的菜单栏（我不知道这个东西叫什么所以我叫它菜单栏）不是滚动菜单，所以每个内容页的标题都没有很好地显示出来。 像这样：

我真正拥有的东西

有人知道做这样的东西吗？

我希望它成为的东西

Answer 1

没有看到一些代码就不能说太多！ - 但我的假设是你的问题出在你的主题上......

打开你的“Tabbar.axml”并更改这行代码：

app:tabMode="fixed" 

至：

app:tabMode="scrollable"

更新：

然后只需添加新行app:tabMode="scrollable"因为默认情况下是“固定的”

无论如何，你在这里要求的是我的 Tabbar.axml ：

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.TabLayout 
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/sliding_tabs"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="?attr/colorPrimaryDark"
    android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
    app:tabIndicatorColor="@android:color/white"
    app:tabGravity="fill"
    app:tabMode="scrollable" />

Answer 2

您还可以通过创建 CustomRednerer 来更改此设置。 如果您想在您的应用程序中创建许多选项卡式页面，并且您想让其中一个带有可滚动选项卡，第二个带有不可滚动选项卡，我的解决方案是很好的。

这是 Droid 项目的代码：

using Android.Support.Design.Widget;
using App1;
using App1.Droid;
using Xamarin.Forms;
using Xamarin.Forms.Platform.Android.AppCompat;

[assembly: ExportRenderer(typeof(ScrollableTabbedPage), typeof(ScrollableTabbedPageRenderer))]
namespace App1.Droid
{
    public class ScrollableTabbedPageRenderer : TabbedPageRenderer
    {
        public override void OnViewAdded(Android.Views.View child)
        {
            base.OnViewAdded(child);
            var tabLayout = child as TabLayout;
            if (tabLayout != null)
            {
                tabLayout.TabMode = TabLayout.ModeScrollable;
            }
        }

    }
}

对于便携式项目：

using System;
using Xamarin.Forms;

namespace App1
{
    public class ScrollableTabbedPage : TabbedPage
    {
    }

    public class App : Application
    {
        public App()
        {
            var tabbedPage = new ScrollableTabbedPage();
            for (int i = 0; i < 7; i++)
            {
                tabbedPage.Children.Add(this.GetMyContentPage(i));
            }

            MainPage = new NavigationPage(tabbedPage);
        }

        private ContentPage GetMyContentPage(int i)
        {
            return new ContentPage
            {
                Title = "Tab number " + i,
                Content = new StackLayout
                {
                    Children = {
                        this.GetMyButton()
                    }
                }
            };
        }

        private Button GetMyButton()
        {
            var myButton = new Button()
            {
                Text = "Welcome to Xamarin Forms!",
            };

            myButton.Command = new Command(() =>
            {
                myButton.Text = "Start" + DateTime.Now.ToString();
            });
            return myButton;
        }
    }
}

结果你得到这个：

Answer 3

@Paweł Kanarek 您的 Droid 项目代码运行良好。 只需进行更改即可解决构建错误。

更改行：

[assembly: ExportRenderer(typeof(ScrollableTabbedPage), typeof(ScrollableTabbedPageRenderer))]

到：

[assembly: ExportRenderer(typeof(TabbedPage), typeof(App1.Droid.ScrollableTabbedPageRenderer))]

感谢您的解决方案。 它完美地帮助了我。