What Is a GUI (Graphical User Interface)?

This type of design makes using your computer easier

GUI stands for graphical user interface and is pronounced GOO-ee or gooey. A GUI contains graphic elements such as windows, menus, icons, and links that you select when you’re working with an operating system, software application, or mobile app.

Command-Line Interfaces Ruled Past Computer Interaction

To really appreciate GUI design, it helps to know what preceded it. Before GUI was commonly used, computer screens only displayed plain text and were controlled by a keyboard. Interactions with the computer were typed into a command line. So, instead of dragging and dropping a file to move it, users typed the command name, the name of the file to be moved, and the destination directory. Users had to memorize the commands required to perform these and many other functions.

GUI: A Visual Revolution

A GUI is very different. Rather than being text-based, it’s visually based, making the computer much easier to use. When operating systems and applications incorporate a GUI, commands, and actions are performed through direct manipulation of the graphical elements on the screen. Within GUIs, the following types of interface elements are commonly used:

• Windows displays information on the screen. Applications, web pages, and documents all open in windows. Windows can be moved, resized, and placed in front of each other.
• Menus offer lists of actions to choose from. They arrange the commands available in an application into logical groups.
• Input controls enable users to select one or more options from a list. Input controls include checkboxes, option buttons, dropdown lists, toggles, text fields, and date and time pickers.
• Navigational components enable users to move from place to place within the interface. Examples include breadcrumbs, sliders, search boxes, pagination, and tags.
• Informational components inform users of the status of a task. Examples include notifications of incoming messages, progress bars, tooltips, and pop-up windows.

Users select one or a combination of the above elements by pressing keys on a keyboard, clicking with a mouse, or tapping on the screen. These actions make it simple to start applications, open files, navigate websites, and perform other tasks.

These GUI elements provide consistent visual indications of the tasks that can be performed within an application. They also make learning new applications more comfortable.

History of GUI

In 1981, Xerox introduced PARC, the first GUI. Apple founder Steve Jobs saw it during a tour of Xerox and released a GUI-based operating system for the Macintosh in 1984. Microsoft followed in 1985 with Windows 1.0.

These GUI-based programs were controlled with a mouse pointer that moved around the screen when users moved a physical mouse. It was the beginning of point-and-click. This shift meant users no longer had to learn a long list of commands to operate a computer. Every command was represented in a menu or by an icon on the screen.

By 1990, GUIs began to look more like those used on modern devices.

In the early 2010s, new input types, such as swipe and pinch commands, were added to GUI capability to accommodate the growing mobile market. Computer GUIs now also accept input from joysticks, light pens, cameras, and microphones. Even newer model cars use GUIs in conjunction with button controls.

How can I do GUI programming in C? [closed]

I want to do Graphics programming in C. I had searched a lot about the compiler that provides a rich set of functions for doing GUI programming in C, but I couldn’t find anything.

Basically I want to draw buttons and then accept the choice from the user and take an appropriate action. It would be helpful if you can suggest a C compiler, or a library that I can add to my compiler. I am working on the Windows operating system.

Presently, I am using TURBO C compiler that does not support direct methods for creating buttons. Any help would be appreciated.

6 Answers 6

This is guaranteed to have nothing to do with the compiler. All compilers do is compile the code that they are given. What you’re looking for is a GUI library, which you can write code against using any compiler that you want.

Of course, that being said, your first order of business should be to ditch Turbo C. That compiler is about 20 years old and continuing to use it isn’t doing you any favors. You can’t write modern GUI applications, as it will only produce 16-bit code. All modern operating systems are 32-bit, and many are now 64-bit. It’s also worth noting that 64-bit editions of Windows will not run 16-bit applications natively. You’ll need an emulator for that; it’s not really going to engender much feeling of accomplishment if you can only write apps that work in a DOS emulator. 🙂

Microsoft’s Visual Studio Express C++ is available as a free download. It includes the same compiler available in the full version of the suite. The C++ package also compiles pure C code.

And since you’re working in Windows, the Windows API is a natural choice. It allows you to write native Windows applications that have access to the full set of GUI controls. You’ll find a nice tutorial here on writing WinAPI applications in C. If you choose to go with Visual Studio, it also includes boilerplate code for a blank WinAPI application that will get you up and running quickly.

If you really care about learning to do this, Charles Petzold’s Programming Windows is the canonical resource of the subject, and definitely worth a read. The entire Windows API was written in C, and it’s entirely possible to write full-featured Windows applications in C. You don’t need no stinkin’ C++.

That’s the way I’d do it, at least. As the other answers suggest, GTK is also an option. But the applications it generates are just downright horrible-looking on Windows.

EDIT: Oh dear. It looks like you’re not alone in wanting to write «GUI» applications using an antiquated compiler. A Google search turns up the following library: TurboGUI: A GUI Framework for Turbo C/C++:

If you’re another one of those poor people stuck in the hopelessly out-of-date Indian school system and forced to use Turbo C to complete your education, this might be an option. I’m loathe to recommend it, as learning to work around its limitations will be completely useless to you once you graduate, but apparently it’s out there for you if you’re interested.

Windows GUI C++ Programming

I want to learn C++ GUI programming using Visual Studio 2008. I’m not sure where to start though. I learned C++ in high school, but not GUI. I’ve been doing C# for about 3 years now and thats how I «learned» GUI programming. Now I want to learn how to write GUI’s without the use of the .NET framework, so where do I start?

7 Answers 7

MFC is almost outdated now. I would recommend to use WTL instead .

Well it is also not a good idea just to start programming for GUI in C++ when there are so many good frameworks available like QT cross platform framework.

Charles Petzold’s «Programming Windows 5th Edition» is the Bible for Windows programming.

Since you say you’ve been doing C# GUI programming for about 3 years, I’ll assume that means Windows Forms. One way to dip your toe in the water is to remember that WinForms is really just an object-oriented wrapper around user32 . So load up Reflector and take a look at the way some of the controls are implemented. You’ll see that these strange messages like WM_PAINT and WM_KEYDOWN are pumped to the WndProc of the various controls by Windows. In plain old Win32 or MFC programming, the same thing is still going on. Doing this will let you slowly peel back the layers of the onion; you’ll get a better feel for how Windows Forms works, too. From there, I’d recommend picking up Programming Windows by Petzold; it’s old, but the native APIs in Windows don’t move around that much. Have fun!

Some heretical opinions.

I wouldn’t recommend C++ for writing complex Windows GUIs — language/library combos like C# or Delphi are so much more productive. If you want to get into C++ programming I’d suggest using it to write a multi-threaded server of some sort — a simple Web server would do for starters.

And if you really want to understand the underlying Windows APIs, I think there is something to be said for writing a simple application (like, say, a simplified version of notebook) in C (not C++). You’ll only want to do it once, but you will learn a lot in the process.

And before anyone starts madly down-voting, let me say that I am a C++ programmer of over 20 years standing, and really love the language.

Универсальный GUI

Введение

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

Кроме того, в связи с бурным распространением интернета популярным направлением разработки ПО стала разработка веб-приложений или веб-сервисов. Веб-приложение является полезным дополнением к клиентской прикладной программе (приложению). Обычно веб-приложение даёт возможность удалённого использования мониторинговой системы. Это означает, что пользователь не привязан к месту расположения аппаратной части мониторинговой системы и может использовать её из любой точки мира, где есть рекомендуемое интернет-соединение. Важно заметить, что разработка веб-приложений в значительной степени отличается от разработки клиентских приложений и это в свою очередь создаёт некоторые проблемы. В частности, это проблема создания универсального графического интерфейса пользователя (GUI). Чтобы клиентское приложение и веб-приложение были реализованы в едином графическом стиле, необходимо приложить достаточно усилий как разработчику интерфейса клиентского приложения, так и разработчику интерфейса веб-приложения. В конечном счёте величина усилий одного или другого разработчика будет зависеть от того, интерфейс какого приложения будет задавать общий стиль.

Современные способы построения интерфейсов

Рассмотрим наиболее популярные в настоящий момент способы построения интерфейсов клиентских приложений на языке C++, как наиболее используемом для разработки ПО, для ОС Microsoft Windows (MS Windows) и ОС Linux. Главным средством разработки ПО для MS Windows является MS Visual Studio [1]. Эта интегрированная среда разработки (IDE) позволяет разрабатывать ПО на разных языках программирования, но основными языками, конечно, являются C++ и C#. Для разработки интерфейса приложения имеются два основных средства — Windows Forms (WinForms) и Windows Presentation Foundation (WPF). Большая часть существующих приложений для MS Windows разработана с использованием WinForms, однако с появлением более современных версий ОС (MS Windows 7, 8), система WPF становится более популярной. Кроме того, последние версии MS Visual Studio позволяют использовать язык разметки HTML5 для построения интерфейсов, близких по стилю к нативным веб-приложениям. Однако стоит заметить, что коммерческая лицензия MS Visual Studio является платной, как и лицензия MS Windows, что несомненно является недостатком для низкобюджетных проектах.

Если говорить о низкобюджетных проектах, то тут наиболее подходящим вариантом является ОС Linux. Помимо того, что большинство дистрибутивов этой ОС являются абсолютно бесплатными, в том числе и для коммерческого использования, также имеется ряд бесплатных средств для разработки качественного ПО для ОС Linux. Самым распространённым средством для разработки ПО на языке С++ является кроссплатформенный инструментарий Qt [2]. Важно подчеркнуть, что Qt позволяет разрабатывать приложения не только для ОС Linux, но и для MS Windows, Mac OS X, Android и других UNIX-подобных ОС. Разработчики Qt предлагают как бесплатную для коммерческого использования, так и платную лицензию с дополнительными возможностями. Но исходя из современной практики разработки ПО с помощью этого инструментария, бесплатной лицензии оказывается больше чем достаточно.

Если проводить аналогию с MS Visual Studio, то в Qt мы имеем IDE Qt Creator. Здесь альтернативой WinForms являются так называемые виджеты (Qt Widgets), а альтернатива для WPF — Qt Quick. Также в Qt Creator имеется возможность создания интерфейсов на основе HTML5. Но наиболее интересным модулем инструментария является встраиваемый веб-движок WebKit, который лежит в основе всех современных веб-браузеров. Подобный модуль имеется и в MS Visual Studio, но он имеет ряд ограничений, и тем более нас больше интересуют низкобюджетные средства, которые позволяют уменьшить издержки при создания программного продукта. Веб-движок — это ядро браузера, он отвечает за правильное отображения веб-страниц. Модуль Qt WebKit позволяет создавать интерфейс клиентского приложения с использованием техники разработки интерфейсов веб-приложений. В основе создания интерфейса веб-приложения лежит устоявшийся стек технологий. Он включает язык разметки HTML (HTML 4, 5), каскадные таблицы стилей (CSS 2, 3) и скриптовый язык JavaScript с богатым выбором дополнительных библиотек (каркасов). Отдельного внимания заслуживает тот факт, что скорость появления новых полезных каркасов для языка JavaScript стремительно растёт, а это делает разработку, насыщенных функционалом приложений, более быстрой и удобной.

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

Традиционный способ: Qt WebKit + Qt-костыли

Рассмотрим традиционный способ создания универсального GUI с помощью модуля Qt WebKit на примере модуля визуализации данных системы акустического мониторинга, разрабатываемой в рамках кандидатской диссертационной работы [3]. Под системой акустического мониторинга подразумевается система, включающая аппаратную и программную части. Аппаратная часть системы состоит из сенсорной сети акустических датчиков, данные с которых обрабатываются на микроконтроллере и отправляются по какому-либо интерфейсу (UART, IEEE 802.X и др.) на персональный компьютер (ПК). Программная часть состоит из набора прикладных программ, работающих как на локальном ПК (клиентское ПО), так и на удалённом сервере (серверное ПО).

Традиционный метод подразумевает использование межпроцессного

Рис. 1. Традиционный метод реализации универсального GUI

взаимодействия по средствам встроенного механизма Qt. Здесь подразумевается взаимодействие между основной логикой клиентского приложения, изображённой на рис.1 как Обработчик данных, и GUI-элементом. Одним из недостатков такого подхода является то, что код для реализации GUI на языке JavaScript будет иметь специфические функции, которые будут актуальны только для клиентского Qt-приложения. Для серверного приложения, отвечающего за GUI, нужен будет другой, специфичный для серверной реализации, код. Например, в случае использования PHP-скрипта для реализации основной логики серверного приложения, понадобится реализация межпроцессного взаимодействия с помощью какой-либо другой технологии (AJAX или WebSocket). Отсюда следует ещё один недостаток, а именно использование дополнительного языка программирования для реализации основной логики серверного приложения и разработка нового алгоритма межпроцессного взаимодействия.

Более интересный подход: Qt WebKit + WebSocket

Для решения этих проблем предлагается новый метод, основанный на использования упомянутой выше технологии WebSocket. Суть метода заключается в том, чтобы унифицировать метод межпроцессного взаимодействия между основной логикой приложения и GUI, как на клиентской стороне, так и на серверной. В этом случае появляется возможность использования JavaScript кода для реализации универсального для обеих сторон GUI.

Рис. 2. Новый метод реализации универсального GUI

На рис. 2. видно, что теперь для межпроцессного взаимодействия, как для клиентской, так и для серверной части используется технология WebSocket. То есть теперь мы имеем один универсальный JavaScript код для разных приложений. В этом случае необходимым условием является серверное приложение, основная логика которого реализована с помощью Qt, на не совсем привычном для веб-разработчиков, языке C++. С одной стороны такой подход к реализации серверного приложения усложняет задачу для узкоспециализированного веб-разработчика. Но с другой стороны мы имеем универсальные части кода, которые позволяют нам сэкономить время на дублировании одних и тех по смыслу алгоритмов на разных языках. Важно также подчеркнуть, что для использования технологии WebSocket необходима дополнительная библиотека, которая имеется в интернете в свободном доступе или включается по умолчанию в более поздние версии Qt.

Рис. 3. Локальное (справа) и серверное (слева) приложения, запущенные на ОС Ubuntu 14.04

На рис. 3 приведён пример реализации нового метода создания универсального GUI для ОС Ubuntu 14.04. Как видно на рисунке, в конечном итоге мы получаем универсальный интерфейс, как для локального приложения, запущенного в качестве исполняемого файла ОС, так и для серверного приложения, запущенного в современном веб-браузере. Так как для разработки ПО используются кроссплатформенные инструменты, это позволяет говорить о простой переносимости программного продукта на другие ОС в будущем.