Редактор кода

Редактор кода - это онлайн-редактор с возможностью реального времени совместного редактирования, который позволяет редактировать ваши Script assets, а также все другие текстовые ассеты, такие как JSON, HTML, CSS и т.д.

Открытие редактора кода

Вы можете открыть редактор кода из PlayCanvas Editor, нажав Ctrl + I. Вы также можете щелкнуть на этот значок панели инструментов:

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

Интерфейс

Меню

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

Файлы

Здесь вы можете увидеть все ассеты, которые могут быть отредактированы с помощью редактора кода. Щелкните по ассету, чтобы выбрать его. Выбор ассета откроет его в текстовом редакторе для редактирования.

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

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

Вкладки

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

Текстовый редактор

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

Кроме того, редактор поддерживает автозавершение. Когда вы набираете букву или нажимаете Ctrl+Space, вы увидите список предложений автозавершения.

Редактор также будет проверять ваш JavaScript-код. Это означает, что во время набора кода редактор будет сканировать ваш код на возможные ошибки или подозрительное использование. Это делается с помощью JSHint, который также поддерживает специальные комментарии, контролирующие его поведение. Для получения списка этих специальных комментариев ознакомьтесь с документацией.

Соавторы

Редактор поддерживает совместное редактирование в реальном времени всеми пользователями с разрешением на редактирование кода. Здесь вы увидите аватары других пользователей.

Строка состояния

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

Сохранение и откат

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

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

Палитра команд

Все функции редактирования текста можно найти с помощью палитры команд через Ctrl + Shift + P (Windows) или Cmd + Shift + P (Mac).

Горячие клавиши

Редактор поддерживает различные сочетания клавиш для упрощения редактирования кода. Вы можете найти все эти опции в меню или палитре команд. Наиболее распространенные можно найти ниже:

Поиск

Вы можете искать текст в файле, нажав Ctrl + F (Windows) или Cmd + F (Mac). Это откроет панель "Найти" в верхнем правом углу:

Введите искомое слово здесь и нажмите Enter. Вы можете перемещаться между совпадениями, непрерывно нажимая Enter (или Shift + Enter, чтобы вернуться назад).

Если вы хотите заменить совпадение, введите текст, на который вы хотите заменить его, в поле ввода "Заменить" справа. Затем нажмите Enter, чтобы заменить совпадение, и продолжайте нажимать Enter, чтобы заменить каждое последующее совпадение (или Shift + Enter, чтобы заменить назад).

Найти в файлах

Вы также можете найти слово, ища его во всех ваших файлах. Для этого нажмите Ctrl + Shift + F, чтобы открыть панель "Найти в файлах" внизу. Как и раньше, введите искомое слово и нажмите Enter. Это откроет новую вкладку, где будут отображаться результаты поиска:

Слева от полей ввода есть различные параметры поиска. Они позволяют искать с использованием регулярных выражений, выполнять поиск с учетом регистра или искать целые слова. Если вы хотите узнать больше о regex и поэкспериментировать с ним, то RegExr - отличный сайт с шпаргалками, примерами и онлайн-редактором для тестирования выражений regex.

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

Быстрое открытие

Вы можете быстро открыть файл, нажав Ctrl + P (или Cmd + P на Mac), что откроет панель, где вы можете искать файл по его имени. Начните вводить имя файла, и панель выполнит нечеткий поиск, чтобы найти нужный файл. Нажмите Enter, чтобы открыть выбранный файл.

Настройки

Вы можете изменить свои настройки, нажав на Правка -> Настройки. Здесь вы можете изменить размер шрифта для текстового редактора и изменить другие параметры редактора.

Дополнительные советы

Быстрый поиск

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

Редактирование с несколькими выделениями

Удерживая клавишу Alt и щелкая левой кнопкой мыши, вы добавите еще один курсор в редактор. Это позволяет быстро вносить одинаковые изменения в несколько областей файла.

Прямоугольное выделение

Удерживая клавиши Alt + Shift и перетаскивая левую кнопку мыши, вы создадите прямоугольное выделение, которое полезно для выделения и редактирования столбцов текста.