如何使用 Xamarin.Forms xaml 编辑器预览 ListView答案

【问题标题】：How to preview a ListView using Xamarin.Forms xaml editor如何使用 Xamarin.Forms xaml 编辑器预览 ListView
【发布时间】：2018-04-22 04:54:37
【问题描述】：

我正在使用自定义单元格在 Xamarin.Forms 中实现 ListView，但我看不到我在做什么，因为预览显示了一个空列表，并且每次重新构建都很简单，太耗时了。我什至看不到一个简单的 TextCell..

如何在编辑器中查看我的单元格的预览？这是我的 xaml：

<?xml version="1.0" encoding="utf-8"?>
<ContentPage
    xmlns="http://xamarin.com/schemas/2014/forms"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:local="clr-namespace:MyNamespace"
    x:Class="MyNamespace.MyAppPage">
<ContentPage.Content>

    <ListView x:Name="myList">
        <ListView.ItemTemplate>
            <DataTemplate>
                <TextCell Text="Preview?" />
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>

</ContentPage.Content>

注意：我使用的是 Visual Studio 2017 for Mac。

第二部分

好的，所以我尝试使用 BindingContext，但我不太了解此属性的用法。这是我更新的 XAML：

<?xml version="1.0" encoding="utf-8"?>
<ContentPage
    xmlns="http://xamarin.com/schemas/2014/forms"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:local="clr-namespace:MyNamespace;assembly:MyNamespace"
    BindingContext="{x:Static local:MusicSeed.Model}"
    x:Class="MyNamespace.MyAppPage">

    <ContentPage.Content>

        <ListView ItemsSource="{Binding Tracks}">
            <ListView.ItemTemplate>
                <DataTemplate>
                    <TextCell Text="{Binding Name}" />
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>

    </ContentPage.Content>

</ContentPage>

这是我拥有数据的地方，MusicSeed.cs：

namespace MyNamespace
{
    public static class MusicSeed
    {
        public static readonly MusicSeedModel Model = new MusicSeedModel();  
    }

    public class MusicSeedModel
    {
        public readonly MusicTrack[] Tracks =
        {
            new MusicTrack("Track 01"),
            new MusicTrack("Track 02"),
            new MusicTrack("Track 03"),
            new MusicTrack("Track 04"),
        }; 
    }
}

结果是 XAML 编辑器抛出此错误：

没有找到 local:MusicSeed.Model 的静态成员

我尝试将Tracks 更改为静态，但没有任何改变。还重建了解决方案，错误消失了，但预览仍然是空的。我在这里错过了什么？

【问题讨论】：

标签： xaml xamarin xamarin.forms visual-studio-2017

【解决方案1】：

您必须提供某种BindingContext 才能在设计时呈现行。 James Montemagno 的 awesome article 解释了如何做到这一点。

另一篇推荐的文章是this one on Xamarin Help

编辑 1：

您的 XAML 是正确的，但视图模型是错误的。您只能绑定到属性。尝试将您的声明更改为以下内容：

namespace MyNamespace
{
    public class MusicSeed
    {
        public static MusicSeedModel Model { get; } = new MusicSeedModel();
    }

    public class MusicSeedModel
    {
        public MusicTrack[] Tracks { get; } =
            {
                new MusicTrack("Track 01"),
                new MusicTrack("Track 02"),
                new MusicTrack("Track 03"),
                new MusicTrack("Track 04"),
            };
    }

    public class MusicTrack
    {
        public string Name { get; }

        public MusicTrack(string v)
        {
            this.Name = v;
        }
    }
}

【讨论】：

这篇文章似乎是针对 Xamarin Studio 的，但问题是关于 Visual Studio。这也适用于 VS 吗？
根据这个XamarinHelp article确实如此。
@dennis-schröer : 另外，Visual Studio for Mac 只是Xamarin Studio 的更新版本
@G.Sharada 我添加了您的建议，但它仍然无法正常工作，很可能我遗漏了一些东西。如果您想看一下，我编辑了问题。
谢谢！使用您的解决方案后的重要一步是再次全部重建！

【解决方案2】：

你不能。如果你使用的是 MVVM 框架，你的代码仍然需要生成/构建。

另一种方法是使用Xamarin Live Player，它可以在您的实际设备上为 android 和 ios 构建列表

仅供参考：目前在回答这个问题时，它处于 Alpha 阶段

【讨论】：