Results 1 to 2 of 2

Thread: Resize Window with tabs in Desktop App

  1. #1
    Sencha User
    Join Date
    May 2017
    Posts
    7
    Vote Rating
    0
      0  

    Default Answered: Resize Window with tabs in Desktop App

    Hi.


    I'm creating a desktop App and i have a window with tabs as you can see in the image.
    sinResize.jpg

    And when i resize the window to full screen the tabs doesnt resize as you can see in the next image.

    conResize.jpg


    Here is the Cose of the window.

    Code:
    Ext.define('LuisApp.view.planeacion.Procedimientos', {
        
        extend: 'Ext.ux.desktop.Module',
        
        xtype: 'planeacion-procedimientos',
    
    
        init : function(){
            this.launcher = {
                text: 'Ejecucion de procedimientos',
                iconCls:'bogus',
                handler : this.createWindow,
                scope: this
            }
        },
    
    
        createWindow : function(src){
            var desktop = this.app.getDesktop();
            var win = desktop.getWindow('planeacion-procedimientos');
            if(!win){
                win = desktop.createWindow({
                    id: 'planeacion-procedimientos',
                    title:src.text,
                    width:800,
                    height:500,
                    bodyStyle:'background:#FFFFFF;background-color:#FFFFFF',
                    iconCls: 'bogus',
                    animCollapse:false,
                    constrainHeader:true,    
                    listeners: { resize: function (t, w, h) { 
                        alert('Hola');
                    }
                    },
                    title: 'Ejecucion de procedimientos',    
                    items: {
                            xtype: 'tabpanel',
                            cls: 'tabpanel-sin-bordes',
                            cls: 'noPanelBorder',
                            layout: {
                                    type: 'vbox',
                                    align: 'center',
                                    pack: 'center'
                            },                    
                            items: [{
                                title: 'Borrar Stock',                                    
                                xtype: 'form',
                                reference: 'form',
                                border: false,
                                itemId: 'borrar-stock-form-container',
                                cls: 'noPanelBorder',
                                layout: {
                                    type: 'vbox',
                                    align: 'center',
                                    pack: 'center'
                                },    
                                defaults: {
                                  border: false
                                },
                                items: [{
                                            xtype: 'button',
                                            text : 'Ejecutar Procedimiento Borrar Stock',
                                            margin: '130 50 15 0',
                                            scale : 'large',
                                            border : true,
                                            handler: function(){
                                                 Ext.Ajax.request 
                                                ({ 
                                                            
                                                });
                                            }
                                        }
                                ]                                        
                                
                            },{                        
                                title: 'Borrar Propuestas',                                    
                                xtype: 'form',
                                reference: 'form',
                                border: false,
                                itemId: 'borrar-propuestas-form-container',
                                cls: 'noPanelBorder',
                                layout: {
                                    type: 'vbox',
                                    align: 'center',
                                    pack: 'center'
                                },    
                                defaults: {
                                  border: false
                                },
                                items: [{
                                            xtype: 'button',
                                            text : 'Ejecutar Procedimiento Borrar Propuestas',
                                            margin: '130 50 15 0',
                                            scale : 'large',
                                            border : true,
                                            handler: function(){
                                                 Ext.Ajax.request 
                                                ({ 
                                                           
                                                });
                                            }
                                        }
                                ]    
                                
                            },{                        
                                title: 'Algoritmo Reaprovisoionamiento',                                    
                                xtype: 'form',
                                reference: 'form',
                                border: false,
                                itemId: 'algoritmo-reaprovisionamiento-form-container',
                                cls: 'noPanelBorder',
                                layout: {
                                    type: 'vbox',
                                    align: 'center',
                                    pack: 'center'
                                },    
                                defaults: {
                                  border: false
                                },
                                items: [{
                                            xtype: 'button',
                                            text : 'Ejecutar Algoritmo Reaprovisoionamiento',
                                            margin: '130 0 0 0',
                                            scale : 'large',
                                            id: 'boton-ejecutar-reaprovisionamiento',
                                            border : true,
                                            handler: function(){
                                                 var idAuditoria = 0;
                                                 Ext.Ajax.request 
                                                ({ 
                                                      
                                                });
                                            }
                                        },
                                ]    
                                
                            }
                        ]
                    }
                });
            }
            win.show();
            return win;
        }
        
    });
    As you can see in the code the Tab item has a layout vbox, but even if i set it to fit it wont work.
    Each tab panel has the same layout vbox, and same, it wont work if a set it to fit layout.

    Can anyone help me with this?

    Thanks.

  2. I don't see any layout on window, can you try with "fit" layout? or vbox with align stretch.

  3. #2

    Join Date
    Dec 2013
    Location
    Italy
    Posts
    88
    Answers
    9
    Vote Rating
    22
      0  

    Default

    I don't see any layout on window, can you try with "fit" layout? or vbox with align stretch.

Similar Threads

  1. Replies: 1
    Last Post: 28 Jan 2017, 8:04 PM
  2. Replies: 0
    Last Post: 12 Aug 2014, 12:28 PM
  3. Replies: 1
    Last Post: 16 Dec 2011, 8:11 AM
  4. [2.0 Desktop] Resize Ext.Window on tab change. | Need help
    By KENT in forum Ext 2.x: Help & Discussion
    Replies: 1
    Last Post: 11 Jan 2008, 6:42 AM

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •