1. #1
    Sencha User
    Join Date
    Dec 2011
    Location
    White Rock, BC Canada
    Posts
    161
    Vote Rating
    0
    WagsMax is on a distinguished road

      0  

    Default Trouble using iconCls on a button

    Trouble using iconCls on a button


    I can't seem to figure out what to put into the iconCls field for a button to get the icon to display. For example, I just want to display the 'settings' icon on a button. When I put 'settings' into the iconCls field I get a large empty button. Any ideas?

  2. #2
    Sencha User
    Join Date
    Jun 2009
    Location
    Redwood City, CA
    Posts
    197
    Vote Rating
    6
    CaliLuke is on a distinguished road

      0  

    Default


    select "iconMask = true".

    It's not a great user experience for now but it will get better.
    --
    Luca Candela
    twitter: @luckymethod

  3. #3
    Sencha User
    Join Date
    Dec 2011
    Location
    White Rock, BC Canada
    Posts
    161
    Vote Rating
    0
    WagsMax is on a distinguished road

      0  

    Default


    There does not seem to be a property named iconMask for a button in the Designer??

  4. #4
    Sencha User
    Join Date
    Jun 2009
    Location
    Redwood City, CA
    Posts
    197
    Vote Rating
    6
    CaliLuke is on a distinguished road

      0  

    Default


    that's for Sencha Touch, I should have specified it.
    --
    Luca Candela
    twitter: @luckymethod

  5. #5
    Sencha User
    Join Date
    Dec 2011
    Location
    White Rock, BC Canada
    Posts
    161
    Vote Rating
    0
    WagsMax is on a distinguished road

      0  

    Default


    How do you get an icon to display in Sencha Touch using Designer?

  6. #6
    Sencha - Architect Dev Team aconran's Avatar
    Join Date
    Mar 2007
    Posts
    9,269
    Vote Rating
    122
    aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold

      0  

    Default


    WagsMax - Are you talking about the custom iconCls's defined in your own custom css? These currently don't show up in the design view as we don't load your custom css in the design mode. You can configure them and see them in the deployed application.
    Aaron Conran
    @aconran
    Sencha Architect Development Team

  7. #7
    Sencha User
    Join Date
    Apr 2010
    Posts
    2
    Vote Rating
    0
    erich.oliphant is on a distinguished road

      0  

    Default


    Does this also apply to the hundreds of other Sencha Touch icons (in the pictos dir of the distribution) that don't show up in the property sheet by default? I'd like to use some of them but they don't show up as options. Is using their name adequate?

  8. #8
    Sencha - Architect Dev Team aconran's Avatar
    Join Date
    Mar 2007
    Posts
    9,269
    Vote Rating
    122
    aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold

      -2  

    Default


    There are only a handful of iconCls's that we generate by default. These are the ones that are included in the dropdown.

    If you take a look at the scss within the SDK you'll see how those iconCls's are generated. Look for the pictos-iconmask mixin. For example, you could generate an additional iconCls for tv by doing the following.

    Code:
    @include pictos-iconmask('tv')
    The SDK takes this approach so as not to bloat your css file with unnecessary images.
    Aaron Conran
    @aconran
    Sencha Architect Development Team

  9. #9
    Sencha User
    Join Date
    Dec 2012
    Posts
    5
    Vote Rating
    0
    Kerki is on a distinguished road

      0  

    Default Same Issue

    Same Issue


    Hi ,
    I have the same problem using Sencha Architect 2.2.3 the icons - pictos are shown in Architect , but when i i start the app in Chrome or Safari , the button doesn't have the original size and the pictos (e.g refresh) is disappeared ! Please HELP !

    Many Thanks