1. #1
    Sencha User
    Join Date
    Sep 2008
    Location
    Brazil
    Posts
    34
    Vote Rating
    0
    bigice is on a distinguished road

      0  

    Thumbs up Simple Ribbon (Ext.ux.Ribbon)

    Simple Ribbon (Ext.ux.Ribbon)


    Thanks khebs@live.com to share with us
    http://www.sencha.com/forum/showthre...ghlight=Ribbon
    I have work on Ribbon and i did some changes

    What's New
    Title Align (Botton / Top)
    Title Event Click
    Ribbon by array of config

    Sample usage (Simple like that)
    PHP Code:
    new Ext.ux.Ribbon({
            
    renderTo Ext.getBody(),
            
    activeTab 0,
            
    items : [{
                
    title 'Home',
                
    ribbon : [{
                    
    title 'Clipboard',
                    
    cfg : {
                        
    columns 2,
                        
    defaults : {
                            
    width 60
                        
    }
                    },
                    
    items : [{
                        
    text 'Paste',
                        
    iconCls "paste-icon",
                        
    rowspan 3,
                        
    width 50,
                        
    height 70
                    
    },{
                        
    text 'Edit',
                        
    iconCls 'pencil-icon',
                        
    scale 'small',
                        
    iconAlign 'left'
                    
    },{
                        
    text 'Copy',
                        
    scale 'small',
                        
    iconCls 'copy-icon',
                        
    iconAlign 'left'
                    
    },{
                        
    text    "Cut",
                        
    iconCls "cut-icon",
                        
    scale 'small',
                        
    iconAlign 'left'
                    
    }]
                },{
                    
    title 'Records',
                    
    cfg : {
                        
    defaults : {
                            
    width 60
                        
    }
                    },
                    
    items : [{
                        
    text 'Simple Add',
                        
    iconCls 'add-icon'
                    
    },{
                        
    text 'Complex Add',
                        
    iconCls 'add2-icon'
                    
    },{
                        
    text 'Grid Search',
                        
    iconCls 'book-icon'
                    
    }]
                },{
                    
    title 'Database',
                    
    cfg : {
                        
    columns3,
                        
    defaults: {
                            
    allowDepress true,
                            
    enableToggle true,
                            
    toggleGroup 'tg-ribbon'
                        
    }
                    },
                    
    items : [{
                        
    text 'Scheme Branch',
                        
    iconCls 'branch1-icon',
                        
    rowspan 3,
                        
    pressed true
                    
    },{
                        
    text 'Table Element',
                        
    iconCls 'branch2-icon',
                        
    rowspan 3
                    
    },{
                        
    text 'Create a new table',
                        
    iconCls 't1-icon',
                        
    scale 'small',
                        
    iconAlign 'left'
                    
    },{
                        
    text 'Connect an existing table',
                        
    iconCls 't2-icon',
                        
    scale 'small',
                        
    iconAlign 'left'
                    
    },{
                        
    text 'Delete an existing table',
                        
    iconCls 't3-icon',
                        
    scale 'small',
                        
    iconAlign 'left'
                    
    }]
                }]
            },{
                
    title 'Office Sample',
                
    ribbon : [{
                    
    title '<blink>Click me</blink>',
                    
    onTitleClick : function(){
                        
    Ext.Msg.alert('Yes','You have been clicked on ribbon title.');
                    },
                    
    items :[{
                        
    text 'Connect',
                        
    iconCls 'db1-icon',
                        
    arrowAlign 'bottom',
                        
    menu : [{
                            
    text 'Option1',
                            
    iconCls 't1-icon'
                        
    }]
                    },{
                        
    text 'Select',
                        
    iconCls 'db2-icon',
                        
    arrowAlign 'bottom',
                        
    menu : [{
                            
    text 'Option1',
                            
    iconCls 't2-icon'
                        
    }]
                    }]
                },{
                    
    title 'Title on Top',
                    
    topTitle true,
                    
    cfg : {
                        
    columns 2
                    
    },
                    
    items : [{
                        
    text 'Personal Info',
                        
    iconCls 'spy-icon',
                        
    rowspan 3,
                        
    style 'padding-right:5px'
                    
    },{
                        
    xtype 'textfield',
                        
    anchor '100%',
                        
    emptyText 'Display text'
                    
    },{
                        
    xtype 'textfield',
                        
    anchor '100%',
                        
    emptyText 'Display text'
                    
    },{
                        
    text "Work Exp. & Others",
                        
    iconCls "pencil-icon",
                        
    scale "small",
                        
    iconAlign "left"
                    
    }]
                },{
                    
    title 'Only icons',
                    
    cfg : {
                        
    columns 3,
                        
    defaults : {
                            
    height 25,
                            
    scale 'small',
                            
    iconAlign 'left'
                        
    }
                    },
                    
    items :[{
                        
    text '',
                        
    iconCls 'pencil-icon'
                    
    },{
                        
    text '',
                        
    iconCls 't1-icon'
                    
    },{
                        
    text '',
                        
    iconCls 'pencil-icon'
                    
    },{
                        
    text '',
                        
    iconCls 't1-icon'
                    
    },{
                        
    text '',
                        
    iconCls 'pencil-icon'
                    
    },{
                        
    text '',
                        
    iconCls 't1-icon'
                    
    },{
                        
    text '',
                        
    iconCls 'pencil-icon'
                    
    },{
                        
    text '',
                        
    iconCls 't1-icon'
                    
    },{
                        
    text '',
                        
    iconCls 'pencil-icon'
                    
    }]
                },{
                    
    title 'Form components',
                    
    topTitle true,
                    
    cfg : {
                        
    columns 2
                    
    },
                    
    items : [{
                        
    text 'JAR Preferences',
                        
    iconCls 'jar-icon',
                        
    rowspan 3,
                        
    style 'padding-right:5px'
                    
    },{
                        
    xtype 'checkbox',
                        
    anchor '100%',
                        
    boxLabel 'This is a checkbox'
                    
    },{
                        
    xtype 'radio',
                        
    anchor '100%',
                        
    name 'radion1',
                        
    boxLabel 'This a radio option1'
                    
    },{
                        
    xtype 'radio',
                        
    anchor '100%',
                        
    name 'radion1',
                        
    boxLabel 'This a radio option2'
                    
    }]
                }]
            }]
        }); 
    I Hope you enjoy!
    Attached Images
    Attached Files
    Mateus Medeiros
    Sao Paulo - Brazil

  2. #2
    Sencha User
    Join Date
    Sep 2008
    Location
    Brazil
    Posts
    34
    Vote Rating
    0
    bigice is on a distinguished road

      0  

    Default


    Sorry i have post in duplicity u know connections problems.. please close this Thread and look this original http://www.sencha.com/forum/showthre...28VERY-COOL%29
    Mateus Medeiros
    Sao Paulo - Brazil

Similar Threads

  1. Simple Ribbon UX
    By khebs@live.com in forum Ext 3.x: User Extensions and Plugins
    Replies: 7
    Last Post: 14 Nov 2013, 10:46 AM
  2. Real Ribbon ButtonGroup
    By curlybracket in forum Community Discussion
    Replies: 14
    Last Post: 14 Nov 2013, 10:45 AM
  3. Thoughts on building an MS Office ribbon
    By SeaSharp in forum Community Discussion
    Replies: 1
    Last Post: 22 Nov 2007, 4:40 AM

Tags for this Thread

Turkiyenin en sevilen filmlerinin yer aldigi xnxx internet sitemiz olan ve porn sex tarzi bir site olan mobil porno izle sitemiz gercekten dillere destan bir durumda herkesin sevdigi bir site olarak tarihe gececege benziyor. Sitenin en belirgin ozelliklerinden birisi de Turkiyede gercekten kaliteli ve muntazam, duzenli porno izle siteleri olmamasidir. Bu yuzden iste. Ayrica en net goruntu kalitesine sahip adresinde yayinlanmaktadir. Mesela diğer sitelerimizden bahsedecek olursak, en iyi hd porno video arşivine sahip bir siteyiz. "The Best anal porn videos and slut anus, big asses movies set..." hd porno faketaxi