Давно на нашем блоге не появлялось никаких статей - все мы были заняты реализацией нашего маленького, но амбициозного проекта - Конструктор схем онлайн.
В статьях вы могли видеть наглядные изображения схем подключения, и, возможно, некоторые из вас думали что в их создании замешан неплохой художник.
Но нет. Я готовил их с помощью программы Fritzing. Можете сами с ней ознакомиться, есть версии для различных операционных систем и много чего интересного.
И в какой-то момент, когда схем стало слишком много, и стало очень лениво открывать каждый раз приложение, да и не везде оно было предустановленно, у нас родилась идея реализовать подобное приложение онлайн.
Пока оно находится на стадии последних тестирований и доработок, но уже достаточно ясно видны очертания нашего будущего проекта.
И так, встречайте - онлайн конструктор схем.
Интерфейс мы постарались сделать интуитивно понятным, но все-таки я расскажу что он может, и как с ним работать.
Первым делом, зайди в конструктор мы увидим следующее окно
В верхней плашке в правой части мы видим кнопки управления - Сохранить изображение, Активировать сетку, Увеличить, Уменьшить и Домой
- Сохранить изображение - открывает новое окно с готовой картинок, в котором остается только нажать Ctrl+S и сохранить изображение
- Активировать сетку - включает режим перемещения по сетке, и все соединительные линии и элементы будут передвигаться только по нарисованной сетке
- Увеличить/Уменьшить - изменяет масштаб. Также это можно делать с помощью колесика мышки.
- Домой - вернуться назад, на страницу выбора калькуляторов в нашем магазине
Перейдем к левому меню и пойдем сверху вниз
2 кнопки в начале - ALL и MY отвечают за переключение деталей. ALL - детали из нашей базы, MY - детали загруженные вами (да, если вы не нашли необходимых деталей у нас, то можете загрузить их изображения)
После идет строка поиска. Единственный минус, что все названия и описания только на английском. Так что в нее вводить нужно только английские символы. Поиск осуществляется нажатием Enter
Ниже переключатель страниц, а после него само поле с модулями, датчиками, платами и всем всем всем.
При наведении на изображение ниже появляется информацию об элементе - название, описание и полная картинка.
Добавление на холст происходит путем перетаскивания в нужное место.
И после этого мы получаем элемента на холсте.
При наведении на него, все его пины, ноги, выходы подсвечиваются желтыми квадратами. Это именно те места, из которых можно начать вести линии - соединительные провода (далее линии).
Расположение проводов можно изменять, перетаскивая их за точки изгиба, или добавлять новые точки изгиба, просто потянув за линию в нужном месте
Точки изгиба в любой момент можно удалить, щелкнув по ним правой кнопкой. У линий тоже есть контекстное меню в котором, помимо удаления, можно еще выбрать цвет линии. При выборе цвета, следующая линия будет такого же цвета.
Контекстное меню элемента состоит из 3х пунктов - повернуть на 90 градусов влево, вправо и удалить элемент
Если вы не можете найти элемент в базе, то вам нужно найти его изображение в интернете. Так как Fritzing достаточно большой проект, то большая часть модулей уже доступна в интернете.
Например нам нужен драйвер двигателей L298N. Вводим в гугле fritzing L298N и ищем нужную нам картинку. В некоторых случаях ее можно немного отредактировать в редакторе.
Данное изображение подходит более чем.
Переходим во вкладку MY и загружаем его
Дальше все также - перетаскиваем на холст, и начинаем подводить линии. Единственный минус - контакты не определяются автоматически, поэтому начать вести линию со своего объекта не получится. Но получится довести линию до него, например, с Arduino MEGA.
Попробуем подключить его к Arduino MEGA и сохранить наше изображение.
Как видите, все получилось достаточно просто, быстро, и без лишних трудозатрат.
Так что пользуйтесь на здоровье, и обо всех замечаниях/недоработках сразу же пишите нам.
2020-04-21 01:04