Jak ustawić elementy do prawej w Ext JS 4 toolbar?

Cześć, w tym krótkim artykule pokażę jak dostosować elementy w toolbarze. W moim przypadku użyję grid z użytkownikami i dodam do toolbar prosty textfield (często pełni funkcję filtra).

Końcowy rezultat wygląda jak poniższe zdjęcie:

Jak to zrobić? Tutaj jest odpowiedź:

           {
                xtype: 'toolbar',
                dock: 'top',
                items: [
                    {
                        xtype: 'button',
                        text: 'Add user'
                    },
                    {
                      xtype: 'tbfill'
                    },
                    {
                        xtype: 'textfield',
                        fieldLabel: 'Filter by login'
                    }
                ]
            }

Obiekt Ext.toolbar.Fill czyli non-rendering placeholder. Jest czymś w rodzaju komponentu Component tbfill z konfuguracją flex = 1, i po prostu wypełnia przestrzeń pomiędzy elementami. Podobnie jak tutaj:

            {
                xtype: 'toolbar',
                dock: 'top',
                items: [
                    {
                        xtype: 'button',
                        text: 'Add user'
                    },
                    {
                      xtype: 'container',
                      flex: 1
                    },
                    {
                        xtype: 'textfield',
                        fieldLabel: 'Filter by login'
                    }
                ]
            }

Dzięki i do później.