Докуметация Cтарт Статьи Форум Лента Вход
Не официальное русскоязычное сообщество
Главная
    Документация jMonkeyEngine
        jMonkeyEngine Уроки и Документация
            Вклады
                tonegodGUI
                    Использование XML для Define Layouts

Использование XML для Define Layouts

Опубликованно: 30.04.2017, 10:15
Последняя редакция, Andry: 02.05.2017 21:07

Экраны XML используют класс AbstractAppState для управления вашими групповыми компонентами пользовательского интерфейса.

Пример AppState:

public class XMLScreenSample extends AbstractAppState {
    Screen screen;
    Window inventory;

    public XMLScreenSample(Screen screen) {
        // Сохранить указатель на экран
        this.screen = screen;
        // Вызовем парсер xml для загрузки новых компонентов
        screen.parseLayout("Interface/Inventory.xml", this);

        // Здесь мы можем захватить указатели на загруженные элементы
        inventory = (Window)screen.getElementById("InventoryWindowID");
        // Сначала мы скроем окно, чтобы использовать
        // effect, чтобы показать его с помощью метода initialize
        inventory.hide();
        // Захватить больше указателей на другие элементы/дочерние элементы
    }

    @Override
    public void initialize(AppStateManager stateManager, Application app) {
        super.initialize(stateManager, app);

        // Полезное место для запуска load effects
        inventory.showWithEffect();
    }

    @Override
    public void update(float tpf) {
        //Сделай: реализовать поведение во время выполнения
    }

    @Override
    public void cleanup() {
        super.cleanup();

        // Мы можем изменить effect, чтобы уничтожить наше окно инвентаря
        // когда мы выгружаем AppState
        Effect hide = new Effect(Effect.EffectType.FadeOut, Effect.EffectEvent.Hide, 0.25f);
        hide.setDestroyOnHide(true);

        if (inventory.getIsVisible()) {
            inventory.setEffect(hide);
            inventory.hideWithEffect();
        } else {
            screen.removeElement(inventory);
        }

        // Теперь наша сцена UI исчезает, когда AppState выгружается.
    }
}

Взглянем на XML Layout

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

<root>
    <screen>
        <component type="Window" id="InventoryWindowID" position="15%,15%" dimensions="70%,70%">
            <method name="setWindowTitle" param0="Inventory" />
            <component type="Label" position="10,40" dimensions="20%,20" >
                <method name="setText" param0="First Name:" />
                <method name="setTextAlign" param0="Right" />
                <method name="setTextVAlign" param0="Center" />
            </component>
            <component type="Label" position="10,65" dimensions="20%,20" >
                <method name="setText" param0="Last Name:" />
                <method name="setTextAlign" param0="Right" />
                <method name="setTextVAlign" param0="Center" />
            </component>
            <component type="Label" position="10,90" dimensions="20%,20" >
                <method name="setText" param0="Address:" />
                <method name="setTextAlign" param0="Right" />
                <method name="setTextVAlign" param0="Center" />
            </component>
            <component type="Label" position="10,140" dimensions="20%,20" >
            <method name="setText" param0="City:" />
                <method name="setTextAlign" param0="Right" />
                <method name="setTextVAlign" param0="Center" />
            </component>
            <component type="Label" position="10,165" dimensions="20%,20" >
                <method name="setText" param0="State:" />
                <method name="setTextAlign" param0="Right" />
                <method name="setTextVAlign" param0="Center" />
            </component>
            <component type="Label" position="10,190" dimensions="20%,20" >
                <method name="setText" param0="Postal Code:" />
                <method name="setTextAlign" param0="Right" />
                <method name="setTextVAlign" param0="Center" />
            </component>
            <component type="TextField" id="FirstName" position="25%,40" >
                <method name="setType" param0="EXCLUDE_CUSTOM" />
                <method name="setCustomValidation" param0="!@#$%^*()" />
            </component>
            <component type="TextField" id="LastName" position="25%,65" />
            <component type="TextField" id="Address1" position="25%,90" />
            <component type="TextField" id="Address2" position="25%,115" />
            <component type="TextField" id="City" position="25%,140" />
            <component type="Indicator" id="Indicator1" position="25%,225" orientation="HORIZONTAL" >
                <method name="setAlphaMap" param0="tonegod/gui/style/def/Common/Extras/indicator_am_x.png" />
                <method name="setIndicatorColor" param0="0,0.65f,0,1" />
                <method name="setMaxValue" param0="100" />
                <method name="setCurrentValue" param0="50" />
                <method name="setDisplayValues" />
            </component>
            <component type="ComboBox" id="State" position="25%,165" >
                <method name="addListItem" param0="Alaska" param1="Alaska" />
                <method name="addListItem" param0="Alabama" param1="Alabama" />
                <method name="addListItem" param0="Arkansas" param1="Arkansas" />
                <method name="addListItem" param0="Connecticut" param1="Connecticut" />
                <method name="addListItem" param0="Deleware" param1="Deleware" />
                <method name="addListItem" param0="Dakota, North" param1="North Dakota" />
                <method name="addListItem" param0="Dakota, South" param1="South Dakota" />
                <method name="addListItem" param0="Georgia" param1="Georgia" />
                <method name="addListItem" param0="Kentucky" param1="Kentucky" />
                <method name="addListItem" param0="Maine" param1="Maine" />
                <method name="addListItem" param0="New Jersey" param1="New Jersey" />
                <method name="addListItem" param0="New York" param1="New York" />
                <method name="addListItem" param0="Nevada" param1="Nevada" />
            </component>
            <component type="TextField" id="PostalCode" position="25%,190" >
                <method name="setType" param0="INCLUDE_CUSTOM" />
                <method name="setCustomValidation" param0="1234567890-" />
                <method name="setMaxLength" param0="10" />
            </component>
            <component type="Button" id="SubmitButton" position="75%,87%" dimensions="23%,10%" >
                <method name="setText" param0="Submit" />
                <eventMethod name="onButtonMouseLeftUp" stateMethodName="invSubmitButtonClick" />
            </component>
        </component>
        <component type="Menu" id="SubMenu1" position="0,0">
            <method name="addMenuItem" param0="Menu Item 1" param1="1" param2="null" />
            <method name="addMenuItem" param0="Menu Item 2" param1="2" param2="null" param3="true" />
            <method name="addMenuItem" param0="Menu Item 3" param1="3" param2="null" param3="true" param4="true" />
            <method name="addMenuItem" param0="Menu Item 4" param1="4" param2="null" param3="true" param4="true" />
            <eventMethod name="onMenuItemClicked" stateMethodName="menu1click" />
        </component>
        <component type="Menu" id="Menu1" position="0,0">
            <method name="addMenuItem" param0="Item 1" param1="1" param2="SubMenu1" />
            <method name="addMenuItem" param0="Item 2" param1="2" param2="null" param3="true" />
            <eventMethod name="onMenuItemClicked" stateMethodName="menu1click" />
        </component>
        <component type="AlertBox" id="Alert1" position="0,0">
            <method name="setWindowTitle" param0="Hey you!" />
            <method name="centerToParent" />
            <eventMethod name="onButtonOkPressed" stateMethodName="alertOkClick" />
            <effect type="SlideIn" event="Show" duration=".25f" direction="Left" audioFile="fade" volume="1" />
            <effect type="SlideOut" event="Hide" duration=".25f" direction="Left" audioFile="fade" />
        </component>
    </screen>
</root>

В приведенном выше примере вы увидите, что многие компоненты определили тег eventMethod. Тег eventMethod определяет метод AppState, который будет использоваться в качестве перехода в определенный метод события управления. Нет необходимости определять параметры для этих методов, поскольку они просто перенаправляют параметры методов событий непосредственно в определенный метод состояния приложения. Вот так:

<eventMethod name="onButtonMouseLeftUp" stateMethodName="invSubmitButtonClick" />

Теперь нам нужно добавить метод invSubmitButtonClick к AbstractAppState, который вызвал метод parseLayout, вот так:

public void invSubmitButtonClick(MouseButtonEvent evt, boolean isToggled) {
    // Мы покажем AlertBox, который мы определили в макете, когда нажата эта кнопка
    ((AlertBox)screen.getElementById("Alert1")).showWithEffect();
}

Самый быстрый способ получить определение метода события, который вы создаете, — это создать новый экземпляр класса, из которого происходит событие, реализовать его абстрактные методы и вырезать/вставить нужный метод. Тогда вы просто переименуете его.


Переведено для jmonkeyengine.ru, оригинал
Автор перевода: Andry

Добавить комментарий

jMonkeyEngine.ru © 2017. Все права сохранены.