Измените другой шаблон DetailsTemplate в MasterDetailsView при изменении выбора - PullRequest
Новая
       28

Измените другой шаблон DetailsTemplate в MasterDetailsView при изменении выбора

0 голосов
/ 27 апреля 2019

В MasterDetailView у меня есть список различных предметов. Когда элемент выбран, должен быть загружен соответствующий шаблон DetailsTemplate.

Я понятия не имею, как это сделать!

В этом примере я ожидаю взаимодействия.

Список в левой части MasterDetailView заполнен свиньями, цыплятами и золотыми рыбками.

Когда пользователь выбирает элемент «Свинья», сведения о «Свинья» должны отображаться в разделе сведений элемента управления MasterDetailView.

Когда пользователь выбирает предмет «Золотая рыбка», должны отображаться сведения о «Золотой рыбке».

и т.д.

Ответы [ 2 ]

0 голосов
/ 29 апреля 2019

Добавить в мой комментарий выше.Если вы имели в виду, что вы новичок в UWP.Вы просто хотите узнать, как начать использовать MasterDetailsView XAML Control из набора инструментов сообщества Windows.Тогда хорошим началом будет официальный документ Документация для Windows Community Toolkit .

И набор инструментов для сообщества Windows также содержит полный пример кода для каждого элемента управления.Образцы на GitHub .Для MasterDetalsView здесь здесь .

Я даже сделал простой пример кода для вашей справки в соответствии с вашим описанием. 

<controls:MasterDetailsView
      ItemsSource="{Binding animals}">
        <controls:MasterDetailsView.ItemTemplate>
            <DataTemplate>
                <TextBlock Text="{Binding DisplayName}"></TextBlock>
            </DataTemplate>
        </controls:MasterDetailsView.ItemTemplate>
        <controls:MasterDetailsView.DetailsTemplate>
            <DataTemplate>
                <StackPanel>
                    <TextBlock Text="{Binding DisplayName}"></TextBlock>
                    <TextBlock Text="{Binding Description}"></TextBlock>
                </StackPanel>
            </DataTemplate>
        </controls:MasterDetailsView.DetailsTemplate>
        <controls:MasterDetailsView.NoSelectionContentTemplate>
            <DataTemplate>
                <TextBlock Text="No Selection"></TextBlock>
            </DataTemplate>
        </controls:MasterDetailsView.NoSelectionContentTemplate>
    </controls:MasterDetailsView>

public sealed partial class MainPage : Page
{
    public ObservableCollection<Animal> animals { get; set; }

    public MainPage()
    {
        this.InitializeComponent();
        animals = new ObservableCollection<Animal>();
        animals.Add(new Animal() { DisplayName = "Pig", Description = "This is a pig" });
        animals.Add(new Animal() { DisplayName = "Dog", Description = "This is a dog" });
        this.DataContext = this;
    }
}

public class Animal
{
    public string DisplayName { get; set; }

    public string Description { get; set; }
}
0 голосов
/ 27 апреля 2019

Если элементы левого списка меню являются экземплярами IAnimal.

Просто свяжите SelectedItem со свойством SelectedAnimal в вашей модели представления.

Создайте сетку и поместите ContentControl для размещения подробного представления.в этой сетке.Свяжите его содержимое с SelectedAnimal и в ресурсах таблицы добавьте таблицу данных для каждого типа животных и сопоставьте ее с представлением, которое будет отображать детали, которые вы хотите показать для IAnimal.

Поэтому, когда вы нажимаете IAnimal вВ левом меню будет установлено свойство VM SelectedAnimal.Затем ContentControl покажет, что IAnimal использует View, определенный в DataTemplate.

Я бы использовал тот же подход, чтобы определить, как левое меню должно выглядеть для элементов IAnimal в списке меню.

...