визуальное приложение на c в visual studio
BestProg
Выполнение
В результате будет создано окно с активной вкладкой Start Page (рисунок 1).
Рисунок 1. Окно Microsoft Visual Studio
2. Создание приложения типа Windows Forms Application
Система Microsoft Visual Studio предлагает разные виды шаблонов приложения для программирования на языке C++ (рис. 2).
Рисунок 2. Вызов команды создания нового проекта
В поле « Location: » надо задать путь к папке, в которой будет сохранен проект. В нашем случае задан следующий путь
В поле Name задается имя приложения. В нашем случае это имя « MyApp01 «.
Если включена опция « Create directory for solution » (создать директорию для решения), то проект будет сохранен в папке
В поле « Solution name: » задается имя решения. Решение ( solution ) может объединять в себе несколько проектов. В нашем случае имя решения остается таким как и имя проекта.
Рисунок 3. Окно « New Project » создания нового проекта
3. Основные элементы оконного интерфейса для работы с программой
В результате окно Microsoft Visual Studio примет вид как показано на рисунке 4.
В окне, в центре отображается основная форма приложения. На этой форме можно размещать компоненты. Компоненты размещаются на панели Toolbox (левая часть экрана).
Свойства формы или компонента отображаются в утилите Solution Explorer (правая часть экрана). Изменяя эти свойства, можно влиять на вид формы, поведение формы, реализовывать обработчики событий формы и прочее.
Рисунок 4. Основные элементы окна приложения
4. Вызов режима ввода кода
На данный момент активным есть режим проектирования формы. Чтобы перейти в режим набора текста программы, нужно вызвать команду Code с меню View (рисунок 5):
Рисунок 5. Команда перехода в режим набора текста программы
Другой вариант вызова команды перехода в режим набора текста, это клик на соответствующей кнопке в Solution Explorer (рисунок 6).
Рисунок 6. Кнопка перехода в режим набора текста программы
В результате отобразится текст программы.
Рисунок 7. Режим просмотра текста программы
5. Текст модуля « Form1.h «
При создании проекта, система Microsoft Visual Studio генерирует программный код, который сохраняется в различных файлах.
Главным файлом, в котором программист создает собственный код программы, есть файл « Form1.h «. Этот файл соответствует главной форме приложения. На главной форме размещаются различные компоненты. С помощью этих компонент реализуется решение конкретной задачи. При создании проекта создается пустая форма (рисунок 6). Кроме главной формы можно создавать другие формы и добавлять их к проекту.
Листинг файла « Form1.h » следующий.
Объясним некоторые фрагменты кода в тексте программы.
В вышеприведенном тексте создается пространство имен MyApp01 с помощью оператора
В пространстве имен MyApp01 создается класс с именем Form1. Этот класс соответствует главной форме приложения Form1.
Класс содержит конструктор, который вызывает метод
В методе InitializeComponent() создается компонента-форма (переменная components ), которая есть контейнером. Это означает, что на форме могут размещаться другие компоненты (кнопки, метки, поля ввода и т.д.). Также в методе InitializeComponent() настраиваются параметры формы: название заголовка, размер (300 * 300 пикселей), шрифт по умолчанию.
6. Файлы, которые создаются в проекте
После создания проекта типа Windows Forms Application система Microsoft Visual Studio создает несколько файлов.
Листинг файла « MyApp01.cpp » следующий:
Файл « MyApp01.vcxproj.filters «. Это есть файл фильтров для сгенерированных проектов на Visual C++ с использованием мастера приложений ( Application Wizard ). В нем содержится информация об ассоциации между файлами в вашем проекте и фильтрами. Эта ассоциация используется в интегрированной среде, чтобы показать группирование файлов с одинаковыми расширениями.
Файл « AssemblyInfo.cpp «. Содержит пользовательские атрибуты для модификации данных сборки.
Файли « StdAfx.h » и « StdAfx.cpp «. Они используются для создания файла скомпилированных заголовков ( PCH ) с именем « MyApp01.pch » и скомпилированных типов названных « StdAfx.obj «.
7. Запуск проекта на выполнение
Для запуска проекта на выполнение используется команда Start Debuggin из меню Debug (клавиши F5).
Создание графического интерфейса в 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 не считает эту ошибку достаточно серьёзным делом, чтобы ломать о неё копья.
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);
Запускаем и проверяем!
Дополнительная информация
Альтернативные способы создания графических приложений в Visual Studio 2017.
Пара слов для общего развития о нескольких технологиях, на которые вы будете постоянно натыкаться при чтении документации по разработке GUI в Visual Studio.
Примечания:
В интернете можно наткнуться на заголовок «Full C and C++ IDE with Visual Studio». Оттуда закачиваются те же самые стандартные дистрибутивы Visual Studio, проверено по контрольным суммам.
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 = «/»;
>
А теперь можно попытаться сотворить что-то более похожее на стандартное window-приложение. Пока простейшее.
double iFirstNum;
double iSecondNum;
double iResult;
String^ iOperator;
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);
lblShowOp->Text += » » + tbDisplay->Text + » = » + System::Convert::ToString(iResult);
tbDisplay->Text = System::Convert::ToString(iResult);
>
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++ Scientific Calculator Tutorial» (53:31, Paul Oamen, 2016 Oct 2, Visual Studio 2015). Судя по голосу, автор тот же. К показанному выше калькулятору прибавляется конвертер температуры и ряд более научных функций. Предупрежу, что итоговое «творение» имеет массу изъянов и глюков, поэтому видео можно просматривать исключительно для изучение приёмов программирования. Но не используйте его в качестве образца того, как нужно создавать калькуляторы.
Из этого краткого руководства вы узнаете, как создать приложение Windows Presentation Foundation (WPF) с помощью Visual Studio. После создания первоначального приложения вы научитесь добавлять элементы управления и обрабатывать события. По завершении работы с этим руководством у вас будет простое приложение, добавляющее имена в список.
В этом руководстве описано следующее:
Ниже представлен предварительный просмотр приложения, которое будет создано в данном руководстве.
Предварительные требования
Создание приложения WPF
Первым шагом в создании нового приложения является запуск Visual Studio и создание приложения на основе шаблона.
Запустите Visual Studio.
Выберите Создать новый проект.
В раскрывающемся списке язык кода выберите C# или Visual Basic.
В списке шаблонов выберите Приложение WPF, а затем нажмите Далее.
В окне Настройка нового проекта выполните следующие действия:
После создания приложения в Visual Studio должна открыться панель конструктора XAML для формы по умолчанию MainWindow. Если конструктор не отображается, дважды щелкните файл MainWindow.xaml в области Обозреватель решений, чтобы открыть конструктор.
Важные элементы среды Visual Studio
Поддержка WPF в Visual Studio состоит из пяти важных компонентов, с которыми вы будете взаимодействовать при создании приложения.
Все файлы проекта, код, окна и ресурсы отображаются в этой области.
На этой панели отображаются параметры свойств, которые можно настроить в зависимости от выбранного элемента. Например, если выбрать элемент в Обозревателе решений, отобразятся параметры свойств, связанные с файлом. Если выбрать объект в конструкторе, отобразятся параметры этого элемента.
Панель элементов содержит все элементы управления, которые можно добавить на форму. Чтобы добавить элемент управления на текущую форму, дважды щелкните элемент управления или перетащите его.
Это конструктор для документа XAML. Он является интерактивным, и на него можно перетаскивать объекты из панели элементов. Выбирая и перемещая элементы в конструкторе, можно визуально создавать пользовательский интерфейс для приложения.
Если конструктор и редактор отображаются, изменения в одном из них сразу отражаются в другом. При выборе элементов в конструкторе в области Свойства отображаются свойства и атрибуты этого объекта.
Редактор кода XAML
Это редактор кода XAML для документа XAML. Редактор кода XAML — это способ создания пользовательского интерфейса вручную без конструктора. Конструктор может вычислять значения свойств элемента управления при его добавлении в конструктор. В редакторе кода XAML вам предоставляется гораздо больше контроля.
Если конструктор и редактор отображаются, изменения в одном из них сразу отражаются в другом. При переходе по текстовым курсорам в редакторе кода в области Свойства отображаются свойства и атрибуты этого объекта.
Сохраните файл проекта и закройте вкладку редактора.
Изучение кода XAML
После создания проекта в редакторе кода XAML отображается минимальный объем кода XAML для отображения окна. Если редактор не открыт, дважды щелкните элемент MainWindow.xaml в обозревателе решений. Должен отобразиться код XAML, аналогичный следующему:
Корень документа представляет тип объекта, описываемого файлом XAML. Объявлено восемь атрибутов, и обычно они относятся к трем категориям:
Пространство имен XML предоставляет структуру XML, которая определяет, что можно, а что нельзя объявлять в файле.
Изменение окна
Сначала запустим проект и просмотрим выходные данные по умолчанию. Появится окно с заголовком MainWindow без элементов управления:
Для нашего примера приложения это окно слишком велико, а его заголовок не является описательным. Измените заголовок и размер окна, заменив соответствующие атрибуты в XAML следующими значениями:
Подготовка макета
Элемент управления определяет строки и столбцы, в которых будут находиться элементы управления. В сетке всегда объявлена одна строка и столбец, то есть сетка по умолчанию является отдельной ячейкой. Это не обеспечивает большую гибкость при размещении элементов управления.
Затем определите две строки и два столбца, разделив сетку на четыре ячейки:
Выберите сетку в редакторе кода XAML или в конструкторе XAML. Вы увидите, что в конструкторе XAML отображается каждая строка и столбец:
Добавление первого элемента управления
После создания сетки можно приступать к добавлению в нее элементов управления. Начните с элемента управления Label. Создайте новый элемент внутри элемента после определений строк и столбцов, а затем присвойте ему строковое значение Names :
Обратите внимание, что теперь в конструкторе отображается метка, занимающая небольшую часть доступной высоты. Теперь имеется больше места для следующей строки. Большинство элементов управления определяют значения высоты и ширины, которые они должны занимать. В случае элемента управления Label он имеет значение высоты, которое гарантирует, что его можно будет прочитать.
Размещение элементов управления
Давайте поговорим о размещении элементов управления. Метка, созданная в разделе выше, автоматически помещается в строку 0 и столбец 0 сетки. Нумерация строк и столбцов начинается с 0 и увеличивается на 1 для каждой новой строки или столбца. Элементу управления ничего не известно о сетке, и элемент управления не определяет свойства для управления своим размещением в сетке. Элемент управления можно даже поместить в другой элемент управления макета, имеющий собственный набор правил, которые определяют способ размещения элементов управления.
Как указать элементу управления, что ему следует использовать другую строку или столбец, если элемент управления не имеет сведений о сетке? В этом случае на помощь придут вложенные свойства! Сетка использует эффективную систему свойств, предоставляемую WPF. Сетка определяет новые свойства, которые дочерние элементы управления могут объявлять и использовать. Свойства фактически не существуют в самом элементе управления, они вкладываются сеткой при добавлении элемента управления в сетку.
Обратите внимание, что метка теперь переместилась во второй столбец. Вложенные свойства Grid.Row и Grid.Column можно использовать для размещения последующих элементов управления, которые мы создадим. Но на этом этапе следует вернуть метку в строку 0.
Создание поля со списком имен
Добавление оставшихся элементов управления
Создайте элемент управления после списка и вставьте его в строку 1 и столбец 1 сетки. Добавьте еще один атрибут с именем Margin и значением 5,0,0,0 :
Макет окна готов. Однако в наше приложение следует добавить логику, чтобы оно работало. Далее необходимо подключить события элемента управления к коду, чтобы приложение выполняло действия.
Добавление кода для события Click
Теперь необходимо создать код обработчика. Щелкните правой кнопкой мыши ButtonAddName_Click и выберите Перейдите к определению. При этом в коде будет создан метод, соответствующий введенному имени обработчика.
Затем добавьте следующий код для выполнения следующих трех шагов:
Запустите приложение
Теперь, когда у нас есть код события, можно запустить приложение, нажав клавишу F5 или выбрав пункт меню Отладка > Начать отладку. Отобразится окно, и вы можете ввести имя в текстовое поле, а затем добавить его, нажав кнопку.
Из этого краткого руководства вы узнаете, как создать новое приложение Windows Forms (WinForms) с помощью Visual Studio. После создания первоначального приложения вы научитесь добавлять элементы управления и обрабатывать события. По завершении работы с этим руководством у вас будет простое приложение, добавляющее имена в список.
В этом руководстве описано следующее:
Предварительные требования
Создание приложения WinForms
Первым шагом в создании нового приложения является запуск Visual Studio и создание приложения на основе шаблона.
Запустите Visual Studio.
Выберите Создать новый проект.
В раскрывающемся списке язык кода выберите C# или Visual Basic.
В списке шаблонов выберите Приложение Windows Forms (.NET) и затем щелкните Далее.
В окне Настроить новый проект задайте в качестве имени проекта значение Names и щелкните Создать.
Вы также можете сохранить проект в другую папку, изменив параметр Расположение.
После создания приложения Visual Studio должен открыть панель конструктора для формы по умолчанию Form1. Если конструктор форм не отображается, дважды щелкните форму в области Обозреватель решений, чтобы открыть окно конструктора.
Важные элементы среды Visual Studio
Поддержка WinForms в Visual Studio состоит из четырех важных компонентов, с которыми вы будете взаимодействовать при создании приложения.
Все файлы проекта, код, формы и ресурсы отображаются в этой области.
На этой панели отображаются параметры свойств, которые можно настроить в зависимости от выбранного элемента. Например, если выбрать элемент в Обозревателе решений, отобразятся параметры свойств, связанные с файлом. Если выбрать объект в конструкторе, отобразятся параметры элемента управления или формы.
Это конструктор для формы. Он является интерактивным, и на него можно перетаскивать объекты из панели элементов. Выбирая и перемещая элементы в конструкторе, можно визуально создавать пользовательский интерфейс для приложения.
Панель элементов содержит все элементы управления, которые можно добавить на форму. Чтобы добавить элемент управления на текущую форму, дважды щелкните элемент управления или перетащите его.
Добавление элементов управления на форму
Открыв конструктор форм Form1, используйте панель Область элементов, чтобы добавить на форму следующие элементы управления:
Вы можете расположить и изменить размер элементов управления в соответствии со следующими настройками. Либо визуально перенесите их, чтобы они соответствовали следующему снимку экрана, либо щелкните каждый элемент управления и настройте параметры в области Свойства. Можно также щелкнуть область заголовка формы, чтобы выбрать форму.
Объект | Параметр | Значение |
---|---|---|
Form | Текст | Names |
Размер | 268, 180 | |
Label | Расположение | 12, 9 |
Текст | Names | |
Listbox | Имя | lstNames |
Расположение | 12, 27 | |
Размер | 120, 94 | |
текстовое поле; | Имя | txtName |
Расположение | 138, 26 | |
Размер | 100, 23 | |
Button | Имя | btnAdd |
Расположение | 138, 55 | |
Размер | 100, 23 | |
Текст | Add Name |
Вы должны получить в конструкторе форму, которая выглядит следующим образом.
Обработка событий
Теперь, когда в форме есть все элементы управления, необходимо обрабатывать события элементов управления, чтобы реагировать на вводимые пользователем данные. Открыв конструктор форм, выполните следующие действия.
Выберите в форме элемент управления «Кнопка».
Найдите событие Click и дважды щелкните его, чтобы создать обработчик событий.
Это действие добавляет следующий код в форму:
Запустите приложение
Теперь, когда у нас есть код события, можно запустить приложение, нажав клавишу F5 или выбрав пункт меню Отладка > Начать отладку. Отобразится форма, и вы можете ввести имя в текстовое поле, а затем добавить его, нажав кнопку.