Вопрос

Добавление кнопки в мобильном приложении

Добрый день!

Подскажите, как добавить кнопку в мобильном приложении?

Смотрел следующие публикации: 

https://community.terrasoft.ua/articles/kak-dobavit-knopku-v-mobilnom-prilozenii-na-stranice-redaktirovania

https://community.terrasoft.ua/questions/dobavit-knopku-na-stranicu-redaktirovaniya-v-mobilnom-prilozhenii

 

Не совсем понимаю, вью и контроллер это файлы модуля? Их подключать в файле манифеста мобильного приложения в секции PageExtensions?

Нравится

3 комментария
Лучший ответ

Роман, добрый день!

Вью и контроллер прописываются в отдельной клиентской схеме.

Напримере, нам нужно добавить кнопку на EditPage записи контакта.

Для этого сперва создаем отдельную клиентскую схему, назовем ее примером UsrViewButton.

В ней будет код вью и контроллера:

Terrasoft.LastLoadedPageData = {
    controllerName: "ContactEditPage.Controller",
    viewXClass: "ContactEditPage.View"
}; 
Ext.define("ContactEditPage.View", {
    extend: "Terrasoft.view.BaseEditPage",
    config: {
        id: "ContactEditPage",
       refreshButton: {
            id: 'ContactEditPageButton',
            cls: "x-button-primary-blue",
            text: 'Обновить'
        }
    },
    showRefreshButton: function (isShow) {
        var navigationPanel = this.getNavigationPanel(); 
        var refreshButton = this.getRefreshButton();
        if (isShow) {
            this._refreshButton = navigationPanel.addButton(refreshButton);
        } else {
            navigationPanel.removeButton(refreshButton);
        }
        return this._refreshButton;
    }
});
Ext.define("ContactEditPage.Controller", {
    extend: "Terrasoft.controller.BaseEditPage",
    statics: {
        Model: Contact
    },
    config: {
        refs: {
            view: "#ContactEditPage"
        }
    },
    initializeView: function (view) {
        this.callParent(arguments);
        var btn = view.showRefreshButton(true);
        btn.on("tap", this.onRefreshButtonTap, this);
    },
    onRefreshButtonTap: function() {
        console.log("test");
    }
});

 Не буду вдаваться в подробности их логики, посути мы просто оверрайдим кастомные схемы и добавляем в них свои элементы.

После создания схемы UsrViewButton её нужно подвязать в манифесте. Сделать это можно так:

"Models": {
        "Contact": {
            "Edit": "UsrViewButton",

Для необходимой нам модели, в данном случае Contact мы прописываем свойство "Edit" поскольку именно на EditPage и будет добавлена кнопка) и указываем туда значение нашей схемы.

В результате мы получим кнопку в мобильном приложении.

Роман, добрый день!

Вью и контроллер прописываются в отдельной клиентской схеме.

Напримере, нам нужно добавить кнопку на EditPage записи контакта.

Для этого сперва создаем отдельную клиентскую схему, назовем ее примером UsrViewButton.

В ней будет код вью и контроллера:

Terrasoft.LastLoadedPageData = {
    controllerName: "ContactEditPage.Controller",
    viewXClass: "ContactEditPage.View"
}; 
Ext.define("ContactEditPage.View", {
    extend: "Terrasoft.view.BaseEditPage",
    config: {
        id: "ContactEditPage",
       refreshButton: {
            id: 'ContactEditPageButton',
            cls: "x-button-primary-blue",
            text: 'Обновить'
        }
    },
    showRefreshButton: function (isShow) {
        var navigationPanel = this.getNavigationPanel(); 
        var refreshButton = this.getRefreshButton();
        if (isShow) {
            this._refreshButton = navigationPanel.addButton(refreshButton);
        } else {
            navigationPanel.removeButton(refreshButton);
        }
        return this._refreshButton;
    }
});
Ext.define("ContactEditPage.Controller", {
    extend: "Terrasoft.controller.BaseEditPage",
    statics: {
        Model: Contact
    },
    config: {
        refs: {
            view: "#ContactEditPage"
        }
    },
    initializeView: function (view) {
        this.callParent(arguments);
        var btn = view.showRefreshButton(true);
        btn.on("tap", this.onRefreshButtonTap, this);
    },
    onRefreshButtonTap: function() {
        console.log("test");
    }
});

 Не буду вдаваться в подробности их логики, посути мы просто оверрайдим кастомные схемы и добавляем в них свои элементы.

После создания схемы UsrViewButton её нужно подвязать в манифесте. Сделать это можно так:

"Models": {
        "Contact": {
            "Edit": "UsrViewButton",

Для необходимой нам модели, в данном случае Contact мы прописываем свойство "Edit" поскольку именно на EditPage и будет добавлена кнопка) и указываем туда значение нашей схемы.

В результате мы получим кнопку в мобильном приложении.

Дима Вовченко,

Спасибо! А не подскажите, где можно подробнее почитать?

Роман Сидаш,

Боюсь не подскажу, данный пример я написал сам основываясь на указанных вами публикациях.

Показать все комментарии