DroidScript
DroidScript
инструменты для мобильной разработки

Интерфейс Sketchware

Sketchware  
13.04.2019

Установка Sketchware производится из магазина приложений Google Play на устройства Android 4.4 или выше. Если у вас нет подходящего устройства, то можно воспользоваться эмулятором BlueStacks 4 с версией Android 7.1.

Для устранения путаницы Sketchware далее именуется программой.

Начальный экран

После открытия программы появится начальный экран.

Начальный экран

Для создания бесплатной учётной записи Sketchware с возможностью безопасного хранения проектов нажмите кнопку Sign In.

Нажмите кнопку Explore для перехода на страницу списка ваших проектов MY PROJECTS.

Браузер проектов

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

Ниже расположены вкладки.

MY PROJECTS (мои проекты) - браузер проектов, в области которого находится кнопка кнопка для публикации проектов в магазине приложений Publish To Google Play Store и список с существующими проектами

Tutorials - примеры с пошаговым выполнением

Вкладка с учебными примерами

Collection - коллекция общедоступных виджетов и блоков

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

В правой части вкладки каждого проекта на вкладке MY PROJECTS находится кнопка "вниз" для отображения всплывающего меню с командами:

  • Settings - открыть диалог настроек проекта
  • Publish - опубликовать проект в магазине приложений
  • Export - отправить архив проекта по email
  • Delete - удалить проект

Для открытия существующего проекта щёлкните по его вкладке, а для создания нового проекта нажмите плавающую кнопку "+".

Диалог настроек для нового проекта

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

Рассмотрим экраны, появляющиеся при нажатии на ссылки боковой панели действий.

Боковая панель (sidebar)

Боковая панель

  • Subscribe - платная подписка (публикация в Google Play Store, монетизация AdMob, работа в среде разработки без рекламы, экспорт кода в Android Studio)
  • Documentation - документация
  • Share with Friends - поделиться проектом с друзьями
  • System Settings - системные настройки
  • Program information - информация о программе
  • Language Settings - выбор языка (доступен русский язык с забавным переводом)
  • Export URLs - экспорт url

В нижней части даны ссылки на Facebook, официальный сайт и сообщество в Slack.

После открытия проекта откроется редактор вида на вкладке VIEW.

Экран проекта

В заголовке окна расположены:

  • Ссылка Back (<-) для выхода из проекта
  • Заголовок с названием проекта
  • Кнопки отмены и повтора последнего действия
  • Кнопка для сохранения проекта
  • Ссылка на выпадающее меню

Ниже расположена область вкладок:

  • VIEW - редактор вида
  • EVENT - редактор событий
  • COMPONENT - список с добавленными в порект компонентами

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

В нижней части интерфейса находится выпадающий список активностей (видов) для переключения между ними, создания новой активности или настройке её свойств, а также кнопка запуска проекта на выполнение Run (компиляция в apk-файл, установка данного файла и его запуск).

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

Ниже находится область вкладок с кнопками для настройки внешнего вида и поведения выбранного элемента макета:

  • Basic - кнопки для редактирования основных свойств
  • Resent - кнопки для редактирования недавно изменённых свойств
  • Event - кнопки с ссылками на обработчики событий для быстрого перехода в редактор блоков

Выпадающее меню

В этом меню находятся команды для работы с проектом:

  • Library - настройка компонентов
  • View - управление активностями (экранами)
  • Image - управление графическими ресурсами
  • Sound - управление звуковыми ресурсами
  • Font - управление шрифтами
  • Show Source code - отображения исходного кода проекта (Java и Xml)
  • Collection - управление коллекциями общедоступных ресурсав (изображения, звуки, шифты, виджеты и блоки). Ресурсы, помещённые в эти коллекции, становятся доступными для использования в любом проекте вашего аккаунта

Экран свойств

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

Палитра свойств

Данный экран становится доступен после нажатия на кнопку "See all", находящуюся в правой части всплывающей палели свойств выбранного элемента.

Редактор событий (EVENT)

Предназначен для создания событийной логики работы приложения.

Редактор событий

Для добавления элементу обработчика события сначала нужно выбрать категорию, в которой он находится:

  • Activity - активность
  • View - вид
  • Component - компонент
  • Drawer - выдвигающаяся боковая панель
  • MoreBlock - пользовательские блоки

После выбора категории в правой части редактора отобразится список элементов с определённым для него по умолчанию обработчиком события. Вы можете выбрать данный обработчик для его редактирования или добавить новый обработчик путём нажатия на плавующую кнопку "+" и выбора его из появившегося диалога.

Вкладка COMPONENT

Предназначена для добавления в проект компонентов - сложных многофункциональных объектов. Для добавления компонента в проект нажмите плавающую кнопку "+".

Редактор блоков

Интерфейс редактора блоков состоит из заголовка, рабочего поля и палитры блоков.

Редактор блоков

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

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

Для размещения блока выберите его из палиты и перетащите в нужное место рабочего поля. Для добавления блока в глобальную коллекцию выберите его на рабочем поле и перетащите на область Collection, которая появится в заголовке.

Информация о программе

Информация о программе

  • Version - номер версии программы
  • Reset system - сброс системных настроек/настроек и данных
  • Check update - проверка обновления
  • Update Log - журнал обновлений от разработчиков
  • Suggest Ideas - предложение идей по развитию программы
  • Share with Friends - поделиться с друзьями
  • Facebook - ссылка на страницу рограммы в Facebook
  • Medium - ссылка на страницу информационного сообщества
  • Website - ссылка на официальный сайт программы
  • E-mail - электронная почта
  • Telephone - телефон
  • Service terms - лицензионное соглашение
  • System information - информация об используемой системе
  • Open Source License - информация с ссылками на используемые в программе технологии, обладающих лицензией с открытым исходным кодом

Системные настройки программы (System Settings)

Системные настройки программы

В настройках можно включить:

  • вибросигнал при выборе виджета или блока долгим нажатием
  • автосохранение при выходе из проекта
  • использование уведомлений и оповещений
Sketchware  
© 2016-2018 Александр Страшко