Установка x:dataType для таблицы данных gridview

Question

У меня есть GridView

<GridView ItemsSource="{x:Bind ViewModel.SoundEffects}">
    <GridView.ItemTemplate>
        <DataTemplate x:dataType="?">
            <Button Style="{StaticResource defaultButton}"
                    Content="{Binding Name}"
                    Tag="{Binding FileName}"
                    Command="{x:Bind ViewModel.PlayCommand}"
                    CommandParameter="{Binding FileName}"/>
        </DataTemplate>
    </GridView.ItemTemplate>

Всякий раз, когда я пытаюсь скомпилировать его, он говорит, что мне нужно указать модель, но я не могу понять, как создать модель, которая содержит определение для ViewModel, когда я пытался создать интерфейс:

public interface ISoundEffectButton 
{ 
    string Name { get; } 
    string FileName { get; } 
    ViewModels.MainPageViewModel ViewModel { get; } 
}

Но это не сработало и разбил весь отладчик.

Спасибо за ваше время.

Answer 1

Внутри DataTemplate (используется ли он как шаблон элемента, шаблон содержимого или шаблон заголовка) значение Path интерпретируется не в контексте страницы, а в контексте объекта данных, который шаблонируется. Чтобы его привязки могли быть проверены (и эффективный код сгенерирован для них) во время компиляции, DataTemplate должен объявить тип своего объекта данных, используя x:DataType.

Итак, во-первых, вы должны сделать вашу модель следующим образом:

public class SoundEffectButton 
{ 
    public string Name { get; set;} 
    public string FileName { get; set;} 
    public ICommand Play { get; set; }
}

Это Class, а не интерфейс. Затем используйте его на своей странице следующим образом:

xmlns:data="using:[the namespace of your model]

x:DataType из GridView можно установить следующим образом:

<DataTemplate x:DataType="data:SoundEffectButton">

В вашей ViewModel вы можете использовать коллекцию для ваших данных:

public ObservableCollection<SoundEffectButton> SoundEffects;

Наконец, используйте вашу ViewModel в файле cs вашей страницы:

public MainPage()
{
    this.InitializeComponent();
    ViewModel = new MainPageViewModel();
}

public MainPageViewModel ViewModel { get; set; }

GridView должно быть так:

<GridView ItemsSource="{x:Bind ViewModel.SoundEffects}">
    <GridView.ItemTemplate>
        <DataTemplate x:DataType="data:SoundEffectButton">
            <Button Style="{StaticResource defaultButton}"
            Content="{Binding Name}"
            Tag="{Binding FileName}"
            Command="{x:Bind Play}"
            CommandParameter="{Binding FileName}" />
        </DataTemplate>
    </GridView.ItemTemplate>
</GridView>

Я написал демо здесь для вашей проблемы, вы можете посмотреть.