List of available iconCls masks in documentation?

[meyerovb]

Is there anywhere in the documentation I can see the list of available iconCls masks? Edit: I see them in the kitchen sink icons example, these won't be included in the documentation?

Also, 'mask' is not listed as a valid option for the ui config option in the button documentation. Am I looking in the wrong place?

[danfrist]

I find there are several possible property values missing from documentation. I'd like to know what values I can use for things like iconCls, xtype, etc.

Has anyone found a more complete way of discovering what we can do with this framework? I find that the API documentation is only a hint...

[AndreaCammarata]

Is there anywhere in the documentation I can see the list of available iconCls masks? Edit: I see them in the kitchen sink icons example, these won't be included in the documentation?

All the available icons are listed in the kitchen example, just as you already said.

Also, 'mask' is not listed as a valid option for the ui config option in the button documentation. Am I looking in the wrong place?

What do you mean with mask? I think you are making confusion with the iconMask property.
You can find additional information about this property in the button documentation.

Hope this helps.

[AndreaCammarata]

Hi danfrist and welcome.

I find there are several possible property values missing from documentation. I'd like to know what values I can use for things like iconCls, xtype, etc.

All the icons are listed inside kitchen sink example.
About the xtypes: take a look at this API doc

http://dev.sencha.com/deploy/touch/d...=Ext.Component

Has anyone found a more complete way of discovering what we can do with this framework? I find that the API documentation is only a hint...

Wath we can do with this framework?
Almost everything with or without PhoneGap integration.
However take a look at the Examples and Showcase forum to see developers works

http://www.sencha.com/forum/forumdis...-and-Showcases

Hope this helps.

[LuckyWolf19]

Here is the list for those who don't want to look it up. It would be nice if this would be in the documentation if it is not already.

action
add
arrow_up
arrow_right
arrow_down
arrow_left
bookmarks
compose
delete
download
favorites
info
more
refresh
reply
search
settings
star
team
time
trash
user

[existdissolve]

The icons that LuckyWolf19 listed are the ones that are available by default. There are, however, a *ton* more available to the default theme, if you're willing to add them in to a custom stylesheet via SASS. At first, it seems a bit daunting if you've never done it before, but if you're serious about customizing your Sencha theme, this is something you're probably going to be needing to get into anyway.

Here's a good article on how to do that: http://www.sencha.com/blog/an-introd...g-sencha-touch

And you can browse to the full collection of masks in your sencha installation--just browse to \resources\themes\images\default\pictos

[LuckyWolf19]

Awesome! That hint to browse the resource folder was great! Much appreciated.

[nougaSencha]

hi,
i want to like this interface
home.png

so this is my code:

Ext.define('AppHotel.view.Home',{
    extend:'Ext.Img',
    extend: 'Ext.Panel',
    xtype:'home',
    
    config:{
        title:'Home',
		iconCls:'home',
		layout:'fit',
		scrollable:true,
		styleHtmlCls:'homepage',


		items:[
            {
                xtype: 'image',
                src: 'http://localhost/AppHotel/resources/images/logo3.png',
                height: 100,
                width: 100,
                docked:'top'
            },
            {
                xtype : 'searchfield',
                title: 'Search',
                name :'searchfield',
                docked:'top'
            },
            {
                xtype: 'image',
                src: 'http://localhost/AppHotel/resources/images/image.png',
                fullscreenItemCls:'true',
                height: 400,
                width: 100,
                docked:'top'
            },
            {
                xtype: 'button',
                text: 'Recommendations',
                iconCls: 'favorites',
                iconMask: true,
                docked:'top'
            },
            {
                xtype: 'button',
                text: 'Browse Categories',
                iconCls: 'action',
                iconMask: true,
                docked:'top'
            },
            {
                xtype: 'button',
                text: 'Post Buying Requests',
                iconCls: 'compose',
                iconMask: true,
                docked:'top'
            },


            {
                xtype:'titlebar',
                title:'Sign in',
                docked:'bottom'
            }
		]
    }
});

but images didn't take all the width of the page, how can i do??
this is the result of my page it's too bad:
bad.jpg

[andyjv]

All the available icons are listed in the kitchen example, just as you already said.

Hope this helps.

Worst answer ever. Sencha would be so much better off if the docs were just a wiki

[IbarCarty]

Hi!
How can I get that Style (black & blue) in my application? I've just started in Sencha Touch 2.0 and my small application is still in that blue start predefined color. An answer would be great, thanks a lot!!