Бөлісу құралы:


Панели инструментов в Xamarin.Mac

В этой статье описывается работа с панелями инструментов в приложении Xamarin.Mac. Он охватывает создание и обслуживание панелей инструментов в Xcode и Interface Builder, предоставление их коду и программное взаимодействие с ними.

Разработчики Xamarin.Mac, работающие с Visual Studio для Mac, имеют доступ к тем же элементам управления пользовательского интерфейса, которые доступны разработчикам macOS, работающим с Xcode, включая элемент управления панели инструментов. Так как Xamarin.Mac интегрируется непосредственно с Xcode, можно использовать построитель интерфейсов Xcode для создания и поддержания элементов панели инструментов. Эти элементы панели инструментов также можно создать в C#.

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

В этой статье рассматриваются основы работы с панелями инструментов и элементами панели инструментов в приложении Xamarin.Mac.

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

Кроме того, ознакомьтесь с разделом Xamarin.Mac Internals в разделе классов И методов Objective-C C#. В нем описываются Register и Export атрибуты, используемые для подключения классов C# к Objective-C классам.

Общие сведения о панелях инструментов

Любое окно в приложении macOS может включать панель инструментов:

Пример окна с панелью инструментов

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

Панели инструментов могут отображать элементы тремя способами:

  1. Значок и текст

    Панель инструментов со значками и текстом

  2. Только значок

    Панель инструментов только для значков

  3. Только текст

    Панель инструментов только для текста

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

Контекстное меню для панели инструментов

Используйте то же меню, чтобы отобразить панель инструментов с меньшим размером:

Панель инструментов с небольшими значками

Меню также позволяет настроить панель инструментов:

Диалоговое окно, используемое для настройки панели инструментов

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

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

Элементы, связанные с панелью инструментов в меню

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

Кроме того, если панель инструментов настроена правильно в Конструкторе интерфейсов, приложение автоматически сохраняет настройки панели инструментов в нескольких запусках приложения.

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

Настройка пользовательского контроллера главного окна

Чтобы предоставить элементы пользовательского интерфейса коду C# через точки и действия, приложение Xamarin.Mac должно использовать пользовательский контроллер окна:

  1. Откройте раскадровки приложения в построителе интерфейсов Xcode.

  2. Выберите контроллер окна в области конструктора.

  3. Перейдите в инспектор удостоверений и введите "WindowController" в качестве имени класса:

    Задание имени пользовательского класса для контроллера окна

  4. Сохраните изменения и вернитесь к Visual Studio для Mac для синхронизации.

  5. Файл WindowController.cs будет добавлен в проект на панели решения в Visual Studio для Mac:

    Выбор WindowController.cs на панели решений

  6. Откройте раскадровку в построителе интерфейсов Xcode.

  7. Файл WindowController.h будет доступен для использования:

    Файл WindowController.h

Создание и обслуживание панелей инструментов в Xcode

Панели инструментов создаются и поддерживаются с помощью построителя интерфейсов Xcode. Чтобы добавить панель инструментов в приложение, измените основную раскадровку приложения (в данном случае Main.storyboard), дважды щелкнув ее на панели решения:

Открытие main.storyboard на панели решений

В инспекторе библиотеки введите "инструмент" в поле поиска, чтобы упростить просмотр всех доступных элементов панели инструментов:

Инспектор библиотеки, отфильтрованный для отображения элементов панели инструментов

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

Инспектор атрибутов для панели инструментов

Доступны следующие свойства.

  1. Отображение — определяет, отображается ли панель инструментов значки, текст или оба
  2. Видимый при запуске — если выбрано, панель инструментов отображается по умолчанию.
  3. Настраиваемая настройка. Если выбрано, пользователи могут изменять и настраивать панель инструментов.
  4. Разделитель — если выбрано, тонкая горизонтальная линия отделяет панель инструментов от содержимого окна.
  5. Размер — задает размер панели инструментов
  6. Автосохранение — если выбрано, приложение будет сохранять изменения конфигурации панели инструментов пользователя во время запуска приложения.

Выберите параметр автосохранение и оставьте все остальные свойства по умолчанию.

Открыв панель инструментов в иерархии интерфейса, откройте диалоговое окно настройки, выбрав элемент панели инструментов:

Настройка панели инструментов

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

Инспектор библиотеки

Можно добавить следующие элементы панели инструментов:

  • Элемент панели инструментов изображения — элемент панели инструментов с пользовательским изображением в виде значка.

  • Элемент панели инструментов гибкого пространства — гибкое пространство, используемое для оправдания последующих элементов панели инструментов. Например, один или несколько элементов панели инструментов, за которыми следует гибкий элемент панели инструментов, а другой элемент панели инструментов закрепляет последний элемент справа от панели инструментов.

  • Элемент панели инструментов пробела — фиксированное пространство между элементами на панели инструментов

  • Элемент панели инструментов разделителя — видимый разделитель между двумя или несколькими элементами панели инструментов для группировки

  • Настройка элемента панели инструментов. Позволяет пользователям настраивать панель инструментов

  • Элемент панели инструментов печати— позволяет пользователям распечатать открытый документ

  • Элемент панели инструментов "Показать цвета" — отображает стандартный системный средство выбора цветов:

    Средство выбора цвета системы

  • Отображение элемента панели инструментов шрифта. Отображается диалоговое окно стандартного системного шрифта:

    Селектор шрифтов

Внимание

Как видно позже, многие стандартные элементы управления пользовательского интерфейса Cocoa, такие как поля поиска, сегментированные элементы управления и горизонтальные ползунки, также можно добавить на панель инструментов.

Добавление элемента на панель инструментов

Чтобы добавить элемент на панель инструментов, выберите панель инструментов в иерархии интерфейса и щелкните один из его элементов, что приводит к отображению диалогового окна настройки. Затем перетащите новый элемент из инспектора библиотеки в область разрешенных элементов панели инструментов:

Допустимые элементы панели инструментов в диалоговом окне настройки панели инструментов

Чтобы убедиться, что новый элемент является частью панели инструментов по умолчанию, перетащите его в область элементов панели инструментов по умолчанию:

Переупорядочение элемента панели инструментов путем перетаскивания

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

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

Настройка элемента панели инструментов с помощью инспектора атрибутов

Доступны следующие свойства.

  • Имя изображения — изображение, используемое в качестве значка элемента
  • Метка — текст для элемента на панели инструментов
  • Метка палитры — текст для элемента в области "Разрешенные элементы панели инструментов"
  • Тег — необязательный уникальный идентификатор, который помогает идентифицировать элемент в коде.
  • Идентификатор — определяет тип элемента панели инструментов. Настраиваемое значение можно использовать для выбора элемента панели инструментов в коде.
  • Можно выбрать. Если проверка, элемент будет действовать как кнопка "Вкл/выкл".

Внимание

Добавьте элемент в область "Разрешенные элементы панели инструментов" , но не на панели инструментов по умолчанию, чтобы предоставить параметры настройки для пользователей.

Добавление других элементов управления пользовательского интерфейса на панель инструментов

Несколько элементов пользовательского интерфейса Cocoa, таких как поля поиска и сегментированные элементы управления, также можно добавить на панель инструментов.

Чтобы попробовать это, откройте панель инструментов в иерархии интерфейса и выберите элемент панели инструментов, чтобы открыть диалоговое окно настройки. Перетащите поле поиска из инспектора библиотеки в область разрешенных элементов панели инструментов:

Использование диалогового окна настройки панели инструментов

Здесь используйте конструктор интерфейсов, чтобы настроить поле поиска и предоставить его коду через действие или выход.

Поддержка встроенных элементов панели инструментов

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

Добавление текстового представления в приложение

Сохраните документ, вернитесь к Visual Studio для Mac для синхронизации с Xcode, запустите приложение, введите текст, выберите его и щелкните элемент панели инструментов Colors. Обратите внимание, что представление текста автоматически работает с средство выбора цвета:

Встроенные функции панели инструментов с текстовым представлением и средство выбора цвета

Использование изображений с элементами панели инструментов

С помощью элемента панели инструментов изображения любой растровый рисунок, добавленный в папку Resources (и учитывая действие сборки ресурса пакета), можно отобразить на панели инструментов в виде значка:

  1. В Visual Studio для Mac на панели решений щелкните правой кнопкой мыши папку "Ресурсы" и выберите "Добавить>файлы".

  2. В диалоговом окне "Добавить файлы" перейдите к нужным изображениям, выберите их и нажмите кнопку "Открыть".

    Выбор изображений для добавления

  3. Выберите "Копировать", проверка Использовать одно действие для всех выбранных файлов и нажмите кнопку "ОК".

    Выбор действия копирования для добавленных изображений

  4. На панели решения дважды щелкните MainWindow.xib, чтобы открыть его в Xcode.

  5. Выберите панель инструментов в иерархии интерфейса и щелкните один из его элементов, чтобы открыть диалоговое окно настройки.

  6. Перетащите элемент панели инструментов изображения из инспекторабиблиотеки в область разрешенных элементов панели инструментов:

    Элемент панели инструментов изображения, добавленный в область

  7. В инспекторе атрибутов выберите только что добавленное изображение в Visual Studio для Mac:

    Настройка пользовательского изображения для элемента панели инструментов

  8. Задайте для метки "Корзина" и метку палитры значение "Удалить документ":

    Настройка метки элемента панели инструментов и метки палитры

  9. Перетащите элемент панели инструментов разделителя из инспекторабиблиотеки в область разрешенных элементов панели инструментов:

    Элемент панели инструментов разделителя, добавленный в область разрешенных элементов панели инструментов

  10. Перетащите элемент разделителя и элемент "Корзина" в область элементов панели инструментов по умолчанию и задайте порядок элементов панели инструментов слева направо, как показано ниже (цвета, шрифты, разделитель, корзина, гибкое пространство, печать):

    Элементы панели инструментов по умолчанию

  11. Сохраните изменения и вернитесь в Visual Studio для Mac для синхронизации с Xcode.

Запустите приложение, чтобы убедиться, что новая панель инструментов отображается по умолчанию:

Панель инструментов с настраиваемыми элементами по умолчанию

Предоставление элементов панели инструментов с помощью точек и действий

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

  1. На панели решений дважды щелкните Main.storyboard, чтобы открыть его в Xcode.

  2. Убедитесь, что пользовательский класс WindowController назначен контроллеру главного окна в инспекторе удостоверений:

    Использование инспектора удостоверений для задания пользовательского класса для контроллера окна

  3. Затем выберите элемент панели инструментов в иерархии интерфейса:

    Выбор элемента панели инструментов в иерархии интерфейса

  4. Откройте представление помощника, выберите файл WindowController.h и перетащите элемент управления из элемента панели инструментов в файл WindowController.h.

  5. Задайте для типа Подключение ion значение Action, введите "корзинаDocument" для имени и нажмите кнопку Подключение:

    Настройка действия для элемента панели инструментов

  6. Предоставляйте текстовое представление как выход с именем documentEditor в файле ViewController.h :

    Настройка выхода для текстового представления

  7. Сохраните изменения и вернитесь к Visual Studio для Mac для синхронизации с Xcode.

В Visual Studio для Mac измените файл ViewController.cs и добавьте следующий код:

public void EraseDocument() {
    documentEditor.Value = "";
}

Затем измените файл WindowController.cs и добавьте следующий код в нижней WindowController части класса:

[Export ("trashDocument:")]
void TrashDocument (NSObject sender) {

    var controller = ContentViewController as ViewController;
    controller.EraseDocument ();
}

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

Панель инструментов с активным элементом корзины

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

Отключение элементов панели инструментов

Чтобы отключить элемент на панели инструментов, создайте пользовательский NSToolbarItem класс и переопределите Validate метод. Затем в построителе интерфейсов назначьте пользовательский тип элементу, который требуется включить или отключить.

Чтобы создать пользовательский NSToolbarItem класс, щелкните проект правой кнопкой мыши и выберите команду Добавить>новый файл.... Выберите общий>пустой класс, введите "АктивироватьableItem" для имени и нажмите кнопку "Создать".

Добавление пустого класса в Visual Studio для Mac

Затем измените файл ActivatableItem.cs , чтобы прочитать следующее:

using System;

using Foundation;
using AppKit;

namespace MacToolbar
{
    [Register("ActivatableItem")]
    public class ActivatableItem : NSToolbarItem
    {
        public bool Active { get; set;} = true;

        public ActivatableItem ()
        {
        }

        public ActivatableItem (IntPtr handle) : base (handle)
        {
        }

        public ActivatableItem (NSObjectFlag  t) : base (t)
        {
        }

        public ActivatableItem (string title) : base (title)
        {
        }

        public override void Validate ()
        {
            base.Validate ();
            Enabled = Active;
        }
    }
}

Дважды щелкните Main.storyboard , чтобы открыть его в Xcode. Выберите элемент панели инструментов корзины, созданный выше, и измените его класс на "АктивироватьableItem" в инспекторе удостоверений:

Настройка настраиваемого класса для элемента панели инструментов

Создайте выход, вызываемый trashItem для элемента панели инструментов корзины . Сохраните изменения и вернитесь в Visual Studio для Mac для синхронизации с Xcode. Наконец, откройте MainWindow.cs и обновите AwakeFromNib метод следующим образом:

public override void AwakeFromNib ()
{
    base.AwakeFromNib ();

    // Disable trash
    trashItem.Active = false;
}

Запустите приложение и обратите внимание, что элемент корзины теперь отключен на панели инструментов:

Панель инструментов с неактивным элементом корзины

Итоги

В этой статье подробно рассматривается работа с панелями инструментов и элементами панели инструментов в приложении Xamarin.Mac. В ней описано, как создавать и поддерживать панели инструментов в построителе интерфейсов Xcode, как некоторые элементы пользовательского интерфейса автоматически работают с элементами панели инструментов, как работать с панелями инструментов в коде C#, а также как включить и отключить элементы панели инструментов.