Работа с кнопками tvOS в Xamarin

Предупреждение

Поддержка конструктора iOS была прекращена в Visual Studio 2019 версии 16.8 и Visual Studio 2019 для Mac версии 8.8. В Visual Studio 2019 версии 16.9 и Visual Studio для Mac версии 8.9 этот конструктор удален. Создавать пользовательские интерфейсы iOS рекомендуется непосредственно на Mac с помощью Xcode Interface Builder. Дополнительные сведения см. в статье Проектирование пользовательских интерфейсов с помощью Xcode.

Используйте экземпляр UIButton класса для создания фокусируемой кнопки с возможностью выбора в окне tvOS. Когда пользователь выбирает кнопку, он отправляет сообщение Action в целевой объект, разрешая приложению Xamarin.tvOS реагировать на входные данные пользователя.

Примеры кнопок

Дополнительные сведения о работе с фокусом и переходе с помощью удаленного устройства Siri см. в документации по работе с навигацией и фокусоми Siri Remote и Bluetooth Controllers .

Сведения о кнопках

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

Примеры кнопок

Apple предлагает следующие предложения по работе с кнопками:

  • Используйте название или значок. Хотя значок и заголовок можно включить в кнопку, пространство ограничено, поэтому старайтесь не объединять оба.
  • Четко пометить деструктивные кнопки . Если кнопка выполняет деструктивное действие (например, удаление файла), четко помечайте его как такое с помощью текста и /или значка. Деструктивные действия всегда должны представлять оповещение с просьбой пользователя ограничить действие.
  • Не используйте кнопки "Назад" — кнопка меню на удаленном устройстве Siri используется для возврата на предыдущий экран. Одно из исключений из этого правила — для покупок в приложении или разрушительных действий, где должна отображаться кнопка "Отмена ".

Дополнительные сведения о работе с фокусом и навигацией см. в нашей документации по работе с навигацией и фокусом .

Значки кнопки

Apple предлагает использовать простые, высоко распознаваемые изображения для значков кнопки. Слишком сложные значки трудно распознать на экране телевизора через комнату на диване, поэтому попробуйте использовать самое простое представление, возможное, чтобы получить идею по всему. По возможности используйте стандартные хорошо известные изображения для значков (например, лупы для поиска).

Заголовки кнопок

Apple имеет следующие предложения при создании названий для кнопок:

  • Показывать описательный текст под кнопками "Значки" — где это возможно, поместите понятный, описательный текст ниже значка только для получения цели кнопки.
  • Используйте команды или фразы команд для заголовка . Четко укажите действие, которое будет происходить, когда пользователь нажимает кнопку.
  • Используйте заглавную букву . За исключением статей, сочетаний или предпозиций (четыре буквы или меньше), каждое слово заголовка кнопки должно быть заглавно.
  • Используйте короткий, to-The-Point Title . Используйте самый короткий возможный вариант, чтобы описать действие кнопки.

Кнопки и раскадровки

Самый простой способ работы с кнопками в приложении Xamarin.tvOS — добавить их в пользовательский интерфейс приложения с помощью конструктора Xamarin для iOS.

  1. В Обозреватель решений дважды щелкните Main.storyboard файл и откройте его для редактирования.

  2. Перетащите кнопку из библиотеки и удалите ее в представлении:

    Кнопка

  3. В Обозреватель свойств можно настроить несколько свойств кнопки, например название и цвет текста:

    Свойства кнопки

  4. Затем перейдите на вкладку "События" и простройте событие из кнопки и вызовите егоButtonPressed:

    Вкладка

  5. Вы автоматически переключитесь ViewController.cs в представление, где можно поместить новое действие в код с помощью клавиш со стрелками ВВЕРХ и ВНИЗ :

    Размещение нового действия в коде

  6. Нажмите клавишу ВВОД , чтобы выбрать расположение:

    Редактор кода

  7. Сохраните изменения во всех файлах.

Если свойство true кнопки Enabled и оно не охватывается другим элементом управления или представлением, его можно сделать элементом в фокусе с помощью Siri Remote. Если пользователь нажимает кнопку и щелкает Touch Surface, будет выполнено действие, ButtonPressed определенное выше.

Внимание

Хотя можно назначить такие действия, как при создании обработчика событий, он никогда не будет вызываться, так как TouchUpInsideUIButton Apple TV не имеет сенсорного экрана или поддержки сенсорных событий. При создании элементов пользовательского интерфейса tvOS всегда следует использовать тип действия по умолчанию.

Дополнительные сведения о работе с раскадровками см. в руководстве по началу работы с раскадровки Hello, tvOS.

Кнопки и код

UIButton При необходимости можно создать код C# и добавить его в представление приложения tvOS. Например:

var button = new UIButton(UIButtonType.System);
button.Frame = new CGRect (25, 25, 300, 150);
button.SetTitle ("Hello", UIControlState.Normal);
button.AllEvents += (sender, e) => {
    // Do something when the button is clicked
    ...
};
View.AddSubview (button);

При создании нового в UIButton коде необходимо указать одно UIButtonType из следующих элементов:

  • Система — это стандартный тип кнопки, представленной tvOS, и это тип, который вы будете использовать чаще всего.
  • DetailDisclosure — представляет тип кнопки "отклонить", используемую для скрытия или отображения подробных сведений.
  • InfoDark — темная кнопка подробных сведений отображает "i" в круге.
  • InfoLight — светлая кнопка подробных сведений отображает "i" в круге.
  • AddContact — отображайте кнопку в виде кнопки "Добавить контакт".
  • Custom — позволяет настроить несколько признаков кнопки.

Затем вы определите размер и расположение кнопки на экране. Пример:

button.Frame = new CGRect (25, 25, 300, 150);

Затем задайте заголовок кнопки. UIButtons отличаются от большинства UIKit элементов управления в том, что они имеют состояние, поэтому вы не можете просто изменить название, вам нужно изменить его для заданного UIControlState. Например:

button.SetTitle ("Hello", UIControlState.Normal);

Затем используйте AllEvents событие, чтобы узнать, когда пользователь щелкнул кнопку. Пример:

button.AllEvents += (sender, e) => {
    // Do something when the button is clicked
    ...
};

Наконец, вы добавите кнопку в представление, чтобы отобразить его:

View.AddSubview (button);

Внимание

Хотя можно назначить такие действия, как TouchUpInside для UIButton, он никогда не будет называться, потому что Apple TV не имеет сенсорного экрана или поддержки сенсорных событий. Всегда следует использовать такие события, как AllEvents или PrimaryActionTriggered.

Стилизация кнопки

tvOS предоставляет несколько свойств, UIButton которые можно использовать для предоставления названия и стиля его с такими вещами, как цвет фона и изображения.

Заголовки кнопок

Как мы видели выше, отличаются от большинства UIKit элементов управления в том, что они имеют состояние, UIButtons поэтому вы не можете просто изменить название, вы должны изменить его для заданного.UIControlState Например:

button.SetTitle ("Hello", UIControlState.Normal);

Вы можете задать цвет заголовка для кнопки с помощью SetTitleColor метода. Например:

button.SetTitleColor (UIColor.White, UIControlState.Normal);

И вы можете настроить тень заголовка с помощью .SetTitleShadowColor Например:

button.SetTitleShadowColor(UIColor.Black, UIControlState.Normal);

Вы можете задать тень заголовка, чтобы измениться с Engraved на Embossed при выделении кнопки с помощью следующего кода:

button.ReverseTitleShadowWhenHighlighted = true;

Кроме того, в качестве заголовка кнопки можно использовать текст с атрибутами. Например:

var normalAttributedTitle = new NSAttributedString (buttonTitle, foregroundColor: UIColor.Blue, strikethroughStyle: NSUnderlineStyle.Single);
myButton.SetAttributedTitle (normalAttributedTitle, UIControlState.Normal);

var highlightedAttributedTitle = new NSAttributedString (buttonTitle, foregroundColor: UIColor.Green, strikethroughStyle: NSUnderlineStyle.Thick);
myButton.SetAttributedTitle (highlightedAttributedTitle, UIControlState.Highlighted);

Изображения кнопки

Изображение UIButton может быть присоединено к нему и может использовать изображение в качестве фона.

Чтобы задать фоновое изображение кнопки для заданного UIControlState, используйте следующий код:

button.SetBackgroundImage(UIImage.FromFile("my image.png"), UIControlState.Normal);

Задайте свойству AdjustsImageWhenHiglighted , чтобы true нарисовать изображение светлее при выделении кнопки (это значение по умолчанию). AdjustsImageWhenDisabled Задайте свойству, чтобы true нарисовать изображение темнее при отключении кнопки (опять же, это значение по умолчанию).

Чтобы задать изображение, отображаемое на кнопке, используйте следующий код:

button.SetImage(UIImage.FromFile("my image.png"), UIControlState.Normal);

TintColor Используйте свойство, чтобы задать цветной тон, применяемый как к заголовку, так и к изображению кнопки. Для кнопок Custom типа это свойство не влияет, необходимо реализовать TintColor поведение самостоятельно.

Итоги

В этой статье рассматривается проектирование и работа с кнопками внутри приложения Xamarin.tvOS. В нем показано, как работать с кнопками в конструкторе iOS и как создавать кнопки в коде C#. Наконец, он показал, как изменить заголовок кнопки и изменить его стиль и внешний вид.