如何使用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))]

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