Пользовательский интерфейс представления изображения

Представление изображения (IKImageView) во взглядах пользовательского интерфейса, подобных любому представлению, содержащему изображение. Изображение, показанное на рисунке 2-1, могло столь же легко быть в NSView объект, NSImageView объект или окно Carbon.

IKImageView объект имеет важную характеристику, которую не имеет никакой другой контейнер изображения. Когда пользователь дважды щелкает по изображению в представлении изображения, панель Image Edit появляется, как показано на рисунке 2-2. Панель позволяет пользователю вносить изменения в изображение, применять много эффектов и просматривать метаданные изображения и свойства. Область Adjust обеспечивает обычно используемые корректировки изображения.

Область Effects (показанный на рисунке 2-3) позволяет пользователю, одним щелчком, предварительно просматривать и применять увеличение резкости, размывание или цветовые фильтры.

Панель выводит на экран все метаданные для изображения, а также всесторонний список свойств изображения, как показано на рисунке 2-4. Если данные изображения являются больше, чем может поместиться в область, Имэдж Кит предоставляет полосы прокрутки автоматически.

Существует очень немного задач, которые необходимо выполнить для панели Image Edit для появления. Необходимо установить надлежащее состояние представления изображения, установить совместно используемый экземпляр панели Image Edit (IKImageEditPanel), и набор источник данных. Платформа Имэджа Кита заботится об остальных — показ панели, переключение областей, реакция на изменения, сделанные пользователем, выборкой и отображением данных изображения и закрытием панели Image Edit.

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

Идеально, Вы также обеспечили бы средства управления в окне представления изображения, как показано на рисунке 2-6. Данные показывают два сегментированных средств управления (создаваемый в Интерфейсном Разработчике, использующем NSSegmentedControl средства управления), каждый из которых использует пользовательские значки, которые Вы обеспечиваете.

Представление изображения отслеживает фактор изменения масштаба, угол вращения, и может ли быть отредактировано изображение. Необходимо реагировать на выбор пользователя путем установки режима инструмента. Платформа Имэджа Кита заботится об анимации перемещения, изменения масштаба и операций вращения; показ круга вращения (см. рисунок 2-7); отображение обрезки и прямоугольников выбора; и отображение области аннотации. Необходимо реализовать копирование данных к области монтажа, обрезка изображения и обработка текста для области аннотации.

Никакое изображение просматривающее и редактирующее приложение не было бы завершено без возможности сохранить отредактированный образ. IKSaveOptions класс обеспечивает вспомогательное представление для NSSavePanel объект, позволяющий пользователю выбирать формат файла образа и устанавливать опции, подходящие для того формата. Пользователь может выбрать из числа многих форматов. Опции, подходящие для того формата, появляются ниже формата. Например, для формата TIFF, пользователь может выбрать опции сжатия (как показано на рисунке 2-8).

Просмотр изображения в представлении изображения

Этот раздел показывает, как открыть и вывести на экран изображение в представлении изображения. Вы установите опции представления изображения так, чтобы панель Image Edit открылась, когда пользователь дважды щелкает по изображению. Сначала Вы установите проект XCode, файлы проекта и интерфейс контроллера. Тогда Вы создадите пользовательский интерфейс в Интерфейсном Разработчике. Наконец, Вы добавите необходимые подпрограммы к файлу реализации.

Сохранение образов

IKSaveOptions класс обрабатывает изображение и опции сохранения PDF. После создания NSSavePanel объект, Вы выделяете и инициализируете представление аксессуара опций сохранения и затем добавляете представление к диалоговому окну Сохранения. Следует иметь в виду это IKSaveOptions обрабатывает опции, но это фактически не сохраняет образ или PDF. После установки панели аксессуара опций сохранения также необходимо реализовать метод сохранения.

Выполните эти шаги для добавления представления аксессуара параметров изображения к Моему приложению Средства просмотра изображений:

1. Откройтесь Controller.h файл и добавляет переменную экземпляра опций сохранения.

   IKSaveOptions * mSaveOptions;

2. Добавьте следующую сигнатуру метода:

   - (IBAction)saveImage: (id)sender;

3. В Controller.m файл, добавляет метод, дарящий панели Save представление аксессуара опций сохранения (область).

   Метод сначала создает экземпляр NSSavePanel класс. Тогда это выделяет объект опций сохранения и инициализирует его со свойствами изображения и типом UT образа, который будет сохранен. Затем код добавляет представление опций сохранения к панели Save. Это показывает панель Save как лист, обеспечивая селектор, вызывающийся, когда завершается панель Save. (Вы запишете тот метод затем.)

   - (IBAction)saveImage: (id)sender

   {

   NSSavePanel * savePanel = [NSSavePanel savePanel];

   mSaveOptions = [[IKSaveOptions alloc]

   initWithImageProperties: mImageProperties

   imageUTType: mImageUTType];

   [mSaveOptions addSaveOptionsAccessoryViewToSavePanel: savePanel];

   NSString * fileName = [[mWindow representedFilename] lastPathComponent];

   [savePanel beginSheetForDirectory: NULL

   file: fileName

   modalForWindow: mWindow

   modalDelegate: self

   didEndSelector: @selector(savePanelDidEnd:returnCode:contextInfo:)

   contextInfo: NULL];

   }

4. Добавьте a savePanelDidEnd метод, выполняющий фактическое сохранение.

   Если пользователь нажимает кнопку Save, метод получает имя файла и тип и получает изображение от представления. Если изображение существует, метод использует CGImageDestinationRef непрозрачный тип (от Изображения платформа I/O) для создания места назначения изображения на основе представления URL пути к файлу. Это сохраняет образ со своими свойствами, завершает место назначения и выпускает CGImageDestination возразите, потому что это больше не необходимо.

   - (void)savePanelDidEnd: (NSSavePanel *)sheet

   returnCode: (int)returnCode

   contextInfo: (void *)contextInfo

   {

   if (returnCode == NSOKButton)

   {

   NSString * path = [sheet filename];

   NSString * newUTType = [mSaveOptions imageUTType];

   CGImageRef image;

   image = [mImageView image];

   if (image)

   {

   NSURL * url = [NSURL fileURLWithPath: path];

   CGImageDestinationRef dest = CGImageDestinationCreateWithURL((CFURLRef)url,

   (CFStringRef)newUTType, 1, NULL);

   if (dest)

   {

   CGImageDestinationAddImage(dest, image,

   (CFDictionaryRef)[mSaveOptions imageProperties]);

   CGImageDestinationFinalize(dest);

   CFRelease(dest);

   }

   } else

   {

   NSLog(@"*** saveImageToPath - no image");

   }

   }

   }

5. Сохраните Controller.m файл.

6. Откройтесь MainMenu.nib файл.

7. Дважды щелкните по значку MainMenu в окне документа пера.

8. Откройте меню File, таким образом, Вы видите пункты меню New, Открытые, и т.д.

9. Перетащите управление с пункта меню Save на контроллер.

10. В панели соединений для контроллера выбрать saveImage:.

11. Сохраните файл пера.

12. В XCode нажмите Build и Go.

13. После запусков приложения выберите File> Save. Необходимо видеть, что панель Save появляется со вспомогательным представление, выглядящее подобным следующему.

    

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

    

Поддержка изменения масштаба

Для поддержки изменения масштаба необходимо добавить команды меню или средства управления (или оба) для изменения масштаба и метода для ответа на команды.

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

1. Добавьте следующую сигнатуру метода к Controller.h файл, затем сохраните файл:

   - (IBAction)doZoom: (id)sender;

2. Откройтесь Controller.m файл и добавляет константы для фактора изменения масштаба.

   #define ZOOM_IN_FACTOR 1.414214 // doubles the area

   #define ZOOM_OUT_FACTOR 0.7071068 // halves the area

3. Добавьте метод для обработки команд, чтобы уменьшить масштаб, увеличить масштаб, масштабировать, чтобы соответствовать, и масштабировать к фактическому размеру изображения.

   - (IBAction)doZoom: (id)sender

   {

   NSInteger zoom;

   CGFloat zoomFactor;

   if ([sender isKindOfClass: [NSSegmentedControl class]])

   zoom = [sender selectedSegment];

   else

   zoom = [sender tag];

   switch (zoom)

   {

   case 0:

   zoomFactor = [mImageView zoomFactor];

   [mImageView setZoomFactor: zoomFactor * ZOOM_OUT_FACTOR];

   break;

   case 1:

   zoomFactor = [mImageView zoomFactor];

   [mImageView setZoomFactor: zoomFactor * ZOOM_IN_FACTOR];

   break;

   case 2:

   [mImageView zoomImageToActualSize: self];

   break;

   case 3:

   [mImageView zoomImageToFit: self];

   break;

   }

   }

4. Откройтесь MainMenu.nib файл.

5. Дважды щелкните по значку MainMenu в окне документа пера.

6. Создайте новое меню путем перетаскивания Пункта меню Подменю от Библиотеки и отбрасывания его между пунктами меню Edit и Format.

7. Назовите новое меню Views.

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

   Команда	Тег	Ключевой эквивалент
   Уменьшение	0	Команда –
   Увеличение	1	Команда =
   Изменение масштаба к фактическому размеру	2
   Изменение масштаба для адаптации	3

9. Перетащите управление от каждого элемента до значка Controller. Затем в панели соединений для контроллера щелкнуть doZoom:.

10. Сохраните MainMenu.nib файл.

11. В XCode нажмите Build и Go. Тогда удостоверьтесь, что команды изменения масштаба работают как ожидалось.

12. Выйдите из приложения и вернитесь к MainMenu.nib файл в Интерфейсном Разработчике.

    На сей раз Вы пересмотрите пользовательский интерфейс окна путем добавления средств управления изменением масштаба.

13. Измените размер представления изображения так, чтобы вершина представления составила 50 пикселей от вершины окна.

    Вам будет нужно это пространство для помещения средств управления изменением масштаба.

14. Перетащите сегментированное управление от Библиотеки до верхней левой стороны окна.

15. В инспекторе Атрибутов для управления определяет номер сегментов к 4.

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

    Если возможно, необходимо добавить иллюстрации, подобные следующему, проекту XCode так, чтобы можно было использовать значки вместо текстовых меток.

    

17. В инспекторе Размера, набор Размер элемента управления к маленькому.

18. В инспекторе Атрибутов выберите Select Any во всплывающем меню Режима.

19. Перетащите управление от сегментированного управления изменением масштаба до значка Controller. Затем в панели соединений для контроллера щелкнуть doZoom:.

20. Нажмите кнопку Info в окне документа пера. Когда окно MainMenu.nib Info откроется, установите Развертывание всплывающее меню Target в OS X v10.5.

21. Сохраните файл пера.

22. В XCode нажмите Build и Go. Тогда удостоверьтесь, что команды изменения масштаба работают как ожидалось.

    

Добавление инструментов редактирования изображение

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

1. В XCode добавьте файлы образа (Проект> Добавляют к Проекту), подобный следующему, для каждого из режимов инструмента — перемещение, выберите, обрежьте, поверните и аннотируйте.

   Необходимо будет использовать приложение, такое как Adobe Illustrator для создания значков. См. Инструкции по Интерфейсу пользователя OS X для получения информации об использовании значков в интерфейсе.

   

2. Добавьте следующую сигнатуру метода к Controller.h файл:

   - (IBAction)switchToolMode: (id)sender;

3. Добавьте метод к Controller.m файл для обработки установки режима инструмента.

   - (IBAction)switchToolMode: (id)sender

   {

   NSInteger newTool;

   if ([sender isKindOfClass: [NSSegmentedControl class]])

   newTool = [sender selectedSegment];

   else

   newTool = [sender tag];

   switch (newTool)

   {

   case 0:

   [mImageView setCurrentToolMode: IKToolModeMove];

   break;

   case 1:

   [mImageView setCurrentToolMode: IKToolModeSelect];

   break;

   case 2:

   [mImageView setCurrentToolMode: IKToolModeCrop];

   break;

   case 3:

   [mImageView setCurrentToolMode: IKToolModeRotate];

   break;

   case 4:

   [mImageView setCurrentToolMode: IKToolModeAnnotate];

   break;

   }

   }

4. Сохраните Controller.m файл.

5. Откройтесь MainMenu.nib файл.

6. Добавьте подменю к меню Views и назовите его Инструментами.

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

   Элемент	Тег
   Переместиться	0
   Выбрать	1
   Обрезка	2
   Вращаться	3
   Аннотировать	4

8. Перетащите управление от пункта меню Move до значка Controller. Выбрать switchToolMode: в панели соединений для контроллера.

9. Повторите предыдущий шаг для каждого из других элементов в меню Tools.

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

11. В инспекторе Атрибутов, определенном номер сегментов к 5.

12. В инспекторе Размера, набор Размер к маленькому и Ширина к 60.

13. Переключитесь на инспектора Атрибутов.

14. Для каждого сегмента перетащите надлежащий значок от области Media Библиотеки и установите сегмент в авторазмер.

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

15. Выберите Select One из всплывающего меню Режима.

16. Удостоверьтесь, что Выбранный проверяется на Сегмент 1.

17. В Размере инспектор установил распорки Автокалибровки и пружины, таким образом, они смотрят следующим образом:

    

18. Перетащите управление с сегментированного управления на контроллер и соединитесь с switchToolMode: действие.

19. Сохраните файл пера.

20. В XCode нажмите Build и Go. Тогда протестируйте меню Tools и панель инструментов.

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

Поддержка вводных файлов образа

Поскольку это теперь, Ваше приложение открывает файл образа по умолчанию. Это было бы значительно улучшено, если бы это позволило пользователю выбирать изображение кроме значения по умолчанию. Затем Вы запишете открытый метод изображения, вызывающийся, когда пользователь выбирает File> Open. Необходимо обеспечить селектор, вызывающийся, когда закрывается панель Open. Если пользователь выбирает изображение, Ваш openImageURL: метод (который Вы уже добавили к приложению) вызывается.

Выполните эти шаги для поддержки разрешения пользователю открытые файлы образа:

1. Добавьте следующую сигнатуру метода к Controller.h файл:

   - (IBAction)openImage: (id)sender;

2. Запишите открытый метод изображения.

   Метод создает экземпляр NSOpenPanel класс и определяет допустимые расширения файла. Это тогда вызывает метод, показывающий панель Open.

   - (IBAction)openImage: (id)sender

   {

   NSOpenPanel * openPanel = [NSOpenPanel openPanel];

   NSString * extensions = @"tiff/tif/TIFF/TIF/jpg/jpeg/JPG/JPEG/pdf/PDF";

   NSArray * types = [extensions pathComponents];

   [openPanel beginSheetForDirectory: NULL

   file: NULL

   types: types

   modalForWindow: mWindow

   modalDelegate: self

   didEndSelector: @selector(openPanelDidEnd:returnCode:contextInfo:)

   contextInfo: NULL];

   }

3. Запишите селекторный метод, это вызывается, когда завершается панель Open.

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

   - (void)openPanelDidEnd: (NSOpenPanel *)panel

   returnCode: (int)returnCode

   contextInfo: (void *)contextInfo

   {

   if (returnCode == NSOKButton)

   {

   [self openImageURL: [[panel URLs] objectAtIndex: 0]];

   }

   }

4. Сохраните Controller.m файл.

5. Дважды щелкните по значку MainMenu в окне документа пера.

6. Щелкните по меню File, таким образом, Вы видите элементы в нем — Новый, Открытый и т.д.

7. Перетащите управление с пункта меню Open на контроллер и соединитесь с openImage: действие в панели соединений.

8. Сохраните файл пера.

9. В XCode нажмите Build и Go.

   Выберите File> Open и удостоверьтесь, что можно открыть изображение.