Jump to content

Recommended Posts

Posted

Сделайте заодно и пример, как программно листать внутренние панели вперед-назад.

Чтобы на главной панели было 2 кнопки (вперед-назад) и пользователь листает внутренние панели этими двумя кнопками.

Это будет полезно для организации галереи, т.к. в uniGUI пока что отсутствует компонента-галерея.

Posted
/**
* A version of Accordion layout, than is horizontal rather than vertical.
* @author Westy
* https://fiddle.sencha.com/#fiddle/297&view/editor
*/
Ext.define('Ext.ux.layout.container.HorizontalAccordion', {
        extend: 'Ext.layout.container.Accordion',

        alias: ['layout.horizontal-accordion'],

        vertical: false,

        defaultAnimatePolicy: {
            x: true,
            width: true
        }
    },

    function() {
        Ext.require(['Ext.layout.container.HBox'],

            function() {
                Ext.ux.layout.container.HorizontalAccordion.borrow(
                    Ext.layout.container.HBox, ['type', 'direction', 'horizontal', 'names', 'sizePolicy']);
            });
    }
);
function beforeInit(sender, config)
{
    config.layout = {
        type: 'horizontal-accordion',
        titleCollapse: false,
        animate: true
    };
    
    config.defaults = {
        bodyStyle: 'padding: 15px',
        headerPosition: 'left',
        titleRotation: 2, //0,1,2
        titleAlign: 'right',
        titlePosition: 1
    }
}

 

  • Thanks 1
Posted

@Sherzod неудобство в том, что кнопки ооочень маленькие и расположены между собой далеко.

Было бы значительно удобнее вот так: с большими кнопками, которые расположены рядом.

Юзабилити же!

Screenshot_7.jpg

  • Upvote 1
Posted
On 11/19/2021 at 6:49 PM, x11 said:

Чтобы на главной панели было 2 кнопки (вперед-назад) и пользователь листает внутренние панели этими двумя кнопками.

Еще не успел проверить. Выложу чуть позже.

image.thumb.png.95e5164ce336bdb0a27b0dd2b39d2c5a.png

Posted
36 minutes ago, x11 said:

Было бы значительно удобнее вот так: с большими кнопками, которые расположены рядом.

image.png.da705f892504e9614c4ec28fbad9638a.png

Posted
52 minutes ago, x11 said:

Было бы значительно удобнее вот так: с большими кнопками, которые расположены рядом.

Можно и с кнопками.

Posted

Hello Sherzod,

I'd like to ask you something,

Regarding this thread, how did you do that the other panels collapsed by automatically?

I  try to find out but I couldn't.

Thank you for your help!
Franco

 

  • 1 month later...
Posted
On 11/26/2021 at 8:39 AM, Sherzod said:
Ext.define('Ext.ux.layout.container.HorizontalAccordion', {

а где скачать примеры, а куда вставлять код?

Posted
1 hour ago, x11 said:

а где скачать примеры, а куда вставлять код?

Ну, на данный момент нет готового примера. 

Но, выше, дана последовательность, что и куда вставлять и как собрать работающий пример. 

Posted

так в том-то и дело, что непонятно, куда вставлять это

 

On 11/26/2021 at 8:39 AM, Sherzod said:
Ext.define('Ext.ux.layout.container.HorizontalAccordion', {
        extend: 'Ext.layout.container.Accordion',

        alias: ['layout.horizontal-accordion'],

        vertical: false,

        defaultAnimatePolicy: {
            x: true,
            width: true
        }
    },

    function() {
        Ext.require(['Ext.layout.container.HBox'],

            function() {
                Ext.ux.layout.container.HorizontalAccordion.borrow(
                    Ext.layout.container.HBox, ['type', 'direction', 'horizontal', 'names', 'sizePolicy']);
            });
    }
);

 

Posted
27 minutes ago, x11 said:

так в том-то и дело, что непонятно, куда вставлять это

Okay. (Не обещаю, но постараюсь сделать тестовые примеры...)

Наверное, Вы не до конца смотрели видео:

 

  • Thanks 1
Posted

Как я уже писал ранее, проблема в том, что ОЧЕНЬ неудобно, что нужно нажимать только на эти маленькие кнопки.

Screenshot_3.jpg

Screenshot_4.jpg

Posted
45 minutes ago, x11 said:

Как я уже писал ранее, проблема в том, что ОЧЕНЬ неудобно, что нужно нажимать только на эти маленькие кнопки.

 

46 minutes ago, x11 said:

Screenshot_4.jpg

Здесь все показано:

 

  • Thanks 1
Posted
config.expandPrevItem = function() {
	var _break = false;
	sender.layout.getLayoutItems().forEach(function(pnl, i) {
		if (!pnl.collapsed && i > 0 && _break == false) {
		  _break = true;
		  sender.layout.getLayoutItems()[i - 1].expand();
		}
	
	})

};

config.expandNextItem = function() {
	var _break = false;
	sender.layout.getLayoutItems().forEach(function(pnl, i) {
		if (!pnl.collapsed && sender.layout.activeItemCount - 1 && _break == false) {
		  _break = true;
		  sender.layout.getLayoutItems()[i + 1].expand();
		}
	
	})

};

надеюсь правильно набрал текст кода

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...