Commit 5e7900eb authored by Elizaveta Kakhovskaya's avatar Elizaveta Kakhovskaya

Update algorithm.rst

parent 223e29ef
...@@ -7,7 +7,7 @@ ...@@ -7,7 +7,7 @@
1. Для создания нового приложения необходимо выбрать пункт меню "Создать" 1. Для создания нового приложения необходимо выбрать пункт меню "Создать"
.. figure:: img/1.png .. figure:: img/1.png
Открывается окно свойств приложения рис. Окно свойств приложения
2. В появившемся окне необходимо указать: 2. В появившемся окне необходимо указать:
...@@ -20,7 +20,7 @@ ...@@ -20,7 +20,7 @@
3. Выделить корневую папку root, нажать на "+" и добавить поочередно страницы с названиями "Авторизация" и "Главная". При создании нужно указать свойства для каждой страницы: 3. Выделить корневую папку root, нажать на "+" и добавить поочередно страницы с названиями "Авторизация" и "Главная". При создании нужно указать свойства для каждой страницы:
.. figure:: img/2.png .. figure:: img/2.png
Окно создания страницы "Авторизация" рис. Окно создания страницы "Авторизация"
* Название страницы - отображается в общем дереве страниц * Название страницы - отображается в общем дереве страниц
* Код страницы - используется для настройки переходов между страницами приложения, а также для указания страницы в скриптах приложения * Код страницы - используется для настройки переходов между страницами приложения, а также для указания страницы в скриптах приложения
...@@ -35,7 +35,7 @@ ...@@ -35,7 +35,7 @@
Для начала нужно указать, что эта страница является стартовой для приложения и является страницей авторизации. Для этого нужно кликнуть правой кнопкой по названию в блоке "Страницы": Для начала нужно указать, что эта страница является стартовой для приложения и является страницей авторизации. Для этого нужно кликнуть правой кнопкой по названию в блоке "Страницы":
.. figure:: img/4.png .. figure:: img/4.png
Окно свойств страницы рис. Окно свойств страницы
Сама страница открывается двойным кликом по названию или иконке в блоке "Страницы". Сама страница открывается двойным кликом по названию или иконке в блоке "Страницы".
...@@ -43,7 +43,7 @@ ...@@ -43,7 +43,7 @@
Перед тем, как добавлять на страницу новый компонент, необходимо выделить панель, на которой он будет расположен, кликом левой кнопки мыши. После этого справа отобразится блок свойств выделенной панели, а в верхней части (выше панели вкладок) будут расположены кнопки управления компонентами: Перед тем, как добавлять на страницу новый компонент, необходимо выделить панель, на которой он будет расположен, кликом левой кнопки мыши. После этого справа отобразится блок свойств выделенной панели, а в верхней части (выше панели вкладок) будут расположены кнопки управления компонентами:
.. figure:: img/5.png .. figure:: img/5.png
Открывается окно свойств приложения рис. Открывается окно свойств приложения
Добавим на ``root-panel`` компонент "Панель" - это будет наше окно авторизации. Укажем компоненту выравнивание - по центру. Добавим на ``root-panel`` компонент "Панель" - это будет наше окно авторизации. Укажем компоненту выравнивание - по центру.
...@@ -51,7 +51,7 @@ ...@@ -51,7 +51,7 @@
Выделив только что созданную панель, добавим в нее еще три панели: Выделив только что созданную панель, добавим в нее еще три панели:
.. figure:: img/7.png .. figure:: img/7.png
Создание панелей для окна авторизации рис. Создание панелей для окна авторизации
* В верхнюю из добавленных трёх панелей добавляем компонент - Надпись, в Свойствах указываем текст надписи - "Авторизация" * В верхнюю из добавленных трёх панелей добавляем компонент - Надпись, в Свойствах указываем текст надписи - "Авторизация"
* В среднюю добавим два компонента "Поле для ввода" - для логина и пароля. Выбираем иконки и прописываем текст для плейсхолдера * В среднюю добавим два компонента "Поле для ввода" - для логина и пароля. Выбираем иконки и прописываем текст для плейсхолдера
...@@ -60,58 +60,58 @@ ...@@ -60,58 +60,58 @@
Страница авторизации почти готова: Страница авторизации почти готова:
.. figure:: img/6.png .. figure:: img/6.png
Окно авторизации рис. Окно авторизации
Добавим кейс для кнопки "Войти": Добавим кейс для кнопки "Войти":
.. figure:: img/8.png .. figure:: img/8.png
Кейс перехода на главную страницу рис. Кейс перехода на главную страницу
5. Перейдём к Главной странице. Для начала добавим на нее логотип: компонент Панель, внутрь вложим компонент Изображение: 5. Перейдём к Главной странице. Для начала добавим на нее логотип: компонент Панель, внутрь вложим компонент Изображение:
.. figure:: img/9.png .. figure:: img/9.png
Создание панели с логотипом рис. Создание панели с логотипом
Выделяем компонент Изображение, указываем Источник - Из хранилища. Затем переходим в Хранилище Synergy, открываем нужный файл и его свойства: Выделяем компонент Изображение, указываем Источник - Из хранилища. Затем переходим в Хранилище Synergy, открываем нужный файл и его свойства:
.. figure:: img/10.png .. figure:: img/10.png
Копируем идентификатор изображения рис. Копируем идентификатор изображения
Вставляем скопированный идентификатор изображения в Свойства компонента: Вставляем скопированный идентификатор изображения в Свойства компонента:
.. figure:: img/11.png .. figure:: img/11.png
Предпросмотр добавленного изображения рис. Предпросмотр добавленного изображения
На панель с логотипом добавим компонент "Выбор языка". Чтобы сместить его в правый угол, сначала добавим еще одну панель и перенесем компонент при помощи ctrl+x - ctrl+v: На панель с логотипом добавим компонент "Выбор языка". Чтобы сместить его в правый угол, сначала добавим еще одну панель и перенесем компонент при помощи ctrl+x - ctrl+v:
.. figure:: img/12.png .. figure:: img/12.png
Добавленная панель с выбором языка рис. Добавленная панель с выбором языка
Затем укажем ширину панелей, на которых располагаются компоненты: 20% для логотипа и 80% для локали. Также выбираем выравнивание для этой панели: Затем укажем ширину панелей, на которых располагаются компоненты: 20% для логотипа и 80% для локали. Также выбираем выравнивание для этой панели:
.. figure:: img/13.png .. figure:: img/13.png
Выравнивание для панели с выбором языка рис. Выравнивание для панели с выбором языка
Приветствие: добавляем панель и в нее компонент "Надпись", указываем текст надписи и ее свойства: Приветствие: добавляем панель и в нее компонент "Надпись", указываем текст надписи и ее свойства:
.. figure:: img/14.png .. figure:: img/14.png
Панель приветствия рис. Панель приветствия
Выделив корневую панель, добавим компонент "Видео", указав его источник: Выделив корневую панель, добавим компонент "Видео", указав его источник:
.. figure:: img/15.png .. figure:: img/15.png
Добавление видео рис. Добавление видео
Сохраняем страницу, переходим в меню приложения и нажимаем "Деплой". По адресу, указанному в свойствах приложения, можно открыть наше приложение (http://ip:8080/url): Сохраняем страницу, переходим в меню приложения и нажимаем "Деплой". По адресу, указанному в свойствах приложения, можно открыть наше приложение (http://ip:8080/url):
.. figure:: img/16.png .. figure:: img/16.png
Страница авторизации приложения рис. Страница авторизации приложения
После авторизации попадаем на главную страницу: После авторизации попадаем на главную страницу:
.. figure:: img/17.png .. figure:: img/17.png
Главная страница приложения рис. Главная страница приложения
Приложение готово! Приложение готово!
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment