Возврат к графическому интерфейсу, теперь уже с могучим багажом :) начнем с теории. Изучить нам надо такое фундаментальное понятие, как ОБЪЕКТ.

Потому что наряду с визуальным программированием и в неотрывной связи с ним получила широкое распространение концепция ОБЪЕКТНОГО или ОБЪЕКТНО-ОРИЕНТИРОВАННОГО ПРОГРАММИРОВАНИЯ.

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

Компонентная разработка

С помощью систем визуальной разработки программист получил возможность создавать программы из готовых элементов, своеобразных кубиков. При этом возникла возможность создания весьма и весьма сложных приложений и реализации масштабных проектов полностью в визуальных средах. В некоторых случаях вообще удавалось (и удается, как вы уже поняли на практике!) не написать вручную ни одной строчки программного кода. То, что программист делал в визуальной оболочке и проектировщике, автоматически преобразовывалось в готовую программу. Разработчик использовал для этого готовые составные элементы, входящие в состав таких оболочек в большом количестве. Но при этом возникла потребность в эффективном использовании этих составных элементов (доступные в рамках среды, они обычно называются КОМПОНЕНТЫ).

Разработчики быстро поняли удобство применения готовых компонентов в самых разных проектах, а также принялись создавать компоненты для собственных нужд с целью их дальнейшего (ПОВТОРНОГО) использования. Но для этого потребовалось представить эти компоненты в некоем универсальном виде и затем таким же достаточно универсальным способам к ним обращаться. С этой целью практически все системы визуального программирования были дополнены концепцией ОБЪЕКТА.

Объектный подход к составлению программ

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

Возьмем, для примера, калькулятор и посмотрим, как мы могли бы реализовать его функции в виде программы. Калькулятор, как и компьютер, способен хранить некоторые данные и различным способом их обрабатывать (выполнять арифметические и другие действия). То есть он объединяет как ДАННЫЕ, так и СПОСОБЫ ИХ ОБРАБОТКИ, причем эти способы напрямую связаны с данными - числами, введенные человеком. Ведь мы можем складывать только те числа, которые предварительно ввели в калькулятор. Он не может выполнять вычисления над данными, хранящимися например в соседнем компьютере. Поэтому при подготовке нашей условной программы было бы удобно представить калькулятор как некоторый элемент, в котором объединены как данные, которые обрабатываются с его помощью, так и способы обработки этих данных, называемые в программировании МЕТОДАМИ.

Сочетание данных и методов для их обработки в одном понятии называется ОБЪЕКТОМ. С помощью технологий объектного (или объектно-ориентированного) программирования разработчик создает в программе (и затем различными способами эксплуатирует) объекты, отображающие как понятия реального мира, так и различные абстрактные концепции. В частности, калькулятор, представленный в виде объекта, будет сочетать небольшой объем однозначно перенумерованных ячеек памяти (переменных, моделирующих регистры) и набор методов их обработки - например простых арифметических операций между регистрами.

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

Свойства и методы объекта

Компоненты, использующиеся в средах визуального программирования, на самом деле представляют собой объекты. Все они имеют некий внутренний объем ячеек памяти (собственных переменных, называемых иногда ПОЛЯ) и дополнительно позволяют выполнять различные действия над этими переменными (хранящимися в них значениями).

Рассмотрим такой стандартный компонент, как кнопка. Какие данные могут в нем храниться, если он реализован в виде объекта? Это размеры кнопки, ее местоположение на экране, показываемый на ней текст, цвет и форма кнопки и другие характеристики. Для каждой из этих характеристик внутри объекта отведена одна или несколько ячеек памяти (полей, переменных).

Подобные именованные характеристики (размер, цвет), связанные с конкретными значениями, хранящимися в рамках объекта, называются ПОЛЯМИ или СВОЙСТВАМИ этого объекта.

А какие у объекта кнопка могут быть методы? Метод нажатия на кнопку изменяет ее состояние, метод "изменить текст надписи" изменяет видимое на кнопке название. Могут быть методы для изменения ее размеров, формы и так далее.

У объекта "Калькулятор" может быть несколько свойств, связанных со значениями его регистров (например "Регистр А", "Регистр D"), а функции сложения и вычитания значений, хранящихся в этих регистрах, возьмут на себя соответствующие методы.

Свойство объекта имеет фактически тот же самый смысл, что и переменная. Только каждое свойство дополнительно привязано к конкретному объекту. Свойство "Надпись" кнопки ОК совпадает по названию со свойством "Надпись" кнопки Cancel, но хранит конечно другое значение.

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

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

На этом теоретическая часть закончена :)

Учимся бросать кубик

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

Как может выглядеть рабочее окно такого приложения? Допустим, на нем будут кнопка и поле-надпись. При нажатии на кнопку в поле-надписи будет показываться очередное случайное значение в диапазоне от одного до шести.

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

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

Таким же образом помещается на форму и поле-надпись, предназначенное для вывода текстовых сообщений. Оно называется Label и применяется только в информационных целях - исключительно для вывода информации. Пользователь не может выполнять никаких действий с таким полем (только смотреть на него можно :).

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

Отметим, что пока мы не написали ни одной строчки кода. А все вспомогательные работы, связанные с преобразованием проектируемой нами формы в полноценное Windows-приложение (исполнимый EXE-фай), берет на себя среда разработки. В дальнейшем к нашей форме - также автоматически - будет привязываться и программный код, который мы напишем для расширения функциональных возможностей программы.

Исследуем возможности дизайнера форм

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

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

Если форма создавалась в том порядке, который описывался выше (сначала на нее была помещена кнопка, а затем поле-надпись), то последний элемент - поле-надпись Labell и остается активным. Соответственно он будет выделен с помощью такой рамки.

При желании можно сделать текущей (активной, выделенной) и кнопку на форме. Для этого достаточно один раз щелкнуть на ней мышкой. При этом рамка, охватывавшая поле-надпись, пропадет, а появится - вокруг кнопки. Если теперь подвести курсор к одному из маркеров, то он (курсор) сменит свой вид в зависимости от маркера - превратится в двойную стрелку и начнет пульсировать. Тем самым Delphi подсказывает, что мы можем изменить в предлагаемых направлениях размер текущего выделенного элемента.

Для такого изменения достаточно нажать левую кнопку мыши и отвести ее в сторону, не отпуская. Вместе с курсором будет изменяться и размер элемента. Как только левая кнопка мыши будет отпущена, Delphi зафиксирует новый размер элемента. Такой прием называется ПРОТЯГИВАНИЕ.

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

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

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

Инспектор объектов

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

При желании эти надписи можно легко изменить. Для этого придется воспользоваться уже знакомым Инспектором объектов.

Инспектор - одно из важнейших окон при работе в дизайнере. С его помощью настраиваются всевозможные свойства объектов, используемых в программе, а также возможные реакции программы на различные действия пользователя с этими элементами управления. Как уже говорилось, многие составляющие части программы (прежде всего элементы управления) представляют собой объекты. Они характеризуются наборами свойств и методами, вызываемыми в различных ситуациях. Так, у каждого элемента управления есть обязательно свойство Name, с помощью которого можно определить название этого объекта (на самом деле это название будет названием переменной в тексте программы, по которому к нему можно обращаться!). А текстовую надпись элемента можно задавать с помощью свойства Caption. Некоторые свойства существуют практически у всех элементов управления, а некоторые - специфичны, так как предназначаются для определения конкретных особенностей работы определенного элемента управления.

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

Надпись (или основное текстовое содержимое) многих элемента управления хранится в свойстве Caption. Выделим на форме кнопку и найдем в Инспекторе (в левом столбце) это свойство и изменим ее на новое значение, например "Бросок кубика".

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

Не исключено, что такое длинное название не поместится полностью на кнопке. Тогда надо просто изменить её размер вышеописанным способом - растянуть, сделать пошире.

А что показывать в поле-надписи в качестве начального значения? Ведь пока бросок виртуального кубика (он будет выполняться по нажатию на кнопку) не будет выполнен, показывать сразу после запуска программы нечего. То есть нам надо записать в свойство Caption элемента управления Label1 пустую строчку. Для этого сделаем активной на форме поле-надпись, щелкнув на ней мышкой, затем перейдем в Инспектор найдем там свойство Caption и в правой части этого окна укажем пустую строчку.

Для полноты картины изменим и надпись на заголовке формы. Для этого сделаем активной саму форму, и в ее свойстве Caption введем строку "Виртуальный кубик".

Надпись в свойстве Caption формы связана с надписью, показываемой в качестве ее заголовка в дизайнере. Первоначально текст этого заголовка совпадает с исходной строкой Form1 (исходное значение свойства Caption), заданной по умолчанию . При желании можно также изменить размеры главной формы с помощью рамки и маркеров выделения.

Изучаем новые свойства

Рассмотрим другие наиболее часто встречающиеся свойства элементов управления, используемые в Delphi. В зависимости от своего предназначения свойства могут быть представлены в окне свойств в самых разных видах. Например, свойства, диапазон значений которых невелик, нередко представляются в виде выпадающего списка, в котором перечислены все эти значения и из них достаточно выбрать наиболее подходящее. К таким свойствам относится в частности Color (цвет элемента). Его можно задать как для любого элемента управления на форме, так и для самой формы. При этом в списке возможных значений в дополнение к названию цвета также показывается небольшой прямоугольник, закрашенный соответствующим цветом - в правой части выпадающего списка значений окна свойств.

Свойство BorderStyle (стиль границ) позволяет задать внешний вид границ элемента на форме (или самой формы). Такие границы могут отличаться от элемента к элементу, а у некоторых элементов (например, кнопки) просто отсутствовать.

Свойство PopupMenu (контекстное меню) позволяет привязать составленное разработчиком локальное меню к некоторому элементу - оно будет вызываться при щелчке на нем правой кнопкой мыши. Пока в выпадающем списке значений такого свойства любого из элементов, которые мы к данному моменту разместили на форме, ничего нет. Это и неудивительно - ведь мы пока не подготовили соответствующий элемент меню, который можно привязать к выбранному объекту. Как это делать, будет рассказано немного позже.

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

Полезное свойство Enabled (включено) позволяет делать различные элементы временно недоступными для пользователя. Это свойство имеет логический тип Boolean и соответственно может принимать одно из двух значений True или False. Когда выбрано значение False, пользователь не сможет взаимодействовать с этим элементом управления - не сможет нажимать на кнопку, переключать переключатель, выбирать пункт меню и так далее. Но сам элемент на форме будет виден, только возможно в некотором "пассивном" виде .

Свойство Visible определяет видимость элемента на экране. Если его значение равно True, то, хотя такой элемент будет виден в дизайнере, в рабочей скомпилированной программе он виден не будет. Но это свойство надо отличать от свойства Enabled, которое, будучи переведенным в состояние False, хотя и делает элемент недоступным пользователю для воздействия, тем не менее сохраняет его видимым в окне . А свойство Visible может просто сделать элемент невидимым .

С помощью свойства AutoSize можно задать автоматическую подстройку размеров элемента под длину содержащегося в нем текста . Данное свойство востребовано прежде всего в элементах вроде поля-надписи и имеется не у всех элементов, а преимущественно у тех, которые применяются для обработки и отображения текста. Сейчас мы ввели в свойство Caption поля-надписи пустую строку, в результате оно как бы исчезло из дизайнера (совсем съежилось :). Чтобы этого не происходило, значение свойства AutoSize можно перевести в false.

Вложенные свойства

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

На самом деле вложенные свойства представляют собой другие объекты и элементы управления. Когда мы обращаемся к такому вложенному объекту, то в окне свойств на дополнительном уровне просто показываются свойства этого объекта. Типичный пример такого свойства, часто вкладываемого в другие объекты - свойство Font (шрифт). Если выделить в дизайнере поле-надпись и раскрыть данное свойство, то можно увидеть более подробно, из каких свойств оно на самом деле состоит.

В поле Name, относящемся к шрифту, можно подбирать подходящий профиль шрифта. С помощью свойства Size - задавать его размер, с помощью свойств Bold и Italic (они в свою очередь вложены в свойство Style!) - делать шрифт жирным или наклонным и так далее. При этом, как видно, названия различных свойств обычно точно отражают их предназначение и совпадают где возможно с названиями, принятыми в различных популярных прикладных программах в качестве стандартных обозначений.

Свойство Color (цвет шрифта) определяет, каким цветом будут показываться надписи, сделанные на элементе управления. Так, если мы хотим изменить цвет нашей кнопки на светло-зеленый, цвет шрифта надписи на кнопке - на темно-красный, а сам шрифт сделать жирным, то для этого надо выбрать в свойстве Color кнопки, свойстве Color свойства Font кнопки и свойстве Bold свойства Style свойства Font кнопки подходящие значения.

Свойства Left и Top определяют местонахождение элемента на форме (координаты на форме левого - верхнего угла элемента). Свойства вложенных Width (ширина) и Height (высота) задают размер элемента.

Ряд других свойств будет рассмотрен далее по мере составления программ-примеров . Отметим только еще одно полезное свойство Position, которое реализовано лишь для формы. Оно позволяет определить, к каком месте экрана будет показана соответствующая форма при ее открытии (после запуска скомпилированной программы). Position может принимать одно из следующих значений:

poDesigned Форма показывается на экране в точности в той позиции, в какой она находилась на экране при ее подготовке в дизайнере
poDesktopCenter Форма центрируется по отношению к краям рабочего стола (мое самое любимое :)
poScreenCenter Форма центрируется по отношению к краям экрана
poDefaultPosOnly Форма показывается в месте, установленном в Windows по умолчанию
poDefault Форма показывается в месте, установленном в Windows по умолчанию, а размеры окна также принимаются равными с установленными в Windows по умолчанию
poOwnerFormCenter Форма центрируется по отношению к родительскому окну (если, конечно, оно есть)

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

В Borland C++Builder все точно так же.

В Visual Studio отличия минимальные, в основном в названиях свойств. Это конечно если вы используете версию .NET, где можно и на Бейсике, и на Си++ делать графические приложения.

Вместо инспектора объектов - окно свойств (вызывается по F4). Панель компонентов называется панель инструментов (слева расположена). Вместо Caption - свойство Text. Вместо Color - ForeColor и BackColor. Вместо Left/Top и Width/Height - составные Location и Size. Вместо Position - StartPosition.

Школа программирования с нуля
http://russianenterprisesolutions.com/sbo/

Все предыдущие выпуски базового курса тут:
http://russianenterprisesolutions.com/sbo/base.htm