Xamarin表格 - 标签视图?

时间:2015-08-11 07:54:30

标签: xamarin xamarin.forms xamarin.forms.labs

我需要创建一个弹出窗口,其中会有一些标签,每个标签都包含一个列表视图。我知道有一个TabbedPage,但我需要一个“TabbedView”,所以我可以使用Xlabs PopupLayout构建我的弹出窗口。我如何在Xamarin Forms中执行此操作?

2 个答案:

答案 0 :(得分:4)

您可以自己创建自定义控件。

(想象一下你想创建3个标签)

例如,您可以看到它是一个包含2行和3列的网格。

您设置按钮的第一行将RowHeight设置为自动或您想要的大小,并将每个按钮添加到每列。

在第2行,您可以使用RowHeight为*的ContentView(以填充剩余的空间),还应将GridSpan设置为3列,以便填充网格上可用的所有宽度。

然后,当您单击一个按钮时,您只需将ContentView视图设置为您想要的特定选项卡。您还可以在更改内容之前获得动画。

希望有所帮助

答案 1 :(得分:3)

请查看TabView插件。

我在过去的项目中遇到了类似的问题,并决定从我的实现中创建一个插件。

我还包含了一个使用TabView here的示例项目,请看一下。

该插件也可在NuGet中使用。在包管理控制台中输入以下命令,以在项目中安装最新版本的插件:

PM> Install-Package Xam.Plugin.TabView

由于TabView继承自ContentView,您可以像使用Xamarin中的任何其他视图一样使用它。 这是一个例子:

var tabView = new TabViewControl(new List<TabItem>()
{
    new TabItem(
        "Tab 1",
        new Image{
            Source = ImageSource.FromUri(new Uri("https://assets-cdn.github.com/images/modules/logos_page/Octocat.png")),
            Aspect = Aspect.AspectFit,
            BackgroundColor = Color.LightBlue
        }),
    new TabItem(
        "Tab 2",
        new StackLayout()
        {
            Children =
            {
                new Label(){
                    FontSize = 18,
                    Text = "This is a label control.",
                    TextColor = Color.Green,
                }
            },
            BackgroundColor = Color.LightGray,
            Padding = 10
        }),
    new TabItem(
        "Tab 3",
        new StackLayout()
        {
            Children =
            {
                new ListView(){
                    ItemsSource = new string[] { "Item 1", "Item 2", "Item 3", "Item 4", "Item 5", "Item 6" }
                }
            },
            BackgroundColor = Color.LightSalmon,
            Padding = 10
        })
});
tabView.VerticalOptions = LayoutOptions.StartAndExpand;
this.Content = tabView;