Dashboard

Основы виджета

Виджеты обеспечивают людям простой способ, для получения доступа к важной информации и выполнения простых задач, не мешая их работе на рабочем столе. Dashboard приложения, доступны начиная с OS X v10.4 и выше, и обеспечивают среду выполнения виджетов, позволяя пользователям управлять ими. Этот раздел знакомит со средой выполнения Dashboard и объясняет, как создать простой виджет.

Dashboard отображает активные виджеты в области, которая выводится над рабочим столом:

OS X Dashboard screen

 

Что такое Dashboard виджет?

Виджет представляет собой мини-приложение, которое существует исключительно в Dashboard. С точки зрения пользователя, он ведет себя как приложение: показывает полезную информацию или помогает выполнять простые задачи с минимальным вводом. Например, Погода (рис. ниже) показывает 6-дневный прогноз погоды в месте, выбранном пользователем.

Dashboard виджет погода

Несмотря на то, что виджеты выглядят как пользовательские приложения, они помтроены на базе веб-технологий и стандартов, таких как HTML, CSS и JavaScript. В дополнение к веб-технологиям, Apple предоставляет полезные дополнения, такие как установки предпочтений (preferences), локализации и доступ к системе.

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

Создание простого виджета

Для разработки виджетов, вы должны работать с bundle структурой, списками свойств, и некоторыми комбинациями HTML, CSS и JavaScript. Этот раздел описывает эти компоненты и поможет вам создать простой виджет Hello World, похожий на показанный на рисунке ниже:

Dashcode первый виджет Hello World
 
Примечание: Пример кода в этом разделе упрощен и может не соответствовать строгим спецификациям HTML.

Bundle структура виджета

Виджеты распространяются как bundle - пакеты. Bundle - это директория файловой системы, которая объединяет и упорядочивает в себя все необходимые файлы виджета.

Для Hello World виджета, структура bundle содержит следующие файлы:

Hello World.wdgt/
    Icon.png
    Info.plist
    Default.png
    HelloWorld.html
    HelloWorld.css

Примечание: В зависимости от версии примера кода, вы можете увидеть или не увидеть файл HelloWorld.css, входящий в пакет. Это потому, что более поздние версии могут разместить CSS в HTML файл.

Список свойств виджета

Каждый виджет должен иметь файл информационного списка свойств (Info.plist), связанный с ним. Этот файл предоставляет Dashboard информацию о Вашем виджете. Dashboard использует эту информацию для создания пространства, в котором он может работать.

Info.plist файл содержит необходимую информацию. В основном файл Info.plist содержит пять обязательных ключей и четыре дополнительных. Эти ключи перечислены в таблице ниже вместе с их определениями и некоторыми примерами значений, используемых в виджете Hello World:

КлючПример значенияОписание
CFBundleIdentifiercom.apple.widget.HelloWorldОбязательный. Строка, которая однозначно идентифицирует виджет, в обратном формате доменном.
CFBundleNameHello WorldОбязательный. Строка, содержащая имя виджета. Должна совпадать с именем bundle виджета на диске, минус .wdgt расширение файла.
CFBundleDisplayNameHello WorldОбязательный. Строка, которая содержит фактическое имя виджета, которая будет отображаться в панели виджетов и Finder.
CFBundleVersion1.0Обязательный. Строка, которая выдает номер версии виджета.
CloseBoxInsetX16Необязательный, смещение для расположения элемента закрытия виджета по оси х. Должно быть между 0 и 100.
CloseBoxInsetY14Необязательный, смещение для расположения элемента закрытия виджета по оси y. Должно быть между 0 и 100.
Height126Необязательный, содержит числовое значение, указывающее высоту виджета, измеряется в пикселях. Если не указано, используется высота Default.png.
MainHTMLHelloWorld.htmlОбязательный, содержит строку с относительным путем к основному HTML файлу виджета. Этот файл является файлом реализации виджета.
Width235Необязательный, содержит числовое значение, указывающее ширину виджета, измеряется в пикселях. Если не указано, используется ширина Default.png.

Особо следует отметить значение для ключей CloseBoxInsetX и CloseBoxInsetY. Эти значения определяют размещение элемента закрытия вашего виджета. Вы должны расположить элемент закрытия так, чтобы "Х" распологался по центру верхнего левого угла виджета.

Есть несколько дополнительных ключей Info.plist, о которых рассказано в "Ключи Dashboard Info.plist".

Полностью файл информационного списка свойств для Hello World виджета, выглядит следующим образом:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple Computer//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
  <key>CFBundleDisplayName</key>
  <string>Hello World</string>
  <key>CFBundleIdentifier</key>
  <string>com.apple.widget.helloworld</string>
  <key>CFBundleName</key>
  <string>Hello World</string>
  <key>CFBundleShortVersionString</key>
  <string>1.0</string>
  <key>CFBundleVersion</key>
  <string>1.0</string>
  <key>CloseBoxInsetX</key>
  <integer>16</integer>
  <key>CloseBoxInsetY</key>
  <integer>14</integer>
  <key>MainHTML</key>
  <string>HelloWorld.html</string>
</dict>
</plist>

Иконки и изображения по умолчанию

Два графических файла, необходимых в виджете,- это файлы иконки и изображения по умолчанию. Они должны быть в формате Portable Network Graphics (PNG) и должны быть названы Icon.png и Default.png, соответственно.

Значок файла, Icon.png, используется в панели виджетов как представление виджета:

icon для Dashboard widget

Изображение по умолчанию, Default.png, отображается, в то время как ваш виджет загружается. Это может быть фон, используемый виджетом или любой другой подходящий образ. Этот файл также задает размер виджета, если вы не используете Height и Width свойства в файле Info.plist.

Dashcode default image hello world

Реализация виджета

HTML файл виджета обеспечивает реализацию виджета. Вы можете назвать его как угодно, но он должен находиться в корневом каталоге bundle виджета и должен быть указан в файле Info.plist. Для виджета Hello World HTML файл выводит изображение и надпись "Hello, World!". Содержимое файла HelloWorld.html приведено в листинге:

<html>
<head>

<style>

    @import "HelloWorld.css";

</style>
</head>

<body>

    <img src="Default.png">
    <span class="helloText">Hello, World!</span>

</body>
</html>

HelloWorld.css файл содержит всю информацию о стиле для виджета, как показано в следующем листинге:

body {
    margin: 0;
}

.helloText {
    font: 22px "Lucida Grande";
    font-weight: bold;
    color: white;
    position: absolute;
    top: 25px;
    left: 34px;
}

Соберем и загрузим виджет

Во-первых, создадим новую папку с именем Hello World. Затем поместим эти файлы в нее на корневом уровне:

    Icon.png
    Info.plist
    Default.png
    HelloWorld.html
    HelloWorld.css

Затем переименуем папку в Hello World.wdgt.

После того, как bundle был переименован, дважды щелкните по его иконке в Finder, чтобы установить его. Появится, диалог установки, при нажатии кнопки Установить, копирует виджет в ~/Library/Widgets/ и открывает его в Dashboard.

 
 
homeЗаметили ошибкукарта сайта 
   Made on a Mac