Skip to content

October 3, 2012


Sencha Touch 2: Icons Map

by Joe Kuan

This is the icons map for Sencha Touch 2 (for my own reference). This icon PNG files are located in /resources/themes/images/default/pictos/.

For my own backup, this is the file to generate the picture


    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        body {
           white-space: nowrap;
           display: inline-block;
           background-color: white;
        .desc {
           font-style: italic;
           margin: 0px 2px 0px 0px;
        .image {
           width: 24px;
           height: 24px;
           vertical-align: middle;
        .icon {
           margin: 0px 0px 5px 0px;
        .row {
           margin: 0px 5px 0px 0px;
            white-space: nowrap;
           display: inline-block;
  define("PATH", "./sencha-touch//resources/themes/images/default/pictos/");
  define("NUM_ROWS", 30);

  $counter = 0;
  foreach (glob(PATH . "*.png") as $filename) {
    if ($counter == 0 || ($counter % NUM_ROWS) == 0) {
         if ($counter) {
            echo "</span>\n";
         echo "<span class='row'>\n";

    echo "<div class='icon'><img class='image' src='{$filename}'> " .
         "<span class='desc'>" . basename($filename, ".png") . "</span></div>\n ";

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

Note: HTML is allowed. Your email address will never be published.

Subscribe to comments

%d bloggers like this: