Как создать графический интерфейс в Visual Studio?
Здравствуйте, скажите пожалуйста, как в Visual Stodio создавать свой графический интерфейс, может быть есть какие-нибудь программы для этого, я просто плохо знаю Photoshop.
94731 / 64177 / 26122
Регистрация: 12.04.2006
Сообщений: 116,782
Ответы с готовыми решениями:
Как в Visual Studio Code компилировать java файлы через графический интерфейс?
Как можно по простому добавить эту возможность? Не хочу лезть в дебри редактора, чтобы вручную.
Графический конструктор как в Visual Studio
Ребята, всем привет! Вот столкнулся с задачей — нужно написать похожую штуку, как в VS. Типа.
Как создать графический интерфейс к програме?
Нужно создать графический интерфейс к этой програме, заранее спасибо за помощь. import.

Как создать графический интерфейс для приложения
Здравствуйте! Недавно закончил написание программы на Си, но у неё нет графического интерфейса.
Как создать графический интерфейс в c visual studio
Доброго времени суток! В этом уроке мы создадим Ваше первое приложение с графическим интерфейсом в MS Visual Studio. Это будет своего рода «Hello World» для графических приложений. Скажу сразу, что использование Windows Forms — не единственный способ создания графических приложений (приложения с графическим интерфейсом пользователя) для C# программистов, но начать изучение лучше именно с этого. И так, запускаем Visual Studio.
Запустили? Тогда к делу! Идем в главное меню и выбираем пункт «Файл — Создать — Проект», как показано на рисунке ниже.

Создание нового проекта
В появившемся окне:
- в левой части выбираем «Шаблоны — Visual C# — Windows»;
- в основной области выбираем элемент «Приложение Windows Forms»;
- в нижней части окна вводим имя проекта и указываем его расположение на диске.
В общем, как показано на рисунке ниже.

Опции создания проекта
Указали что нужно? Тогда нажимайте на кнопку «OK». Теперь вы должны увидеть примерно следующее (основные области выделены прямоугольниками):

Только что созданный проект
На рисунке выше, я обозначил основные области: область дизайнера (слева вверху), область обозревателя решений (справа вверху) и область свойств (справа внизу). С этими областями, мы будем работать чаще всего.
В области дизайнера, сейчас располагается пустая «форма», это так называемое окно, в данном случае, главное окно нашей программы. В области свойств, отображаются свойства выделенного в дизайнере элемента, в данном случае, нашей формы, ну а область обозревателя решений, содержит файлы проекта, в том числи, относящиеся и к формам (окнам) программы. А теперь, давайте немного изменим нашу форму, и запустим это первое приложение.
Для этого, выделим в дизайнере форму (для этого, можно просто кликнуть левой кнопкой мыши по форме) и перейдем в блок свойств, в котором найдем строку «Text» (слово текст, ищем в левом столбце), как показано на рисунке ниже.

Свойство «Text» основной формы приложения
Обратите внимание, в левом столбце указано имя (название свойства), а в правом — его значение.
В данном случае, мы имеем дело с текстовым свойством, и его значение, отображается в заголовке окна, так что, давайте теперь укажем там что-то свое, например, что-то вроде: «Главное окно», как показано на рисунке ниже:

Установка свойства формы
Теперь, можно собрать проект и запустить. Для этого идем в главное меню и выбираем пункт «Сборка — Собрать решение». А потом запускаем приложение, для этого выбираем пункт «Отладка — Запуск без отладки» в главном меню. В результате Вы должны увидеть окно следующее окно.

Окно первого графического приложения
В следующем уроке, мы рассмотрим простую работу с дизайнером форм, и настройку элементов графического интерфейса, а на этот урок подошел к концу, мы создали первое графическое приложение, собрали и запустили его.
C/C++ — создание графического интерфейса
Так вот, немного пошарил в нете, понял что есть такие штуки, как WinForms и WPF. Еще так же есть вариант winAPI. И вот тут у меня ступор — где, что и как? Помогите разобраться, какие технологии применяются для создания интерфейсов с пом.С++ в MSVS; что лучше использовать на сегодняшний день? А так же посоветуйте нормальную литературу на этот счет.
Проект в рамках университета (небольшая программка по электротехнике для расчета всяких величин по заданой схеме), если это важно.
И все же повторюсь в своем вопросе: что нужно знать и что нужно изучать, что бы начать писать GUI на С++ с пом. Visual Studio?
Отслеживать
20.2k 6 6 золотых знаков 37 37 серебряных знаков 81 81 бронзовый знак
задан 28 апр 2014 в 12:27
hamsternik hamsternik
521 3 3 золотых знака 9 9 серебряных знаков 29 29 бронзовых знаков
На сегодняшний день лучше вообще не писать графические интерфейсы на C/C++. А для обучения при первой же возможности надо уходить с винды. Если требуют курсач с MSVS, но можете сменить тему курсача на что-нибудь неграфическое — меняйте.
28 апр 2014 в 12:35
WPF — это вообще не про С++. Winforms в общем-то тоже, хотя завести его на С++ можно. Правда, если мне не изменяет память, это будет С++/CLI, что далеко не то же самое, что и собственно С++
28 апр 2014 в 12:35
Согласен, и честно — я бы только «за», к примеру писать на том же python! Но задача, к сожалению, поставлена так, что нужно(!) писать все на С++ (т.к. изучается конкретно этот язык), с использованием инструмента MSVS(вопрос — а Visual studio — это инструмент?). Вот поэтому и встал такой вопрос — что нужно знать для написания GUI с пом.С++ и майкрософтовского продукта.
28 апр 2014 в 12:38
Окей. А для чего WPF? Просто, на сколько я понял, что его можно использовать и для C++. Хотя с гугле почти 100% от общего кол-ва запросов выдает WPF в связке с C#! Ага, на сколько я понял: WinForms == C++/CLI? То есть мне нужно изучить C++/CLI, что бы уметь писать GUI?
28 апр 2014 в 12:40
Есть еще MFC, старый как то, что бывает старым, и лучше бы вам его не откапывать. И WTL, который на слуху и, кажется, я слышал о нем неплохие отзывы.
28 апр 2014 в 12:40
2 ответа 2
Сортировка: Сброс на вариант по умолчанию
Самое, что вам ближе — это MFC. WinForms — это не С++, это C++/CLI, который работает на платформе MS .Net Framework.
Беда MFC в том, что это тонкая прослойка над WinAPI там шаг влево-шаг вправо от идеологии фреймворка — пропасть.
Писать годные интерфейсы можно и нужно. Но, к счастью или несчастью, Qt здесь почти безальтернативен. Пусть он превносит в язык расширения в виде сигналов-слотов, как следствие — предобработки исходного кода MOC’ом, но это действительно юзабельный бриллиант в мире C++.
В академических целях, желательно овладевать чистым C++, в разумных пределах — WinAPI. Реальные более-менее сложные, переносимые интерфейсы можно писать wxWidget, GTKmm и иже с ними, just for fun.
Но Qt — это настоящее и будущее C++)
ЗЫ Плагин Qt позволяет писать из-под MSVS. Однако, студия враждебна к юникоду.
Создание графического интерфейса в 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



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

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

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

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

• Linker > Advanced > Entry Point . В пустое поле вписать » main » (без кавычек).
5. В «Solution Explorer» двойным щелчком открыть в редакторе файл MyForm.cpp. Скопировать в него текст
#include «MyForm.h»
using namespace System;
using namespace System::Windows::Forms;
[STAThread]
void main(array^ args) Application::EnableVisualStyles();
Application::SetCompatibleTextRenderingDefault(false);
Project1 ::MyForm form;
Application::Run(%form);
>

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

6. Для того, чтобы добавить на нашу только что созданную форму новые элементы, понадобится панель Toolbox. Полезно запомнить горячую клавишу ^!X
Работа с размещением элементов на форме сложностей вызвать не должна. Работает здесь всё удобнее, чем wxWidgets в CodeBlocks или wxDev-C++. Никаких глюков мною замечено не было.
Для изменения свойств только что созданного элемента интерфейса щёлкните на нём правой кнопкой и в контекстном меню выберите, соответственно, Properties.
Испытаем кнопку в работе. Сделаем так, чтобы по её названию появлялось окно с умным текстом. Двойной щелчок по элементу на форме вызовет редактор кода с уже прописанным в нём шаблоном. Добавим внутрь фигурных скобок команду
MessageBox::Show(«Hello World»,
«My heading», MessageBoxButtons::OKCancel,
MessageBoxIcon::Asterisk);

Запускаем и проверяем!
Если вдруг не запустится, то первым делом проверяем, что выставлено в раскрывающемся списке Solution Configurations . Он находится на панели инструментов (под главным меню). Там должно быть Release (а не Debug) .
Дополнительная информация
Альтернативные способы создания графических приложений в 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.
Теперь можно немного поэкспериментировать с элементами интерфейса. Ниже показан код простейшего графического калькулятора:
Код со скриншота
private: System::Void button6_Click(System::Object^ sender, System::EventArgs^ e) Application::Exit();
>
private: System::Void radioButton1_CheckedChanged(System::Object^ sender, System::EventArgs^ e) label1->Text = «+»;
>
private: System::Void radioButton2_CheckedChanged(System::Object^ sender, System::EventArgs^ e) label1->Text = «-«;
>
private: System::Void radioButton3_CheckedChanged(System::Object^ sender, System::EventArgs^ e) label1->Text = «*»;
>
private: System::Void radioButton4_CheckedChanged(System::Object^ sender, System::EventArgs^ e) label1->Text = «/»;
>
private: System::Void button5_Click(System::Object^ sender, System::EventArgs^ e) char sw = System::Convert::ToChar(label1->Text);
double a = System::Convert::ToDouble(textBox1->Text);
double b = System::Convert::ToDouble(textBox2->Text);
double r;
switch (sw) case ‘+’:
r = a + b;
break;
case ‘-‘:
r = a — b;
break;
case ‘*’:
r = a * b;
break;
case ‘/’:
r = a / b;
break;
>
label2->Text = «Result: » + System::Convert::ToString(r);
>

А теперь можно попытаться сотворить что-то более похожее на стандартное window-приложение. Пока простейшее.
Код калькулятора:
double iFirstNum;
double iSecondNum;
double iResult;
String^ iOperator;
private: System::Void btnC_Click(System::Object^ sender, System::EventArgs^ e) /*button C («Global Clear» — clears the entire calculation*/
tbDisplay->Text = «0»;
lblShowOp->Text = «»;
>
private: System::Void btnCE_Click(System::Object^ sender, System::EventArgs^ e) <
/*button CE («Clear Entry» is supposed to be used to clear only the thing you are currently
typing into the calculator, before you have performed any operation on it.*/
tbDisplay->Text = «0»;
>
private: System::Void buttonS_Number_Click(System::Object^ sender, System::EventArgs^ e) <
//Number Buttons Event
Button ^ Numbers = safe_cast(sender);
if (tbDisplay->Text == «0»)
tbDisplay->Text = Numbers->Text;
else
tbDisplay->Text += Numbers->Text;
>
private: System::Void buttonS_Arithmetic_Click(System::Object^ sender, System::EventArgs^ e) <
//Operator Buttons Event
Button ^ op = safe_cast(sender);
iFirstNum = Double::Parse(tbDisplay->Text);
tbDisplay->Text = «0»;
iOperator = op->Text;
lblShowOp->Text = System::Convert::ToString(iFirstNum) + » » + iOperator;
>
private: System::Void btnEquals_Click(System::Object^ sender, System::EventArgs^ e) <
//Equals
iSecondNum = Double::Parse(tbDisplay->Text);
if (iOperator == «+»)
iResult = iFirstNum + iSecondNum;
else if (iOperator == «-«)
iResult = iFirstNum — iSecondNum;
else if (iOperator == «*»)
iResult = iFirstNum * iSecondNum;
else if (iOperator == «/»)
iResult = iFirstNum / iSecondNum;
else MessageBox::Show(«Unknown operation.\nSomething wrong.»,
«error», MessageBoxButtons::OK,
MessageBoxIcon::Error);
return;
>
lblShowOp->Text += » » + tbDisplay->Text + » color:#2980b9;»>private: System::Void btnBackSpace_Click(System::Object^ sender, System::EventArgs^ e) <
//BackSpace
if (tbDisplay->Text->Length > 1)
tbDisplay->Text = tbDisplay->Text->Remove(tbDisplay->Text->Length — 1, 1);
else
tbDisplay->Text = «0»;
>
private: System::Void btnDot_Click(System::Object^ sender, System::EventArgs^ e) <
//Decimal Point
if (!tbDisplay->Text->Contains(«.»))
tbDisplay->Text += «.»;
>
private: System::Void btnPM_Click(System::Object^ sender, System::EventArgs^ e) <
//Plus-Minus
if (tbDisplay->Text->Contains(«-«))
tbDisplay->Text = tbDisplay->Text->Remove(0, 1);
else
tbDisplay->Text = «-» + tbDisplay->Text;
>
Код создан на основе видеоролика
«Visual C++ Calculator Tutorial with Decimal Point and Backspace» (37:59, DJ Oamen, 2016 Jan 2, Visual C++ 2010) ,
но имеет ряд отличий.
Как продолжение, существует видеоролик
«Visual C++ Scientific Calculator Tutorial» (53:31, Paul Oamen, 2016 Oct 2, Visual Studio 2015). Судя по голосу, автор тот же. К показанному выше калькулятору прибавляется конвертер температуры и ряд более научных функций. Предупрежу, что итоговое «творение» имеет массу изъянов и глюков, поэтому видео можно просматривать исключительно для изучение приёмов программирования. Но не используйте его в качестве образца того, как нужно создавать калькуляторы.
