Results 1 to 7 of 7

Thread: [SOLVED] Add an icon for title of ext.Window

  1. #1
    Ext User
    Join Date
    Sep 2008
    Location
    FRANCE, Rennes
    Posts
    68
    Vote Rating
    0
      0  

    Question [SOLVED] Add an icon for title of ext.Window

    Hello ,

    I woul like to know if it's possible to insert an icon in the title of a window.

    PHP Code:
     win = new Ext.Window({
                
    title    'Lanceur',
                
    closable true,
                
    width    850,
                
    height   600,
                
    //border : false,
                
    plain    true,
                
    layout   'border',
                
    icon'icons/telephone.png',
                
    cls:'x-btn-left'
    I think i do not use the good css.
    Or not the best way.

    Thanks !
    Last edited by stevanovich; 27 Nov 2008 at 5:17 AM. Reason: [SOLVED]

  2. #2
    Sencha User Animal's Avatar
    Join Date
    Mar 2007
    Location
    Bédoin/Redwood City
    Posts
    30,862
    Vote Rating
    87
      0  
    Longtime Sencha engineer. Now surplus to requirements apparently...

  3. #3
    Ext User
    Join Date
    Sep 2008
    Location
    FRANCE, Rennes
    Posts
    68
    Vote Rating
    0
      0  

    Talking Strange !

    Thanks Animal for quick reply !!!

    I already use this for tabs, sorry for disturbing !!!

    But , i'm still confusing about using iconCls, I mut setting them in html, otherwise it's nos possible to define in js.

    in js
    PHP Code:
            win = new Ext.Window({
                
    title    'Lanceur GlooMan',
                
    closable true,
                
    width    850,
                
    height   600,
                
    //border : false,
                
    plain    true,
                
    layout   'border',
                
    //iconCls : 'Arbre_Bannis', // work by html setting
                
    iconCls :  '.Arbre_Bannis {background-image:url(icons/report_delete.png);}'// not Work 
    In html

    PHP Code:
    <style type="text/css">
        
    htmlbody {
            
    font:normal 12px verdana;
            
    margin:0;
            
    padding:0;
            
    border:0 none;
            
    overflow:hidden;
            
    height:100%;
        }
        
    {
            
    margin:5px;
        }
    ....
        .
    Arbre_Bannis {
            
    background-image:url(icons/report_delete.png);
        }
    ...    
        </
    style
    I miss something ???
    (change path to ../ to ../../ etc, still not working)

  4. #4
    Sencha User Animal's Avatar
    Join Date
    Mar 2007
    Location
    Bédoin/Redwood City
    Posts
    30,862
    Vote Rating
    87
      0  

    Default

    You ned to learn HTML before you begin buildnig RIA apps!

    A class is a class name. A DOM Element has a string which can contain class names.

    You then specify styling rules which use selectors which are based on class names to apply the rules to elements.
    Longtime Sencha engineer. Now surplus to requirements apparently...

  5. #5
    Ext User
    Join Date
    Sep 2008
    Location
    FRANCE, Rennes
    Posts
    68
    Vote Rating
    0
      0  

    Talking Wow, direct reply !

    Quote Originally Posted by Animal View Post
    You ned to learn HTML before you begin buildnig RIA apps!
    Thanks !
    I confirm : i'm not an html expert ! (and not an Extjs expert !)

    Maybe my question was stupid ?
    I just folow the link you put on your post, and i read it:

    iconCls : String A CSS class that will provide a background image to be used as the header icon (defaults to ''). An example custom ic...
    A CSS class that will provide a background image to be used as the header icon (defaults to ''). An example custom icon class would be something like: .my-icon { background: url(../images/my-icon.gif) 0 6px no-repeat !important;}
    So, am I stupid to think that extjs was able to setting new css ???

    I should use ext.util.css ?

    A class is a class name. A DOM Element has a string which can contain class names.
    You then specify styling rules which use selectors which are based on class names to apply the rules to elements.
    I'm agree with you !

    Thanks for reply.

  6. #6
    Sencha User
    Join Date
    Sep 2008
    Posts
    83
    Vote Rating
    0
      0  

    Default

    your iconCls whould be 'Arbre_Bannis', the name of the Class if I'm not wrong.
    Nevermind, missread, you already tried that !! My bad.

  7. #7
    Ext User
    Join Date
    Sep 2008
    Location
    FRANCE, Rennes
    Posts
    68
    Vote Rating
    0
      0  

    Default

    Yes, as i explain in my example , after animal explanation, iconCls works fine with 'Arbre_Bannis'.

    My read of API documentation was wrong: example given for ".my-icon { background: url(../images/my-icon.gif) 0 6px no-repeat !important;}" is only for css setting, in html or other.

Posting Permissions

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