Рис. 21.7. Окно Interlace Builder MainWindow.xib

В окне под заголовком Window показан макет главного окна iPhone. Поскольку мы еше ничего не создали для окна iPhone, оно является пустым (рис. 21.8).

Сначала зададим черный цвет для окна iPhone. Для этого щелкните внутри окна под заголовком Window и выберите пункт Inspector в меню Tools (Сервис). Появится окно Inspector (рис. 21.9).

Убедитесь, что окно Inspector называется Window Attributes (Атрибуты окна), как на рисунке 21.9. Если это не так, щелкните на левой вкладке в полосе вкладок, чтобы отобразить нужное окно.

В секции View (Вид) этот окна имеется атрибуте именем Background (Фон). Дважды щелкните внутри белого прямоугольника рядом с меткой Background. Появится указатель цветов. Выберите черный цвет из этого указателя. Цвет прямоугольника рядом с атрибутом Background изменится на черный (рис. 21.10).

Окно Window, представляющее окно отображения iPhone, тоже будет иметь черный цвет (рис. 21.11).

Теперь можно закрыть окно цветов Colors.

Для создания нового объекта в окне интерфейса iPhone нужно щелкнуть на объекте в окне Library и перетянуть его в ваше окно iPhone. Щелкните и перетяните элемент Label (Метка). Отпустите кнопку мыши, когда метка окажется наверху примерно посередине окна (рис. 21.12).

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

Рис. 21.8. Окно iPhone в Interface Builder

Рис. 21.9. Окно Inspector в Interface Builder

Рис. 21.10. Изменение цвета фона окна

Рис. 21.11. Изменение цвета окна интерфейса на черный цвет

Рис. 21.12. Добавление метки

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

Теперь зададим некоторые атрибуты для этой метки. Щелкните на метке, которую вы только что создали, чтобы выделить ее (если она еще не выделена). Отметим, что окно Inspector автоматически изменяется, чтобы вы получали информацию о текущем выбранном объекте в вашем окне. Нам не нужно, чтобы текст по умолчанию появился в этой метке, поэтому измените значение Text на пустую строку, то есть удалите текст Label из текстового поля, показанного в окне Inspector.

Для атрибута Layout (Компоновка) выберите Right-justified (Выравнивание справа) среди вариантов выравнивания (Alignment). И, наконец, измените цвет фона (background) для метки на синий так же, как изменили цвет фона окна на черный. Ваше окно Inspector должно быть похоже на рис. 2I.I3.

Теперь изменим размер метки. Вернемся к окну Window и изменим размер метки, растянув ее углы и стороны. Измените размер и местоположение метки, чтобы она выглядела, как на рисунке 21.14.

Теперь добавим в этот интерфейс кнопку. Из окна Library перетяните объект Round Rect Button в ваше окно интерфейса, поместив его в нижний левый угол окна (рис. 21.15). Метку на этой кнопке можно изменить одним из двух способов: дважды щелкнуть на кнопке и затем ввести нужный текст или ввести текст в поле Title (Заголовок) в окне Inspector. При любом способе сделайте так, чтобы ваше окно было похоже на показанное на рисунке 21.15.

Рис. 21.13. Изменение атрибутов метки

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

У нас также есть кнопка с меткой 1, для которой нужно задать вызов метода clickl: при каждом нажатии этой кнопки. Этот метод задаст значение 1 для текстового поля на дисплее. А поскольку эта переменная будет связана с данной меткой, метка будет изменяться. Приведем ниже последовательность, которую нужно задать.

Пользователь нажимает кнопку с меткой 1.

По этому событию вызывается метод dickl:.

Метод clickl: изменяет текст переменной экземпляра display на строку 1.

Поскольку объект DILabel display связан с меткой в окне iPhone, текст этой метки изменяется на соответствующее текстовое значение, равное 1.

Рис. 21.14. Изменение размера и местоположения метки

Рис. 21.15. Добавление кнопки в интерфейс

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

Сначала свяжем кнопку с методом IBAction clickl:. Для этого удерживайте нажатой клавишу Control во время щелчка на этой кнопке и затем протяните синюю линию, которая появится на экране, к кубику делегата приложения (AppDelegate) в окне MainWindow.xib, как показано рис. 21.16.

Когда вы отпустите кнопку мыши над кубиком делегата приложения, появится раскрывающееся меню, где можно выбрать метод IBAction для привязки к кнопке. В данном случае имеется только один такой метод (с именем clickl:), и он появится в этом раскрывающемся меню. Выберите этот метод, чтобы создать привязку (рис. 21.17).