Статьи

Навигация и передача данных между страницами XAML с помощью Windows Phone

Октябрь 15, 2018

До этого момента я использовал только одну страницу XAML для своих примеров. Большинство приложений имеют более одной страницы. Итак, пришло время взглянуть на то, как перемещаться по нескольким страницам XAML в приложении Silverlight Phone.

Прежде всего, страницы в приложении Silverlight загружаются аналогично HTML-странице в веб-браузере. Каждый сайт имеет свой собственный URL. Например, для перехода от этой записи в блоге к домашней странице необходим так называемый тег привязки. Приложения Silverlight очень похожи, за исключением того, что вместо тега привязки я использую элемент управления кнопкой гиперссылки, а затем я устанавливаю его свойство NavigateUri для URI страницы XAML, которую я хочу загрузить в родительский фрейм, который является самым верхним в моем приложении. Звучит достаточно просто.

URL — это унифицированный указатель ресурса, URI — унифицированный идентификатор ресурса. Оба способа поиска и размещения ресурсов. Один относится к Интернету, другой более обобщенный и может использоваться для Интернета, локально, внутри локальной сети, по телефону и так далее.

Итак, начнем. Я создал новый проект. Щелчок правой кнопкой мыши по моему проекту позволяет мне добавить новую папку, которую я называю «Представления»:

1

Затем я собираюсь добавить новую страницу в эту папку:

1a

Я собираюсь убедиться, что я выбрал Windows Phone Portrait Page в открывшемся диалоговом окне:

1б

Теперь у меня есть две страницы XAML в моем проекте:

1d     1e

Вернемся к MainPage.xaml Я собираюсь перетащить элемент управления HyperlinkButton на мою поверхность конструктора. Теперь мне нужно изменить свойство NavigateUri. Я начинаю с названия проекта, за которым следует точка с запятой, а затем компонент. У меня есть новая страница в подпапке, поэтому имя этой папки добавляется следующим:

/NavigatingBetweenPages;component/Views/Page1.xaml

Давайте запустим это:

2     2а

Когда я нажал кнопку гиперссылки, я перешел с главной страницы на страницу Page1. Все идет нормально. Теперь я хочу передать некоторую информацию между этими двумя страницами. Поэтому я собираюсь создать запрос в моем NavigateUri, я также собираюсь добавить строку запроса, которая будет вставлять некоторую дополнительную информацию в этот URI. А потом я собираюсь извлечь эту дополнительную информацию из Page1.xaml и отобразить ее на экране. В World Wide Web строка запроса — это часть URL-адреса, которая содержит данные для передачи в веб-приложения. Аналогично, в телефонном приложении строка запроса — это часть URI, которая содержит данные, которые можно передавать со страницы на страницу.

Давайте двигаться дальше в моем маленьком примере проекта. Сначала я добавляю строку запроса в свойство NavigateUri:

/NavigatingBetweenPages;component/Views/Page1.xaml?id=1

Затем я добавляю еще одну кнопку гиперссылки и устанавливаю для свойства NavigateUri значение: 

/NavigatingBetweenPages;component/Views/Page1.xaml?id=2

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

Вернемся к Page1, xaml Я собираюсь добавить текстовый блок и очистить его текстовое свойство. Затем внутри PhoneApplicationPage of Page1 я дважды щелкаю на Loaded Event в окне свойств, чтобы перейти к коду позади, чтобы добавить код:

    private void PhoneApplicationPage_Loaded(object sender, RoutedEventArgs e)
    {
        textBlock1.Text = String.Format("Value: {0}",
            NavigationContext.QueryString["id"]);
    }

 

Когда я запускаю его сейчас, я получаю это:

3a    3b    3в

Я просто хотел отобразить значение, которое я определил в свойстве NavigateUri раньше. Кажется, работает.

Этот пример пока не делает ничего действительно захватывающего, но я мог бы использовать ту же технику, чтобы сделать несколько интересных вещей. Например, если я хотел создать приложение погоды и хотел, чтобы пользователь мог выбрать город и почтовый индекс. Я мог бы передать эти значения со страницы XAML, где пользователь фактически выбирает город и почтовый индекс, а затем на второй странице XAML я мог бы использовать какой-либо веб-сервис через WiFi или телефонную сеть, а затем на третьей странице получить эти значения и отображать их пользователю.

Есть только одна проблема с кодом, который я писал до сих пор: если нет строки запроса с именем «id», переданной с предыдущей страницы, тогда мое приложение будет взорвано. Это собирается бросить исключение и потерпеть крах. Итак, мне нужно решить эту проблему.

А также, мне интересно, как насчет отправки и получения двух или более пар именованных значений строки запроса? Как я могу сделать это в моем коде? Ну, это та же самая основная идея. Мне просто нужно разделить именованные пары значений на кнопках гиперссылки моего MainPage.xaml.

Итак, я собираюсь добавить третью кнопку гиперссылки на мою поверхность конструктора, и я собираюсь установить свойство NavigateUri в:

/NavigatingBetweenPages;component/Views/Page1.xaml?id=3&state=tx

Затем я собираюсь добавить второй текстовый блок на поверхность конструктора моего Page1.xaml и очистить его свойство Text. Затем  я перехожу к своему Page1.xaml.cs и добавляю следующий код в Loaded Event:

    string id = "";
     
    if (NavigationContext.QueryString.TryGetValue("id", out id))
    {
        textBlock1.Text = String.Format("Value: {0}", id);
    }
     
    string state = "";
     
    if (NavigationContext.QueryString.TryGetValue("state", out state))
    {
        textBlock2.Text = String.Format("State {0}", state);
    }

 

Добавив этот код, я исправил обе мои проблемы.

Более ранние решения предоставили мне возможность, что не определен идентификатор, который вызвал бы сбой приложения. Теперь, используя метод TryGetValue, он просто пытается извлечь значение id и выбросить его. Если он не может найти это значение, он пропустит этот блок кода и пропустит его. То же самое относится и ко второй части кода. Он попытается получить состояние в качестве выходного параметра. Если он может получить «состояние», он выполнит второй блок кода.

Другими словами, если я запускаю этот код и нажимаю первую кнопку гиперссылки, он должен показывать только значение в текстовом блоке 1, а если я щелкаю третий, он должен показывать оба значения в обоих текстовых блоках. Посмотрим, правда ли это:

3b     3d

Кажется, работает как положено.

 

 

Продолжение следует…

Источник: http://andreahaubner.blog.com/2011/03/19/navigating-and-passing-data-between-xaml-pages/

38
Share: