Как сделать функцию в visual studio

Обновлено: 06.07.2024

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

Как работает компьютер

В начале мне хочется немного поговорить о том, как вообще работает компьютер, потому что это очень важно для понимания того, чем на самом деле мы занимаемся. Любой компьютер, насколько бы он ни был крутой, по сути является просто калькулятором на стеройдах. Он манипулирует двоичными данными 0 и 1, в которые закодирована используемая нами информация, и если очень утрировано может выполнять всего лишь несколько операций:

  • Записать значения в память
  • Прочитать значение из памяти
  • Выполнить операции сложения, умножения, отрицания

И именно так он на самом деле и работает – обрабатывает миллиарды единиц информации каждую секунду, чтобы ты мог погонять в дотку или порнушку посмотреть. Вот такая у компьютера незавидная участь, поэтому не обижай его, заботься о нем. Вот когда ты последний раз чистил его от пыли? А?

Опять работать?

Как себя чувствует твой компьютер, когда ты запускаешь Visual Studio…

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

Что такое языки программирования

По своей сути, языки программирования — это более строго форматизированные человеческие языки (чаще всего английский). То есть, мы должны выражать свои мысли на бумаге (ну точнее на экране), так, как если бы мы писали письмо человеку, но при этом очень строго следуя правилам написания заданных регламентом. Именно к такому формату написания кода и нужно стремиться, чтобы твой код читался как книга.

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

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

Золотые руки из жопы

Герб большинства программистов

Инструмент создания приложений IDE

Таким образом, мы пришли к тому, что необходимы определенные инструменты, которые позволяют преобразовывать написанный текст на языке высокого уровня в машинные коды, которые будут понятны компьютеру. Такие приложения называются компиляторами. Но сейчас намного большей популярностью пользуются другие приложения, которые по сути являются основным инструментом современного программиста – это интегрированная среда разработки (Integrated Development Environment) IDE. По сути, это компилятор на стероидах. Это приложение, а иногда и набор инструментов, которые позволяют преобразовать исходный код, написанный программистом в готовое приложение, но содержащее в себе еще вагон и маленькую тележку дополнительных приблуд, которые делают жизнь программиста чуточку проще. Это и всевозможные статические анализаторы кода, которые находят ошибки еще до запуска приложения, а также указывают на так называемый код с душком. Это и системы тестирования, анализа и статистики по коду, инструменты для быстрого рефакторинга и выгрузки документации по коду. Короче, целая куча крутых фишек, которыми никто не пользуется.

Visual Studio

  • Community
  • Professional
  • Enterprise

Разница между ними только в количестве всех вот этих наворотов и цене. На начальном этапе я всем рекомендую использовать Community версию, которая является бесплатной с небольшими ограничениями:

— Visual Studio Community может использовать неограниченное число пользователей в учебных аудиториях, для научных исследований или участия в проектах с открытым кодом.

— Для всех прочих сценариев использования: в некорпоративных организациях Visual Studio Community может использовать до 5 пользователей. В корпоративных организациях (в которых используется > 250 ПК или годовой доход которых > 1 млн долларов США) использование запрещено.

Таким образом, пока ты зарабатываешь меньше 1 млн долларов в год, ив твоей команде меньше 5 человек, можешь разрабатывать любое ПО в том числе и коммерческое.

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

Выбираем самые важные компоненты Visual Studio

Выбираем самые важные компоненты для установки

Самые нужные расширения для Visual Studio

После установки Вижуалки также очень рекомендую тебе установить несколько расширений, которые очень сильно помогут тебе работать в дальнейшем.

Для этого открываем меню Средства => Расширения и обновления

Расширения и обновления Visual Studio

Где найти расширения Visual Studio

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

Устанавливаем нужные расширения для Visual Studio

Интерфейс установки расширений Visual Studio

ReSharper – суперкрутой статический анализатор кода. Может практически все, но некоторым (в том числе мне) не нравится, потому что бесит, и является платным. Но в целом очень полезен.

Web Essentials – mast have для веб программистов. Позволяет весьма упростить и ускорить процесс работы в интерфейсной частью приложения, упрощает и ускоряет верстку, но в других случаях он не нужен.

Productivity Power Tools 2017/2019 – целый набор небольших расширения, позволяющих сделать процесс написания кода комфортнее, код чище и красивее. Настоятельно рекомендую устанавливать каждому.

GitHub Extension for Visual Studio – очень удобное взаимодействие с популярным сервисом хранения кода и системой контроля версий. Каждому программисту нужно научиться и постоянно использовать любую подходящую систему контроля версий. А это расширение позволит форкать проекты и выполнять коммиты в пару кликов.

Visual Studio Spell Checker — позволяет избавиться от таких досадных ошибок, как опечатки в коде. Работает примерно как в ворде — подчеркивает красным не правильные слова. При этом он понимает различные нотации и без проблем понимает, что написанные слитно слова, но с заглавными буквами это не ошибка.

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

Создаем новый проект Visual Studio

Создаем новый проект

Открываем среду разработки Visual Studio и заходим в меню Файл => Создать => Проект

Выбираем тип проекта Visual Studio

Выбираем тип проекта — Консольное приложение

В открывшимся окне вводим следующий код приложения

После чего запускаем приложение, нажав сочетание клавишь Ctrl+F5 или зеленую клавишу Пуск и получаем следующий результат

Поздравляю, вы создали свое первое приложение!

Подробно, весь процесс установки и настройки Visual Studio, а также создание первого приложения рассмотрен на моем видеоуроке.

Как пользоваться Visual Studio Code

Visual Studio Code – это один из наиболее популярных редакторов кода, разработанный корпорацией Microsoft. Он распространяется в бесплатном доступе и поддерживается всеми актуальными операционными системами: Windows, Linux и macOS. VS Code представляет собой обычный текстовый редактор с возможностью подключения различных плагинов, что дает возможность работать со всевозможными языками программирования для разработки любого IT-продукта.

Несмотря на столь высокую популярность программы, ее функционал до сих пор остается не таким очевидным, из-за чего многие пользователи предпочитают продукт конкурента, нежели VS Code. Чтобы решить все проблемы, возникающие при работе с Visual Studio Code, рекомендую ознакомиться с подробным гайдом по настройке этого редактора кода. В нем я покажу, что VS Code – это мощный инструмент, которым может пользоваться каждый.

Установка Visual Studio Code

С установкой среды не должно возникнуть никаких проблем, но давайте все же проведем небольшой ликбез. Выполним несколько действий:

Virtual Studio Code запуск на слабом пк

Готово! Теперь программа должна работать на любом компьютере.

Интерфейс Visual Studio Code

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

Как открыть файл в Visual Studio Code

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

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

Окно Visual Studio Code

Проводник в Visual Studio Code

Поиск в Visual Studio Code

Система управления версиями – предназначена для взаимодействия с git.

Git в Visual Studio Code

Запустить и проверить работоспособность кода мы можем в следующей вкладке:

Как сделать отладку в Visual Studio Code

Расширения в Visual Studio Code

Следующий блок – нижний статус-бар. В нем отображается общая информация о состоянии программы. Обратите внимание, что VS Code автоматически определяет язык программирования и информирует нас об этом.

Статус бар Visual Studio Code

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

Как разделить код на два столбца в Visual Studio Code

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

Русификация Visual Studio Code

Как русифицировать Visual Studio Code

Перезагружаем программу и смотрим, что язык интерфейса был изменен на русский:

Русификация Visual Studio Code

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

Внешний вид

Как сменить тему в Visual Studio Code

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

Как поменять тему в Visual Studio Code

После применения темы интерфейс примет следующий вид:

Солнечная тема в Visual Studio Code

Как изменить тему в Visual Studio Code

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

Управление проектами

По умолчанию Visual Studio Code поддерживает работу с несколькими проектами, однако перемещаться между ними не очень удобно. Для удобства обычно используют плагин под названием Project Manager. С его помощью открывается возможность перемещения между рабочими областями всего в один клик. Установка проходит через магазин расширений, о котором мы говорили ранее. После того как менеджер проектов будет установлен, в левой панели управления появится новая вкладка для работы с плагином.

Плагин Project Manager

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

Автоформатирование кода

Один из важных этапов программирования – умение приводить все к единому виду с правильными отступами. Для таких задач в VS Code есть специальные плагины, позволяющие форматировать весь текстовый документ. Это такие расширения, как PHP-CS-Fixer для PHP, Prettier для JS/HTML/CSS и другие.

Рассмотрим, как форматируется код, написанный на JavaScript:

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

Автодополнение

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

Посмотреть, какие пакеты доступны, вы можете в магазине плагинов.

Как включить функцию автодополнения в Visual Studio Code

Рекомендую установить PHP Intellisense, CSS Intellisense и Path Intellisense.

Управление Vim

Vim – это свободный текстовый редактор, работающий на основе vi. По умолчанию он установлен на каждой операционной системе семейства Unix. Кроме того, он доступен и в Visual Studio Code. Для работы с ним потребуется установить расширение с аналогичным названием:

Управление Vim в Visual Studio Code

Теперь мы можем перемещаться по файлу клавишами h, j, k, l, использовать Esc и сохранять файл командой :w.

Отладка кода

Расширения для отладки кода в Visual Studio Code

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

Как выполнить отладку кода в Visual Studio Code

Запуск отладки в Visual Studio Code

С помощью плагинов мы можем отладить код, написанный на любом языке программирования.

Заключение

Сегодня мы разобрали функционал инструмента Visual Studio Code. Данная среда хороша не только для профессионалов, но и для новичков, изучающих основы программирования. Одно из преимуществ программы – это минимальное требование к железу: запустить программу можно практически на любом компьютере.

Надеюсь, что работа в VS Code больше не будет для вас проблемой, а активные проекты ждет успех. Удачи!

Аннотация: Весь изложенный материал, без особого труда, можно найти в MSDN и сети, но для большинства статей характерен уход в вопросы, которые затрудняют создание четкого и ясного представления о том, как работать с графикой. При решении корпоративной задачи вывода графиков в Web приложении, автору сначала потребовалось обобщить материал, и, лишь после того, приступить собственно к выполнению задания. Материалы этого обобщения и приводятся в данной статье.

PS: Материал первоначально касался только отображения графики на Web страницах, но поступающие от читателей вопросы по использованию графики в Windows стали причиной дополнения данного материала еще одной главой, которую, в силу методических соображений, автор поместил первой.

Глава 1. Использование графики в Windows приложениях

Параграф 1. Где и как возможно отображать графическую информацию в Windows приложениях

В Visual Studio Net нет стандартных средств для создания графиков, диаграмм. Поэтому, большинство статей на рассматриваемую тему рекомендуют использовать Office Web Components (OWC) - компонент Windows для построения диаграмм в Web. Как достоинство этого подхода обычно отмечается простота построения графиков и диаграмм и интуитивно близкие задания параметров графической информации с их заданием при использовании графики в MS Office. Но простота не всегда достоинство, когда мы строим график "под себя". Да и достаточно для программиста сомнительна, когда он однажды создав код графического класса, он всегда легко и быстро может его перенастроить его для конкретной задачи, не влезая в дебри некого универсального кода, где порой гораздо больше времени будет затрачено на уяснение параметров и задание их значений и границ. Поэтому, речь далее пойдет о создании собственных графиков с "чистого листа". Основные типы графиков, которые будут рассмотрены, по мнению автора, могут стать достаточными для большинства практических задач и базой для дальнейших собственных разработок.

В Microsoft Windows существует несколько средств для вывода графической информации, включая DirectDraw, OpenGL, GDI и т.д. Мы будем использовать Graphics Device Interface (GDI, более поздние версии GDI+) - подсистему Windows, ответственную за вывод графики и текста на дисплей и принтер. Именно CGI+ обеспечивает вывод на экран всего того, что видит пользователь Windows в окне монитора. GDI+ является базовым способом вывода графики в Windows.

Рассмотрим простейшие примеры. Создадим решение Windows приложения с одной кнопкой и следующим обработчиком ее нажатия:

Результат вывода при нажатии кнопки 1, показан на Рис.1:

Рис.1. Создание и использование объект класса Graphics на основе битовой матрицы

Одинакового эффекта (Рис.1.), можно добиться, если использовать обработчики некоторых событий, которым передается объект класса Graphics как аргумент (например, обработчик события Paint формы приложения):

Одинакового эффекта (Рис.1.), можно добиться и при непосредственном создании объекта Graphics:

А так можно рисовать (писать) на кнопке и на других контролах, для которых может быть создан обработчик события Paint (Рис.2.):

Класс Graphics находятся в пространстве имен Drawing (хотя, забегая вперед, нам понадобится и пространство имен Drawing.Drawing2D, по сему, целесообразно сразу добавить их в решение).

SolidBrush - сплошная закраска цветом кисти;

TextureBrush - наложение картинки (image) на область закраски;

HatchBrush - закраска области предопределенным узором;

LinearGradientBrush - сплошная закраска c переходом цвета кисти (градиентная закраска);

Пример использования конструктора HatchBrush показан на Рис.2.:

Рис.2. Пример использования конструктора HatchBrush

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

Здесь нет необходимости подробно описывать все методы объекта Graphics, их можно легко увидеть из контекстной подсказки, как обычно, поставив точку после написания имени объекта. По этой же причине нет необходимости перечислять и преопределенные цвета карандашей (Color.) и кистей (Brushes.)

Круговые фигуры рисуются при указании в качестве стартовой точки левого верхнего угла (см. последний пример);

Рисование непосредственно на форме не всегда является и не есть хороший тон, кода Visual Studio предлагает специальный контрол, который, как нельзя лучше, подходит для вывода графической информации и обладает всеми преимуществами контролов: программное позиционирование и масштабирование без перерисовки формы, возможность выполнять Stretch Image и множество других полезных свойств и событий. Кроме того простой доступ к Graphics, аналогично через событии Paint и возможность использования битовых карт Bitmap для создания объекта Graphics, с последующим переносом их в контрол (аналогично, как мы делали это в первом примере):

Далее мы будем использовать именно PictureBox, как объект для отображения графической информации.

Параграф 2. Создание линейных графиков

2.1. В качестве постановки задачи

Однажды мне пришлось делать задачку, на базе продолжения работы над которой появилась программа "LitFrequencyMeter" - программа определения частоты повторения слов и знаков в литературных произведениях, графики из которой приведены ниже (Рис.3-5.). И когда я приступил к заключительному этапу работы над программой, то понял, что материал главы практически написан в кодах - осталось только его озвучить.

Настройка всего и вся: цветов, шрифтов, фонов, надписей, положения диаграмм на холсте, использование пояснений, легенд, смена числа отсчетов и т.д., и т.п.

Хранение всех настроек (включая шрифты) в реестре.

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

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

Рис.3. Линейеая диаграмма

Рис.5. Круговая диаграмма

2.2. Постановка задачи

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

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

2.3. Исходные данные

Исходные данные перед их отображением могут находиться где угодно (файл, таблица базы данных. ). Однако рассматривать чтения из базы данных или из файла значений графиков - только засорять отображение материала. Мы всегда можем прочитать данные с любого источника в массив значений. Автор предпочитает работать со строковым массивом, как позволяющим хранить цифровые и текстовые значения. В примерах, приводимых ниже, используется массив строк string[,] rgsValues. В программе, о которой шла выше речь, этот массив использован для настройки параметров, отображаемых на графике. Заполнять массив будем с помощью датчиков случайных чисел:

Предполагается, что значение переменной, определяющий размерность массива хранится в настройках и устанавливается на этапе загрузки приложения.

2.4. Проект решения

Создадим простой проект WindowsApplication решения с любым именем (у меня graph1). Поместим на форму три кнопки, в свойствах "Текст" которых напишем соответственно: "Линейная диаграмма", "Гистонрамма" и "Круговая диаграмма". Ниже кнопок поместим контрол PictureBox. Подберем удобное для себя расположение кнопок и PictureBox (в реальных программах для размещения удобнее использовать контролы TableLayoutPanel, но сейчас нас интересует графика, а не размещение).

В окне Solutation Explorer кликаем правой кнопкой мышки на узле решения (у меня graph1) и в контекстном меню выбираем Add\New Item. В окне Templates выбираем Class, даем ему имя, например PaintCl.cs и нажимаем кнопку Add. Будет создан пустой класс.

Нашей задачей будет постепенное наполнение этого класса при минимуме добавления кода в основной файл кода приложения - Form1.cs.

Для начала создадим обработчик события нажатия кнопки "Линейный график" (клик мышкой на кнопке), а также обработчики для событий Load и FormClozed (первый можно кликом мышки на форме, второй через окно Properties формы - закладка Events - клик в окошечке против события FormClosed). Слегка преобразуем код, как показано ниже:

Назначение переменной viNumButton, будет ясно далее. Массив значений у нас создан. Осталось нарисовать по значениям массива график, используя класс.

2.5. Конструкторы класса

Начало класса - конструктор и закрытые переменные. В классе лучше иметь несколько конструкторов. Например, таких как приведено в коде ниже. И, естественно, необходимо сразу определить основные объекты для графики: битовую матрицу, объект Graphiks, шрифт, кисть и перо (о чем мы говорили выше), а также переменные для сохранения размеров холста:

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

2.6. Создаем объект для рисования

Используем второй конструктор и создадим и инициализируем в классе сразу все объекты, которые нам необходимы:

Таким образом, нам понадобятся в классе еще две функции: установки фона холста и приема изображения из класса. Добавим их в класс:

Выполним решение на данном этапе. Результат показан на Рис.6.:

Рис.6. Взаимодействие кода формы с кодом класса

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

2.7. Рисуем оси

Добавим в классе переменные для хранения отступов от краев холста (они нам еще понадобятся не один раз).

Добавим функцию рисования осей и функции запоминания цвета и толщины осей. Функция выполняет простую задачу - рисует две линии и при необходимости стрелочки на конце осей:

Осталось добавить вызов функции рисования осей:

В функции vDravAxis мы задали параметры непосредственно. Отметим еще раз, что все величины целесообразно иметь настраиваемыми и их значения хранить в реестре.

Рис.7 Рисование осей линейного графика

2.8. Рисуем сетку

Для рисования сетки нам потребуется: цвет и толщина пера, размер массива отображаемых значений и непосредственно функция для рисования сетки. Установку цвета и толщины пера мы уже использовали при рисовании осей, поэтому в функции vCreateLinGr() добавим вновь вызовы:

Для хранения размера массива в классе определим переменную и определим доступ к ней через свойство, а также определим функцию, рисующую сетку viMaxRg*viMaxRg клеток. Рисование сетки сводится к рисованию параллельных осям линий:

В функции vCreateLinGr() добавим код и выполним решение:

Результат показан на Рис.8.:

Рис.8. Рисование сетки

2.8. Рисуем линию графика

Как мы уже делали - зададим цвет и толщину пера. Далее нам понадобятся данные из нашего массива значений непосредственно в классе. Для этого в классе определим массив и доступ к нему:

В классе создадим функцию рисования линий графика. Линии рисуются по соседним точкам массива:

Код vCreateLinGr() на данный момент:

Результат выполнения решения на данном этапе показан на Рис.9.:

Рис.9. Рисование линий графика

2.10. Надписи на графике

Надписи можно наносить по оси Х, по оси Y и над точками линий графика. Причем иногда бывает целесообразно выполнять соседние надписи со сдвигом по оси Y. Кроме того - надписи выполняются не пером, а кистями и требуют задания шрифта. Таким образом, перед выполнением надписей надо установить в классе соответственно шрифт и кисть (Brush).

Для передачи шрифта и кисти создадим в классе свойства:

В функции рисования графика запишем код:

Для выполнения различных надписей создадим в классе несколько функций. Подробно давать пояснения нет необходимости. Здесь, как и при рисовании линий, необходимо постоянно рассчитывать дельны расстояний по осям и точки начала надписей.

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

Результат выполнения кода показан на Рис.10.:

Рис.10. Линейный график

Параграф 3. Создание гистограмм

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

И так, нам понадобится всего лишь одна новая функция. Основное отличие - использование функции FillRectangle.

Запишем код обработки нажатия кнопки 2 и выполним решение:

Цветом показано единственное отличие от кода создания линейной диаграммы. Результат работы кода приведен на Рис.11.:

Параграф 4. Круговые диаграммы и элементы 3D графики

Построение круговых диаграмм с элементами 3D графики требует несколько больших затрат по сравнению с рассмотренным выше материалом. Прежде всего, необходимо определить дополнительные переменные для величин: оси эллипса (vfDiamX, vfDiamY), центр круговой диаграммы (vfXcirc, vfYcirc). Кроме того, если мы хотим, что бы в легенде (пояснению к графику) цвета надписей соответствовали цветам секторов диаграммы, то потребуется задать массив цветов однозначно соответствующий массиву цветов кистей. Зададим в классе:

Основная функция для рисования диаграммы имеет ряд особенностей, связанных с формированием объемности и расположением надписей.

Первый этап: Против часовой стрелки рисуем последний сектор и сектора, выходящие за границу 180 градусов, но не заходящие за границу 270 градусов. Рисовать будем кистью с прозрачностью, например 25%, и каждый из них со сдвигом на 1 пиксель вниз. Иначе, если толщина диаграммы задана 20 пикселей, то сектор потребуется нарисовать 20 раз, каждый раз сдвигая на 1 пиксель вниз (Рис.12.1.).

Рис.12.1. Первый этап создания круговой диаграммы

Второй этап: Накладываем на данную диаграмму сектора от 0 градусов до сектора, заходящего за 270 градусов, используя SolidBrush и не выполняя сдвиг - рисуем каждый сектор один раз из точки рисования всей диаграммы (Рис.12.2.).

Рис.12.2. Второй этап создания круговой диаграммы

Третий этап: по часовой стрелки рисуем сектора, начиная со второго, используя HatchBrush. Рисование выполняем до сектора заходящего за границу -90 градусов, со сдвигом на толщину диаграммы (Рис.12.3.).

Рис.12.3. Третий этап создания круговой диаграммы

Четвертый этап: По часовой стрелке накладываем без сдвига, начиная со второго сектора до сектора, заходящего за границу -90 градусов, используя SolidBrush (Рис.12.4.).

Рис.12.4. Четвертый этап создания круговой диаграммы

Отдельно рисуем первый сектор, сначала используя HatchBrush со сдвигом на толщину диаграммы, затем накладываем сектор SolidBrush без сдвига. Координаты сектора определяем с учетом параметров сдвига секторов (Рис.12.5.).

Алгоритм рисования можно упростить, например, один раз и последним этапом наложить сектора эллипса, нарисованный кистью SolidBrush, но, в этом случае пострадает наглядность.

Эти этапы рисования выполняет следующая функция:

Добавляем функции надписи и легенду и, в принципе, построение диаграммы закончено. Единственное, что потребуется от нас при рисовании надписей на диаграмме - это немного вспомнить начальную школу при расчете координат нанесения значений:

Оформим вызовы функций:

Отметим, что при задании толщины диаграммы, равной нулю, получим обычную эллиптическую диаграмму, а при равенстве осей Х и Y - круговую.

Результат выполнения решения показан на Рис.12.6:

Рис.12.6. Круговая диаграмма

В заключении, еще раз повторим, что все параметры целесообразно иметь настраиваемыми, что позволяет быстро подобрать приемлемый вид графического отображения для демонстрации. Целесообразно также выполнить автономную настройку диаграмм по тестовым значениям (как это сделано в программе LitFregMeter - см. Параграф 2.). Тогда мы сможем быстро подбирать параметры, например так:

Параграф 5. Базовый класс для рисования графиков

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

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

Молчанов Владислав 21.09.2005г. Материал переработан 14.10.2008г.

Относительно не давно обновил студию, и к моему удивлению я не обнаружил в ней Диаграмм классов. Оказалось что их надо было выбирать при установки студии. Но обо всем по порядку. Диаграмма классов очень похожа на язык UML, но не путайте, это язык DSL— domain specific language это определенный архитектурный слой который описывает бизнес сущности и модель. Применяют его в программировании в основном для визуального представления всех классов и методов проекта и их внутренний логику взаимодействия. Хотя UML был предназначен для конструирования приложения, часть возможностей перетекла и в DSL. Тут таким же образом можно наглядно используя конструктор, создавать, классы, поля и методы, проводить между ними ассоциативные связи итд. Однако мы отошли от нашей проблемы, а именно того как установить класс диаграмм в visual studio 2019.


Для этого зайдем в студию и выберем в пункте Средства>Получить средства и компоненты… как показано на рисунке выше. Запустится Visual Studio Installer в котором необходимо установить галочку в пункте Разработка расширений Visual Studio, а в окне Сводка установить галочку Конструктор компонентов. И нажать кнопку Изменить, не забудьте перед этим закрыть саму студию. Недостающие компоненты будут загружены и когда вы запустите студию сможете воспользоваться классом диаграмм.


Чтобы им воспользоваться вам необходимо выделить проект нажать правую кнопку мыши, далее выбрать Представление и > Перейти к диаграмме классов.


В последних версия VS переименовали компонент, потому многие его не могу найти, для этого я дополню статью.


заходим в Средства >>Получить средства и компоненты …

Откроется окно Visual Studio Installer


Далее вам не обходимо перейти на вкладку Отдельный компоненты.


И в поле поиска вписать слово конструктор.

От фильтруется список и вы увидите компонент Конструктор классов нужно установить галочку на компоненте. И нажать в правом углу кнопку изменить.


Произойдет загрузка компонента и у вас вновь откроется студия по завершению.


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

Читайте также: