Статьи

EvenTiles от начала до конца — часть 4

Январь 9, 2019

В третьей части этой серии статей о том, как разработать приложение для Windows Phone с нуля, мы рассмотрели набор инструментов Silverlight для Windows Phone и переходы по страницам. Сегодня мы будем работать с некоторыми функциями на странице настроек нашего приложения. Мы начнем с того, что закончили в третьей части, и начнем с пустой страницы настроек (за исключением названия приложения и заголовка страницы).

Цель нашего полного примера приложения — создать вторичную плитку программным способом и прикрепить ее к стартовому экрану пользователя. Вторичная плитка имеет переднюю и заднюю части. Текст на обратной стороне плитки может быть изменен конечным пользователем. EvenTiles не предназначен для того, чтобы быть чрезвычайно полезным, он призван помочь представить множество аспектов программирования для разработки приложений для Windows Phone.

В этом эпизоде ​​мы добавим несколько элементов пользовательского интерфейса на страницу настроек, чтобы реализовать следующие функциональные возможности:

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

Страница настроек имеет следующий макет:

Макет пользовательского интерфейса относительно прост. В ContentPanel PhoneApplicationPage у нас есть StackPanel, содержащая 3 различных элемента ( TextBlock , TextBox плюс скрытая кнопка) и ToggleSwitch (это определено в наборе инструментов Silverlight для Windows Phone). ToggleSwitch уже виден, но в настоящее время не имеет каких-либо связанных с ним функций. Сама ContentPanel является сеткой. Первоначально сетка имеет одну строку и один столбец. Чтобы разместить элементы пользовательского интерфейса в сетке и расположить их в определенном месте, вы обычно используете несколько строк и / или несколько столбцов, которые вы должны сначала определить. Чтобы получить желаемый макет, Сетка содержит 3 отдельные строки. В первом ряду (номер строки 0) размещается StackPanel. Эта строка принимает высоту, необходимую для отображения всех видимых элементов пользовательского интерфейса StackPanel. Следующая строка в таблице занимает все пространство, оставшееся в сетке, а последняя строка точно соответствует высоте, необходимой для отображения переключателя ToggleSwitch. XAML для ContentPanel выглядит следующим образом:

    <!–ContentPanel – place additional content here–>
    <Grid x:Name="ContentPanel"
            Grid.Row="1"
            Margin="12,0,12,0">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition />
            <RowDefinition Height="Auto" />
        </Grid.RowDefinitions>
        <StackPanel>
            <TextBlock HorizontalAlignment="Left"
                        TextWrapping="Wrap"
                        Text="Set your own tile text (approx. 45 characters)"
                        VerticalAlignment="Top"
                        Margin="12,0" />
            <TextBox x:Name="tbBackContent"
                        TextWrapping="Wrap"
                        MaxLength="45"
                        d:LayoutOverrides="Height"
                        TextChanged="tbBackContent_TextChanged" />
            <Button x:Name="btnRestore"
                    Content="Restore Default Text"
                    Margin="0,0,0,3"
                    d:LayoutOverrides="Height"
                    Click="btnRestore_Click"
                    Visibility="Collapsed" />
        </StackPanel>
        <toolkit:ToggleSwitch Header=""
                                Grid.Row="2"
                                Content="Allow using Location?" />
    </Grid>

Вы можете видеть наши определения Grid.RowDefinitions . Существует также возможность определить Grid.ColumnDefinitions , но для этого конкретного простого интерфейса нам нужны только строки. Прокручивая XAML, вы можете увидеть все отдельные элементы пользовательского интерфейса. TextBox и Button связывают события с обработчиками событий. Для кнопки событие Click связано с методом btnRestore_Click . Каждый раз, когда пользователь нажимает кнопку, будет выполняться код, определенный в btnRestore_Click . Этот код определен в C #. Мы рассмотрим код позже. TextBox использует событие TextChanged, которое будет запускаться каждый раз, когда изменяется значение свойства Text TextBox. Если это произойдет, код внутри методаtbBackContent_TextChanged выполнится.

Во второй части EvenTiles мы рассмотрели NavigationService, который можно использовать для перехода от одной PhoneApplicationPage к другой PhoneApplicationPage. Каждый раз, когда пользователь переходит на определенную страницу, вызывается метод OnNavigatedTo на этой странице. Вы можете переопределить этот метод, чтобы расширить его функциональность. Когда пользователь уходит от приложения PhoneApplication, вызывается аналогичный метод ( OnNavigatedFrom ), который вы снова можете переопределить, чтобы добавить определенные функции, которые вам нужны на определенной странице. На странице настроек EvenTiles мы переопределяем оба эти метода, чтобы добавить некоторые функции:

OnNavigated …

    protected override void OnNavigatedTo(System.Windows.Navigation.NavigationEventArgs e)
    {
        base.OnNavigatedTo(e);
        tbBackContent.Text = App.ActualSecBackContent;
        btnRestore.Visibility = tbBackContent.Text.Equals(App.DefaultSecBackContent) ? Visibility.Collapsed : Visibility.Visible;
    }
     
    protected override void OnNavigatedFrom(System.Windows.Navigation.NavigationEventArgs e)
    {
        base.OnNavigatedFrom(e);
        App.ActualSecBackContent = tbBackContent.Text;
    }

Оба эти метода содержат вызов аналогичного метода, которому предшествует ключевое слово base, Эти методы выполняют функциональность, которая определена в базовом классе нашего производного класса PhoneApplicationPage. Чтобы мы не пропустили этот код (который может содержать важные функции для навигации по страницам), мы должны вызвать эти методы. Сразу же при вызове методов базового класса добавляется наша собственная функциональность. Когда мы переходим на страницу настроек, мы инициализируем TextBox с текущим сохраненным контентом для вторичной плитки, которую мы создадим позже в этой серии. Этот контент определяется в строковом свойстве в файле App.xaml.cs. Затем мы определяем, должна ли кнопка, которую можно использовать для восстановления текста по умолчанию, быть видимой. Это только тот случай, когда TextBox отображает что-то отличное от текста по умолчанию, который также определен в App.xaml.cs. В App.xaml.cs текст по умолчанию присваивается фактическому тексту.

Когда пользователь покидает страницу настроек (например, нажав кнопку «Назад» на телефоне), мы просто сохраняем текущее содержимое TextBox для дальнейшего использования.

Давайте теперь посмотрим на обработчики событий для Button и TextBox:

Обработчики событий

    private void tbBackContent_TextChanged(object sender, System.Windows.Controls.TextChangedEventArgs e)
    {
        btnRestore.Visibility = tbBackContent.Text.Equals(App.DefaultSecBackContent) ? Visibility.Collapsed : Visibility.Visible;
    }
     
    private void btnRestore_Click(object sender, System.Windows.RoutedEventArgs e)
    {
        tbBackContent.Text = App.DefaultSecBackContent;
    }

Если текст в TextBox изменится, будет выполнен код обработчика события TextChanged . Как и в методе OnNavigatedTo , мы определяем, должна ли быть видимой кнопка, которую можно использовать для восстановления текста по умолчанию. Если кнопка нажата, мы просто восстанавливаем текст по умолчанию. Поскольку при этом также запускается событие TextChanged (в конце концов, текст TextBox изменяется), выполнение кода в обработчике события TextChanged теперь приведет к скрытию Button.

В следующем видео вы можете увидеть все шаги, необходимые для добавления описанной функциональности на страницу настроек.

Мы все еще далеки от того, чтобы иметь все функциональные возможности, чтобы фактически сделать Вторичный Плитку видимым на стартовом экране. Однако для создания успешных приложений для Windows Phone нам необходимо понять несколько фундаментальных концепций, поэтому мы продолжим работу над еще парой эпизодов. В следующем эпизоде ​​мы рассмотрим постоянные данные в IsolatedStorage, чтобы убедиться, что мы храним данные, когда пользователь прекращает использовать наше приложение.

Источник: http://mstruys.com/2011/12/04/eventiles-from-start-to-finishpart-4/

33
Share: