Работа со сложными данными

В прошлой теме мы рассмотрели работу с простой моделью Company, объекты которой хранятся в базе данных. Но у нас еще есть другая модель - Phone, которая связана с Company отношением "один-ко-многим". Рассмотрим вкратце, как мы можем работать и с этой моделью.

Для работы с моделью Phone добавим в проект новую страницу. Назовем ее PhonesListPage.xaml и установим у нее следующее содержимое:

<Page
    x:Class="SQLiteApp.PhonesListPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:SQLiteApp"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">
    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition />
        </Grid.RowDefinitions>
        <StackPanel>
            <TextBox Name="nameBox" PlaceholderText="Введите модель" Margin="10" />
            <TextBox Name="priceBox" PlaceholderText="Введите цену" Margin="10" />
            <ComboBox x:Name="companiesList" DisplayMemberPath="Name" SelectedValuePath="Id" 
					Margin="10" PlaceholderText="Выберите компанию" />
            <StackPanel Orientation="Horizontal">
                <Button Content="Добавить" Click="Add_Click" Margin="10" />
                <Button Content="Назад" Click="Back" Margin="10" />
            </StackPanel>
        </StackPanel>
        <ListView x:Name="phonesList" Grid.Row="1" Margin="10">
            <ListView.ItemTemplate>
                <DataTemplate  x:DataType="local:Phone">
                    <StackPanel>
                        <TextBlock FontSize="16" Text="{x:Bind Title}" FontWeight="Bold"  />
                        <TextBlock FontSize="16" Text="{x:Bind Company.Name}" />
                        <TextBlock FontSize="16" Text="{x:Bind Price}" />
                    </StackPanel>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>
    </Grid>
</Page>

Сначала на странице идет набор полей для добавления нового объекта Phone. И под ними располагается элемент ListView, который выводит все добавленные объекты. Для упрощения примера добавление и вывод происходят на одной и той же страницу.

Также изменим код C# у страницы, чтобы добавлять объекты Phone и выводить их в списке:

using System;
using System.Collections.Generic;
using System.Linq;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using System.Collections.ObjectModel;
using Microsoft.EntityFrameworkCore;

namespace SQLiteApp
{
    public sealed partial class PhonesListPage : Page
    {
        ObservableCollection<Phone> phones;
        List<Company> companies;
        public PhonesListPage()
        {
            this.InitializeComponent();

            this.Loaded += PhonesListPage_Loaded;
        }

        private void PhonesListPage_Loaded(object sender, RoutedEventArgs e)
        {
            using (MobileContext db = new MobileContext())
            {
                phones = new ObservableCollection<Phone>(db.Phones.Include(x => x.Company).ToList());
                companies = db.Companies.ToList();
            }

            companiesList.ItemsSource = companies;
            phonesList.ItemsSource = phones;
        }
		
		private void Back(object sender, RoutedEventArgs e)
        {
            if (Frame.CanGoBack) Frame.GoBack();
        }
		
        private void Add_Click(object sender, RoutedEventArgs e)
        {
            Company company = companiesList.SelectedItem as Company;
            if (company == null) return;

            // создаем объект Phone
            Phone phone = new Phone
            {
                Title = nameBox.Text,
                Price = Int32.Parse(priceBox.Text),
                Company = company
            };

            using(MobileContext db = new MobileContext())
            {
				db.Companies.Attach(company);
                db.Phones.Add(phone);
                if(db.SaveChanges() > 0)
				{
                    phones.Add(phone);
					// либо так
					//phonesList.ItemsSource = db.Phones.Include(x=>x.Company).ToList();				
				}
            }
        }
    }
}

При загрузке страницы мы получаем два списка - список телефонов для их отображения в ListView и список компаний для выпадающего списка ComboBox, чтобы при добавлении пользователь мог выбрать компанию.

В обработчике кнопки добавления создаем новый объект Phone по введенным в поля данным и добавляем его в базу данных. В общем-то тут добавление проходит также, как и добавление обычной модели. Только в данном случае нам надо еще установить внешний ключ на связанную модель Company с помощью свойства CompanyId.

В итоге страница будет выглядеть следующим образом:

И чтобы эту страницу можно было вызвать с главной, добавим в MainPage.xaml еще одну кнопку:

<Page.BottomAppBar>
    <CommandBar>
        <AppBarButton x:Name="phonesListButton" Label="Телефоны" Icon="PhoneBook" Click="PhonesList_Click" />
        
		<!-- остальные кнопки-->
    </CommandBar>
</Page.BottomAppBar>

И определим для этой кнопки обработчик:

private void PhonesList_Click(object sender, RoutedEventArgs e)
{
    Frame.Navigate(typeof(PhonesListPage));
}