Монография2009

21

На рисунке 4 представлена классификация графических языков программирования с точки зрения их применения – в промышленности, в учебных центрах, в исследовательских целях.

Графические языки программирования

Рисунок 4. Классификация графических языков программирования по области применения

При описании CASE-технологий была приведена классификация по уровням. Средства upper CASE позволяют строить модель предметной области, middle CASE предназначены для поддержки этапа проектирования структуры ПО и разработки документации, и так называемые lower CASE включают генераторы кодов (текста программ) на конкретном языке программирования или схемы базы данных на языке SQL. По подобному критерию графические средства поддержки процесса программирования могут быть также разделены на средства (допускающие отклонения от строгой формализации), используемые для лучшего понимания проблемы человеком и документирования, используемые на этапах анализа и проектирования, и средства, позволяющие генерировать управляющую программу или непосредственно графической программе быть исполненной (интерпретированной) некоторой средой выполнения. Классификация по данному признаку приводится на рисунке 5.

Графические языки описания ПО

Рисунок 5. Классификация графических языков по этапам жизненного цикла ПО

Конечно, в случае рассмотрения языков программирования возможность исполнения программы на ЭВМ является достаточно принципиальной. С этой точки зрения к собственно «языкам графического программирования» могут быть отнесены средства, позволяющие

22

программе на графическом языке быть исполненной на конкретной ЭВМ, или быть преобразованной в язык автокода (ассемблера) некоторого компьютера или в программу на универсальном языке программирования, которая затем может быть оттранслирована в машинные коды. Естественно, как правило, графическое описание должно в этом случае быть дополнено (уточнено) для придания ему достаточно строгой формализации, допускающей исполнение на ЭВМ. Такого рода дополнительное описание может представляться в виде таблиц (таблицы ФЛОКС системы ГРАФИТФЛОКС), текстов, XML-файлов, и т.п.

23

4.Системы визуального построения пользовательского интерфейса

Наиболее часто в современных публикациях в популярных журналах и других изданиях ИТ-тематики под «визуальным программированием» понимается возможность интерактивного конструирования графического интерфейса пользователя (GUI) средствами одной из интегрированных сред разработки ПО. У некоторых читателей даже может сформироваться ошибочное мнение, что «визуальное программирование» сводится исключительно к этому.

4.1. Системы визуального конструирования интерфейса на основе компонент

Графический интерфейс пользователя современных программных систем, как правило, основывается на концепции WIMP – windows, icons, menus, pointers (окна, пиктограммы, меню, указатели), а та, в свою очередь, тесно связана с событийным принципом управления. Обычно пользователь имеет дело с некоторой «экранной формой», расположенной в связанном с ней окне многооконной операционной системы, на которой, в свою очередь, находятся те или иные графические «элементы управления», т.е. изображения кнопок, полей ввода, списков альтернатив, и т.п. При этом важнейшим инструментом взаимодействия человека с ЭВМ служит манипулятор «мышь», с помощью которого по экранной форме перемещается указатель, позволяющий выделить в качестве активного тот или иной элемент управления («передать ему «фокус»). После этого при нажатии на кнопку мыши происходит событие, обрабатываемое данным элементом управления в соответствии с задаваемыми программистом правилами.

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

24

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

Описанная идея была одной из первых реализована в интегрированных средах разработки программ Delphi и Visual Basic. Визуально сконструированная форма приложения приводила в них к автоматической генерации реализующего данный графический интерфейс текста программы на базовом языке программирования (соответственно, Object Pascal и Visual Basic). На рисунке 6 представлен пример разработки в системе Delphi. Видна основная экранная форма приложения, насыщенная различными графическими элементами интерфейса, с выделенным элементом – «кнопкой». При этом в окне «Object inspector» отображается таблица свойств данной кнопки, в том числе – надпись, отображаемая на ней пиктограмма, шрифт, и т.д. Ниже в отдельном окне виден текст программы на языке Object Pascal, соответствующий данной форме и сгенерированный средой разработки Delphi автоматически. В верхней части экрана видна панель инструментов, на которой размещены такие элементы GUI, как надписи, диалоговые окна, кнопки, списки, и пр.

В системах, дающих возможность визуального интерактивного конструирования пользовательского интерфейса, реализуется также важный принцип WYSIWYG – What You See Is What You Get, то есть вид формы на этапе разработки соответствует тому, что будет видеть пользователь при работе с готовой программой.

В дальнейшем концепция визуального конструирования программы путем манипуляции графическими образами (пиктограммами) компонент и задании способов обработки связанных с ними событий была развита в Java Beans,

C++ Builder, Visual Age, и пр.

С одной стороны, простейшие программы, сводящиеся к тривиальной обработке событий пользовательского интерфейса (например, отображение тех или иных полей заранее подготовленной БД в соответствующих элементах GUI на форме), действительно могут быть созданы в подобной среде без единой строчки программы, вводимой разработчиком. Необходимо, однако, подчеркнуть, что, действительно ускоряя и делая значительно более удобным построение пользовательского интерфейса, системы типа Visual Basic оставляют «за кадром» все остальные аспекты ПО, в том числе такие базовые, как структуры данных и алгоритмы обработки, которые описываются традиционно – написанием текста программы. Соответственно, они не могут рассматриваться как действительно полноценные системы «визуального программирования».

25

Рисунок 6. Визуальное конструирование графического интерфейса в Delphi Также подобные системы не могут ничем помочь в случае, если в разрабатываемой программе не предполагается иметь графического интерфейса пользователя (консольное приложение, выполняемое в командной строке ОС, или встраиваемая промышленная система). Это, например, относится и к БПО автоматических КА.

VUFC

Довольно своеобразным языком, ориентированным на визуальное конструирование интерфейса, является VUFC [43] - Visual Unix-filter Components. При этом он также с определенной точки зрения может быть отнесен к классу учебных, а с другой точки зрения - к классу систем описания потоков данных. В отличие от традиционных визуальны средств в данной области типа Delphi или JavaBeans, VUFC позволяет для визуальных

26

компонент пользовательского интерфейса задавать достаточно нетривиальные преобразования данных, при этом формируются цепочки подобных преобразований подобно тому, как передаются данные от одной утилиты другой в командной строке ОС UNIX. Философия UNIX предполагает массовое использование утилит (многие из которых носят бесплатный характер, т.е. принадлежат сообществу Open Source) для простой обработки данных и их комбинацию через «каналы» - механизм обмена данными между приложениями, стандартизированный POSIX.

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

Если «упаковать» типовые утилиты UNIX как визуальные компоненты, может быть получен ряд преимуществ:

•порядок обработки данных в «каналах» UNIX может определяться взаимным расположением компонент на форме;

•наличие двух измерений у графики позволяет реализовывать более сложные механизмы передачи данных, чем типовая линейная командная строка UNIX;

•интеграция утилит в графической оболочке позволяет создавать приложения с графическим интерфейсом пользователя, в которых утилиты могут получать данные от широкого спектра стандартных визуальных компонент ввода/вывода;

•командная строка UNIX может рассматриваться как свойство и

может быть графически специфицировано.

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

Подход VUFC основан на трех базовых компонентах:

•Фильтр;

•Соединитель;

•Склейка.

Фильтр – компонент, содержащий стандартную UNIX-утилиту, такую, как sort, cat или wc. Дополнительно компонент позволяет реализовать ряд команд фильтрации. Соединитель – компонент, соединяющий два других компонента. Склейка – соединитель, интегрирующий компоненты VUFC с визуальными компонентами графического пользовательского интерфейса, такими как окно редактирования или выпадающий список. На рисунке 7

28

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

29

5. Учебные языки

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

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

5.1. Scratch

Язык Scratch является одной их вариаций на тему языка программирования Smalltalk, созданного одним из основоположников объектно-ориентированного программирования Аланом Кэем [28]. Основной идеей, положенной в язык Smalltalk, является то, что всё является объектами, обменивающимися сообщениями. Даже типовая управляющая конструкция «условие» языков программирования реализуется в языке Smalltalk, как объект.

При этом Smalltalk представляет собой не просто язык программирования, но и среду исполнения с графическим интерфейсом – в этой области он также был одной из пионерских разработок. При этом для объектов широко используется визуальная метафора – им сопоставляется картинка на экране, которая может при этом вращаться, передвигаться, и т.д. Наглядные свойства объектов, отображаемых визуально на экране в среде исполнения Smalltalk, такие, как цвет, угол поворота, положение, интуитивно хорошо понятны и позволяют легко производить с ними манипуляции, как вручную средствами среды исполнения, так и путем воздействия других объектов (в программе). Данное обстоятельство широко используется при использовании Smalltalk’a для начального обучения детей программированию. В этой связи прежде всего можно назвать такие разработки, как Squeak e-Toys, Scratch).

Остановимся подробнее на учебном визуальном языке Scratch. Он использует среду исполнения Squeak в качестве основы и обучение программированию в нем в буквальном смысле слова происходит, играя. Естественным для этого образом создаваемые программы являются мультимедийными: в них присутствуют звуки, музыка, анимация. На рисунке 9 представлен экран среды разработки Scratch.