Разбор структуры сценария ========================= .. note:: В данном разделе в качестве примера приведён разбор структуры графического интерфейса главного экрана сценария с распознаванием. Сценарий распознавания состит из одного главного экрана. .. figure:: ../../../manual_admin/Сценарии/Разбор_сценария/picture/exposition.png :scale: 65 % :align: center Главный экран В свою очередь главный экран состоит из: 1. Шапка с весом 2. Распознанные товары 3. Все товары 4. Логотип Далее будут показаны фрагменты кода для этого экрана, полный код для главного экрана представлен ниже, он расположен в файле **home.json**. .. code-block:: json { "type": "RelativeLayout", "layout_width": "match_parent", "layout_height": "match_parent", "children": [ { "type": "RelativeLayout", "layout_width": "match_parent", "layout_height": "278dp", "layout_alignParentTop": "true", "background": "#E6E6E6" }, { "type": "Component", "layout": "header", "layout_width": "wrap_content", "layout_height": "wrap_content", "layout_alignParentTop": "true", "layout_alignParentRight": "true" }, { "type": "AppCompatImageView", "layout_width": "380dp", "layout_height": "100dp", "layout_alignParentLeft": "true", "layout_alignParentTop": "true", "jpg": "$scenario/images/logo", "action_long": { "type": "GO_TO_SERVICE" }, "layout_marginTop": "11dp" }, { "type": "TextView", "layout_alignParentLeft": "true", "layout_alignParentTop": "true", "font_family": "geometria", "gravity": "bottom", "textColor": "#000000", "textSize": "24sp", "layout_marginLeft": "46dp", "layout_marginTop": "112dp", "text": "@string/recognition" }, { "type": "CardListViewWeightObserverRelativeLayout", "layout_width": "wrap_content", "id": "PredictionProductGrid", "data-url": "app://mertech.ru/scales/products/predict?limit=6", "layout_height": "wrap_content", "layout_alignParentTop": "true", "layout_alignParentLeft": "true", "layout_marginLeft": "47dp", "layout_marginTop": "148dp", "children": [ { "type": "Card", "layout": "product", "id": "fav1", "layout_width": "wrap_content", "layout_height": "wrap_content", "layout_alignParentTop": "true", "layout_alignParentLeft": "true" }, { "type": "Card", "layout": "product", "id": "fav2", "layout_width": "wrap_content", "layout_height": "wrap_content", "layout_alignParentTop": "true", "layout_toRightOf": "fav1" }, { "type": "Card", "layout": "product", "id": "fav3", "layout_width": "wrap_content", "layout_height": "wrap_content", "layout_alignParentTop": "true", "layout_toRightOf": "fav2" }, { "type": "Card", "layout": "product", "id": "fav4", "layout_width": "wrap_content", "layout_height": "wrap_content", "layout_alignParentTop": "true", "layout_toRightOf": "fav3" }, { "type": "Card", "layout": "product", "id": "fav5", "layout_width": "wrap_content", "layout_height": "wrap_content", "layout_alignParentTop": "true", "layout_toRightOf": "fav4" }, { "type": "Card", "layout": "product", "id": "fav6", "layout_width": "wrap_content", "layout_height": "wrap_content", "layout_alignParentTop": "true", "layout_toRightOf": "fav5" } ] }, { "type": "CardListViewRelativeLayout", "layout_width": "wrap_content", "id": "ProductGrid", "data-url": "app://mertech.ru/scales/products?order_by=plu&null_fields=category", "layout_height": "wrap_content", "layout_alignParentTop": "true", "layout_alignParentLeft": "true", "layout_marginLeft": "48dp", "layout_marginTop": "288dp", "children": [ { "type": "Card", "layout": "product", "id": "product1", "layout_width": "wrap_content", "layout_height": "wrap_content", "layout_alignParentTop": "true", "layout_alignParentLeft": "true" }, { "type": "Card", "layout": "product", "id": "product2", "layout_width": "wrap_content", "layout_height": "wrap_content", "layout_alignParentTop": "true", "layout_toRightOf": "product1" }, { "type": "Card", "layout": "product", "id": "product3", "layout_width": "wrap_content", "layout_height": "wrap_content", "layout_alignParentTop": "true", "layout_toRightOf": "product2" }, { "type": "Card", "layout": "product", "id": "product4", "layout_width": "wrap_content", "layout_height": "wrap_content", "layout_alignParentTop": "true", "layout_toRightOf": "product3" }, { "type": "Card", "layout": "product", "id": "product5", "layout_width": "wrap_content", "layout_height": "wrap_content", "layout_alignParentTop": "true", "layout_toRightOf": "product4" }, { "type": "Card", "layout": "product", "id": "product6", "layout_width": "wrap_content", "layout_height": "wrap_content", "layout_alignParentTop": "true", "layout_toRightOf": "product5" }, { "type": "Card", "layout": "product", "id": "product7", "layout_width": "wrap_content", "layout_height": "wrap_content", "layout_alignParentLeft": "true", "layout_below": "product1" }, { "type": "Card", "layout": "product", "id": "product8", "layout_width": "wrap_content", "layout_height": "wrap_content", "layout_toRightOf": "product7", "layout_below": "product1" }, { "type": "Card", "layout": "product", "id": "product9", "layout_width": "wrap_content", "layout_height": "wrap_content", "layout_toRightOf": "product8", "layout_below": "product1" }, { "type": "Card", "layout": "product", "id": "product10", "layout_width": "wrap_content", "layout_height": "wrap_content", "layout_toRightOf": "product9", "layout_below": "product1" }, { "type": "Card", "layout": "product", "id": "product11", "layout_width": "wrap_content", "layout_height": "wrap_content", "layout_toRightOf": "product10", "layout_below": "product1" }, { "type": "Card", "layout": "product", "id": "product12", "layout_width": "wrap_content", "layout_height": "wrap_content", "layout_toRightOf": "product11", "layout_below": "product1" }, { "type": "Card", "layout": "product", "id": "product13", "layout_width": "wrap_content", "layout_height": "wrap_content", "layout_toRightOf": "product7", "layout_below": "product7" }, { "type": "Card", "layout": "product", "id": "product14", "layout_width": "wrap_content", "layout_height": "wrap_content", "layout_toRightOf": "product13", "layout_below": "product7" }, { "type": "Card", "layout": "product", "id": "product15", "layout_width": "wrap_content", "layout_height": "wrap_content", "layout_toRightOf": "product14", "layout_below": "product7" }, { "type": "Card", "layout": "product", "id": "product16", "layout_width": "wrap_content", "layout_height": "wrap_content", "layout_toRightOf": "product15", "layout_below": "product7" }, { "type": "NavigateButtonListView", "id": "navigate_left", "layout_width": "94dp", "layout_height": "94dp", "cardListView": "ProductGrid", "layout_below": "product7", "layout_marginTop": "25dp", "layout_alignParentLeft": "true", "enableImageSrc": "$scenario/images/left_enable.png", "disableImageSrc": "$scenario/images/left_disable.png", "listViewAction": "PREV" }, { "type": "NavigateButtonListView", "id": "navigate_right", "layout_width": "94dp", "layout_height": "94dp", "cardListView": "ProductGrid", "layout_below": "product7", "layout_marginTop": "25dp", "layout_toRightOf": "product16", "layout_marginLeft": "50dp", "enableImageSrc": "$scenario/images/right_enable.png", "disableImageSrc": "$scenario/images/right_disable.png", "listViewAction": "NEXT" } ] } ] } Шапка с весом ------------- Для шапки с весом используется отдельный контрол ``"header"``, который ссылается на файл **header.json**. .. code-block:: json { "type": "Component", "layout": "header", "layout_width": "wrap_content", "layout_height": "wrap_content", "layout_alignParentTop": "true", "layout_alignParentRight": "true" }, Файл **header.json** представлен ниже. .. code-block:: json { "type": "RelativeLayout", "layout_width": "546dp", "layout_height": "115dp", "layout_alignParentRight": "true", "layout_alignParentTop": "true", "background": { "type": "shape", "shape": "rectangle", "children": [ { "type": "corners", "bottomLeftRadius": "17dp" }, { "type": "solid", "color": "#CCCCCC" } ] }, "children": [ { "type": "RelativeLayout", "id": "header_block0", "layout_width": "40dp", "layout_height": "122dp", "layout_marginRight": "2dp", "layout_toLeftOf": "header_block1", "layout_alignParentTop": "true", "paddingTop": "16dp", "paddingRight": "5dp", "paddingLeft": "5dp", "paddingBottom": "10dp", "background": { "type": "shape", "shape": "rectangle", "children": [ { "type": "corners", "bottomLeftRadius": "17dp" }, { "type": "solid", "color": "#FFFFFF" } ] }, "children": [ { "type": "TextView", "id": "tare", "layout_height": "wrap_content", "layout_width": "match_parent", "gravity": "center", "layout_toBottomOf": "zero", "textSize": "15sp", "textColor": "#000000", "text": "-Т-", "font_family": "geometria_medium", "animation_object": { "animationType": "ALPHA", "event": { "eventFlags": "128", "any": "true" }, "duration": "1", "fromAlpha": "1.0", "toAlpha": "0.0" }, "background": { "type": "shape", "shape": "rectangle", "children": [ { "type": "stroke", "color": "#CCCCCC", "width": "2dp" } ] } }, { "type": "TextView", "id": "zero", "layout_height": "wrap_content", "layout_width": "match_parent", "gravity": "center", "layout_toBottomOf": "stable", "textSize": "15sp", "layout_marginTop": "25dp", "textColor": "#000000", "text": "-0-", "animation_object": { "animationType": "ALPHA", "event": { "eventFlags": "48", "any": "true" }, "duration": "1", "fromAlpha": "1.0", "toAlpha": "0.0" }, "font_family": "geometria_medium", "background": { "type": "shape", "shape": "rectangle", "children": [ { "type": "stroke", "color": "#CCCCCC", "width": "2dp" } ] } }, { "type": "TextView", "id": "stable", "layout_height": "wrap_content", "layout_width": "match_parent", "gravity": "center", "textSize": "15sp", "layout_marginTop": "50dp", "textColor": "#000000", "text": "◣◢", "font_family": "geometria_medium", "animation_object": { "animationType": "ALPHA", "event": { "eventFlags": "4", "any": "true" }, "duration": "1", "fromAlpha": "1.0", "toAlpha": "0.0" }, "background": { "type": "shape", "shape": "rectangle", "children": [ { "type": "stroke", "color": "#CCCCCC", "width": "2dp" } ] } } ] }, { "type": "RelativeLayout", "id": "header_block1", "layout_width": "182dp", "layout_height": "122dp", "layout_toLeftOf": "header_block2", "layout_alignParentTop": "true", "layout_marginRight": "2dp", "paddingTop": "16dp", "paddingRight": "11dp", "paddingBottom": "10dp", "background": { "type": "shape", "shape": "rectangle", "children": [ { "type": "corners", "bottomLeftRadius": "0dp" }, { "type": "solid", "color": "#FFFFFF" } ] }, "children": [ { "type": "TextView", "layout_width": "wrap_content", "layout_height": "wrap_content", "textSize": "19sp", "textColor": "#000000", "layout_alignParentRight": "true", "layout_alignParentTop": "true", "text": "@string/kg", "font_family": "geometria_medium", "background": "#FFFFFF" }, { "type": "TextWeightView", "layout_width": "wrap_content", "layout_height": "wrap_content", "textSize": "43sp", "format": "%.3f", "point": "false", "textColor": "#000000", "layout_alignParentRight": "true", "layout_alignParentBottom": "true", "font_family": "geometria_medium", "background": "#FFFFFF" } ] }, { "type": "RelativeLayout", "id": "header_block2", "layout_toLeftOf": "header_block3", "layout_width": "160dp", "layout_height": "122dp", "layout_alignParentTop": "true", "layout_marginRight": "2dp", "background": "#FFFFFF", "paddingTop": "16dp", "paddingRight": "11dp", "paddingBottom": "10dp", "children": [ { "type": "TextView", "layout_width": "wrap_content", "layout_height": "wrap_content", "textSize": "19sp", "textColor": "#000000", "layout_alignParentRight": "true", "layout_alignParentTop": "true", "text": "@string/header_cost", "font_family": "geometria_medium" }, { "type": "TextView", "layout_width": "wrap_content", "layout_height": "wrap_content", "textSize": "40sp", "textColor": "#000000", "layout_alignParentRight": "true", "layout_alignParentBottom": "true", "text": "0,00", "font_family": "geometria_medium" } ] }, { "type": "RelativeLayout", "id": "header_block3", "layout_width": "160dp", "layout_height": "122dp", "layout_alignParentRight": "true", "layout_alignParentTop": "true", "background": "#FFFFFF", "paddingTop": "16dp", "paddingRight": "27dp", "paddingBottom": "10dp", "children": [ { "type": "TextView", "layout_width": "wrap_content", "layout_height": "wrap_content", "textSize": "19sp", "textColor": "#000000", "layout_alignParentRight": "true", "layout_alignParentTop": "true", "text": "@string/header_price", "font_family": "geometria_medium" }, { "type": "TextView", "layout_width": "wrap_content", "layout_height": "wrap_content", "textSize": "40sp", "textColor": "#000000", "layout_alignParentRight": "true", "layout_alignParentBottom": "true", "text": "0,00", "font_family": "geometria_medium" } ] } ] } Файл **header.json** состоит из трех блоков, в первом показывается вес за счет контрола ``"TextWeightView"``, остальные блоки являются статическими. Распознанные товары ------------------- Блок кода для распознанных товаров представлен ниже, он расположен в файле **home.json**. .. code-block:: json { "type": "CardListViewWeightObserverRelativeLayout", "layout_width": "wrap_content", "id": "PredictionProductGrid", "data-url": "app://mertech.ru/scales/products/predict?limit=6", "layout_height": "wrap_content", "layout_alignParentTop": "true", "layout_alignParentLeft": "true", "layout_marginLeft": "47dp", "layout_marginTop": "148dp", "children": [ { "type": "Card", "layout": "product", "id": "fav1", "layout_width": "wrap_content", "layout_height": "wrap_content", "layout_alignParentTop": "true", "layout_alignParentLeft": "true" }, { "type": "Card", "layout": "product", "id": "fav2", "layout_width": "wrap_content", "layout_height": "wrap_content", "layout_alignParentTop": "true", "layout_toRightOf": "fav1" }, { "type": "Card", "layout": "product", "id": "fav3", "layout_width": "wrap_content", "layout_height": "wrap_content", "layout_alignParentTop": "true", "layout_toRightOf": "fav2" }, { "type": "Card", "layout": "product", "id": "fav4", "layout_width": "wrap_content", "layout_height": "wrap_content", "layout_alignParentTop": "true", "layout_toRightOf": "fav3" }, { "type": "Card", "layout": "product", "id": "fav5", "layout_width": "wrap_content", "layout_height": "wrap_content", "layout_alignParentTop": "true", "layout_toRightOf": "fav4" }, { "type": "Card", "layout": "product", "id": "fav6", "layout_width": "wrap_content", "layout_height": "wrap_content", "layout_alignParentTop": "true", "layout_toRightOf": "fav5" } ] }, Для отображения используеся контрол ``"CardListViewWeightObserverRelativeLayout"``, который обновляется каждый раз при фиксации веса, причем вес должен быть больше 0, в данном компоненте в поле ``"data-url"`` присвоено значение ``"app://mertech.ru/scales/products/predict?limit=6"``, при котором осуществляется запрос к сервису для получения распознанных товаров, кол-во товаров ограничено 6-ю товарами. Для отображения товаров также используется контрол ``"Card"`` ссылающийся на файл **product.json**, представленный ниже. .. code-block:: json { "type": "RelativeLayout", "layout_width": "144dp", "layout_height": "119dp", "layout_marginRight": "13dp", "layout_marginBottom": "6dp", "action": { "@": { "type": "PRINT_DIALOG_TO_HOME_WITH_CONFIRM_PREDICTION", "data": "@{item.id}" } }, "background": { "type": "shape", "shape": "rectangle", "children": [ { "type": "solid", "color": "#FFFFFF" }, { "type": "stroke", "color": "#E6E6E6", "width": "2dp" }, { "type": "corners", "radius": "9dp" } ] }, "children": [ { "type": "AppCompatImageView", "layout_width": "143dp", "layout_height": "wrap_content", "layout_margin": "4dp", "scaleType": "centerInside", "jpg": "@{fn:format('Products/%s', @{item.plu})}" }, { "type": "TextView", "layout_width": "wrap_content", "layout_height": "30dp", "layout_alignParentLeft": "true", "layout_alignParentTop": "true", "gravity": "center", "textStyle": "bold", "textSize": "25sp", "layout_margin": "8dp", "textColor": "#000000", "text": "@{fn:format(' %s ', @{item.plu})}", "font_family": "geometria", "background": { "type": "shape", "shape": "rectangle", "children": [ { "type": "solid", "color": "#FFFFFF" }, { "type": "corners", "radius": "15dp" } ] } }, { "type": "TextView", "layout_width": "match_parent", "layout_height": "wrap_content", "layout_alignParentBottom": "true", "gravity": "center", "textSize": "14sp", "textColor": "#000000", "text": "@{item.name}", "font_family": "geometria_medium", "background": "#FFFFFF", "layout_margin": "4dp" } ] } При этом при нажатии проиходит попытка перейти в настройки сервиса. .. code-block:: json "action": { "@": { "type": "PRINT_DIALOG_TO_HOME_WITH_CONFIRM_PREDICTION", "data": "@{item.id}" } }, Для отображения изображения товара используется формат указывающий на PLU товара. .. code-block:: json { "type": "AppCompatImageView", "layout_width": "143dp", "layout_height": "wrap_content", "layout_margin": "4dp", "scaleType": "centerInside", "jpg": "@{fn:format('Products/%s', @{item.plu})}" }, Для отображения наименования товара используется следующий контрол. .. code-block:: json { "type": "TextView", "layout_width": "match_parent", "layout_height": "wrap_content", "layout_alignParentBottom": "true", "gravity": "center", "textSize": "14sp", "textColor": "#000000", "text": "@{item.name}", "font_family": "geometria_medium", "background": "#FFFFFF", "layout_margin": "4dp" } Все товары ---------- Контрол для отображения всех товаров представлен ниже, он расположен в файле **home.json**. .. code-block:: json { "type": "CardListViewRelativeLayout", "layout_width": "wrap_content", "id": "ProductGrid", "data-url": "app://mertech.ru/scales/products?order_by=plu&null_fields=category", "layout_height": "wrap_content", "layout_alignParentTop": "true", "layout_alignParentLeft": "true", "layout_marginLeft": "48dp", "layout_marginTop": "288dp", "children": [ { "type": "Card", "layout": "product", "id": "product1", "layout_width": "wrap_content", "layout_height": "wrap_content", "layout_alignParentTop": "true", "layout_alignParentLeft": "true" }, { "type": "Card", "layout": "product", "id": "product2", "layout_width": "wrap_content", "layout_height": "wrap_content", "layout_alignParentTop": "true", "layout_toRightOf": "product1" }, { "type": "Card", "layout": "product", "id": "product3", "layout_width": "wrap_content", "layout_height": "wrap_content", "layout_alignParentTop": "true", "layout_toRightOf": "product2" }, { "type": "Card", "layout": "product", "id": "product4", "layout_width": "wrap_content", "layout_height": "wrap_content", "layout_alignParentTop": "true", "layout_toRightOf": "product3" }, { "type": "Card", "layout": "product", "id": "product5", "layout_width": "wrap_content", "layout_height": "wrap_content", "layout_alignParentTop": "true", "layout_toRightOf": "product4" }, { "type": "Card", "layout": "product", "id": "product6", "layout_width": "wrap_content", "layout_height": "wrap_content", "layout_alignParentTop": "true", "layout_toRightOf": "product5" }, { "type": "Card", "layout": "product", "id": "product7", "layout_width": "wrap_content", "layout_height": "wrap_content", "layout_alignParentLeft": "true", "layout_below": "product1" }, { "type": "Card", "layout": "product", "id": "product8", "layout_width": "wrap_content", "layout_height": "wrap_content", "layout_toRightOf": "product7", "layout_below": "product1" }, Для отображения используеся контрол ``"CardListViewRelativeLayout"``, в поле ``"data-url"`` присвоено значение ``"app://mertech.ru/scales/products?order_by=plu&null_fields=category"``, при котором осуществляется запрос к сервису для получения товаров, которые не принедлежат ни к одной категории, при этом товары должны быть отсортированы по PLU. Для отображения товаров также используется контрол ``"Card"`` ссылающийся на файл **product.json**. Также в конце описаны контролы ``"NavigateButtonListView"``, которые используются для перелистывания товаров, так как все товары могут не поместиться на экране пользовательского интерфейса. Логотип ------- Для отображения логотипа используется контрол ``"AppCompatImageView"``, который ссылается на файл изображения ``"$scenario/images/logo"`` ($scenario - путь до папки с текущим сценарием). .. code-block:: json { "type": "AppCompatImageView", "layout_width": "380dp", "layout_height": "100dp", "layout_alignParentLeft": "true", "layout_alignParentTop": "true", "jpg": "$scenario/images/logo", "action_long": { "type": "GO_TO_SERVICE" }, "layout_marginTop": "11dp" },