Создание графического интерфейса в Visual Studio 2017 (C++)

В интернете можно обнаружить множество роликов, насколько легко было создавать графические приложения в Visual Studio 2010 через "Windows Forms Application". В VS2015 и VS2017 с инструментами для новичков стало сложнее. Создать приложение можно несколькими способами, наиболее простым является через "CLR Empty Project". Статья предназначена для новичков, но предполагает, что читатель уже не испытывает проблем с созданием консольных приложений вида "Hello World". Бесплатную VS Community 2017 можнос скачать с visualstudio.com.

Скриншот панели выбора компонентов для создания графического приложения1. В первую очередь перечислим, какие компоненты должны быть установлены для создания графического приложения на языке С++. Их три, все относятся к разделу "Desktop development with C++":
- VC++ 2017 v141 toolset (x86,x64)
- Windows 10 SDK (10.0.15063.0) for Desktop C++ x86 and x64
- C++/CLI support

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

2. После установки среды разработки переходим
File > New > Project... (^+N)
В появившемся окне отыскиваем Installed > Visual C++ > CLR > CLR Empty Project
Окно выбора типа создаваемого приложения

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

 

3. Необходимо добавить в приложение главную форму. Есть два равносильных пути достижения этой цели.
Первый: в "Solution Explorer" правой кнопкой мыши на названии проекта, во всплывшем контексном меню Add > New Item...
Второй способ: в главном меню выбираем Project > Add New Item...
Или просто нажимаем ^+A
Добавление в программу нового элемента (способ 1)     Добавление в программу нового элемента (способ 2)

 

Во появившемся окне Visual C++ > UI > Windows Form
выбор Windows Form

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

Эта ошибка хорошо известна ещё по Visual Studio 2015. Можете почитать её обсуждение, к примеру, на сайте Microsoft по ссылке1, ссылке2, ссылке3. И более лучшего решения, чем закрывать вкладку, ещё нет. По всей видимости, команда разработчиков Visual Studio не считает эту ошибку достаточно серьёзным делом, чтобы ломать о неё копья.

4. Но мало просто создать форму, нужно вплести её в создаваемую программу. Для этого в "Solution Explorer" правой кнопкой мыши на названии проекта, во всплывшем контексном меню выбрать Properties.
Выбор в контекстном меню элемента Свойства

В открывшемся окне произвести два действия.
Linker > System > SubSystem, из раскрывающегося списка выбрать "Windows (/SUBSYSTEM:WINDOWS)"
Выбор содсистемы (SubSystem)

Linker > Advanced > Entry Point. В пустое поле вписать "main" (без кавычек).
Прописывание точки привязки (Entry Point)

5. В "Solution Explorer" двойным щелчком открыть в редакторе файл MyForm.cpp. Скопировать в него текст

#include "MyForm.h"
using namespace System;
using namespace System::Windows::Forms;
[STAThread]
void main(array<String^>^ args) {
    Application::EnableVisualStyles();
    Application::SetCompatibleTextRenderingDefault(false);
    
Project1::MyForm form;
    Application::Run(%form);
}

Заменив Project1 на название вашего проекта. (Теперь понятно, почему ранее мною не рекомендовалось использовать в названии проекта пробелы?)
код в главной форме

Отлично, всё готово! Теперь проект компилируем и запускаем. Но если у вас ранее выскакивала 0x8000000A, то быстрее всего вам придётся перезапустить Visual Studio и вновь загрузить в нём проект. Далее ошибка ни в чём не проявится.

 

6. Для того, чтобы добавить на нашу только что созданную форму новые элементы, понадобится панель Toolbox. Полезно запомнить горячую клавишу ^!X
Вызов панели Toolbox, также показана сама панель

Работа с размещением элементов на форме сложностей вызвать не должна. Работает здесь всё удобнее, чем wxWidgets в CodeBlocks или wxDev-C++. Никаких глюков мною замечено не было.

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

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

    MessageBox::Show("Hello World",
        "My heading", MessageBoxButtons::OKCancel,
        MessageBoxIcon::Asterisk);

Работающее простейшее графическое приложение, созданное в VS2017

Запускаем и проверяем!

 

Если вдруг не запустится, то первым делом проверяем, что выставлено в раскрывающемся списке Solution Configurations. Он находится на панели инструментов (под главным меню). Там должно быть Release (а не Debug).
Список Solution Configuration, выставленный на Release

 

 

Дополнительная информация

 

Альтернативные способы создания графических приложений в Visual Studio 2017.

1. UWP (Universal Windows Platfrom application) - универсальные приложения, способные запускаться на Windows 10, Windows 10 Mobile и аналогичных самых современных платформах от Microsoft. Платформа разработана как расширение Windows Runtime. Всё бы хорошо, но данные приложения не могут запускаться на более старых версиях Windows, даже на восьмёрке.

2. Windows Desktop Application - примерно то же самое, что в более VS2015 называлось "Win32 Project", а в VS2010 "Windows Forms Application". Технология, которую сейчас можно уже называть устаревшей. В VS2010 это был простой и удобный способ создания графических программ. Но затем ребята из Microsoft решили перетаскивать начинающих разработчиков на более современные технологии. При использовании данного инструмента в VS2015 и в VS2017 приложение создаётся, его можно запустить и посмотреть. Но у этого приложения нет готовой главной формы, куда можно было перетаскивать кнопки и прочие компоненты. Мне не удалось обнаружить в сети ни одного источника, где бы рассказывалось о лёгком способе её создать. Только через длинный код, для получения представления о процессе можете посмотреть видео на msdn.microsoft.com и прочитать соответствующее описание.

 

Пара слов для общего развития о нескольких технологиях, на которые вы будете постоянно натыкаться при чтении документации по разработке GUI в Visual Studio.

ATL (Active Template Library) - набор шаблонных классов языка C++, предназначенных для упрощения написания COM-компонентов.
MFC (Microsoft Foundation Classes) - библиотека объектов, помогающая профессиональным разработчикам создавать десктопные приложения. Что-то вроде более усложнённого и навороченного варианта ATL. ATL и MFC являются хорошими вещами, и с их задействованием также можно создавать графические приложения. Но это инструменты, требующие наличия углублённых знаний тематики.

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

 

Примечания:
В интернете можно наткнуться на заголовок "Full C and C++ IDE with Visual Studio".  Оттуда закачиваются те же самые стандартные дистрибутивы Visual Studio, проверено по контрольным суммам.

"Visual C++ 2017 Build Tools" - это комплект различных Windows SDK и .NET Framework. MFC, ATL и CLI support и ещё пара подобных штук. Все эти инструменты присутствуют и в стандартном загрузчике VS2017.

 

 

P.S.
Теперь можно немного поэкспериментировать с элементами интерфейса. Ниже показан код простейшего графического калькулятора:
Код и внешний вид простейшего графического калькулятора

Код со скриншота

 

 

 

А теперь можно попытаться сотворить что-то более похожее на стандартное window-приложение. Пока простейшее.
Простой стандандартный windows-калькулятор

Код калькулятора:

 

Add new comment

Plain text

  • No HTML tags allowed.
  • Lines and paragraphs break automatically.
  • Web page addresses and email addresses turn into links automatically.