PDA

View Full Version : Help with Home Screen Icon



quantumdecipher
14 Dec 2011, 6:24 PM
Hi, I am a newbie here. I am trying my first touch application by modifying the Tabs and Toolbars Tutorial found here : http://www.sencha.com/learn/tabs-and-toolbars/. I am currently modifying those pages provided on github.

I have quite a success, however, I cannot find a way to apply the icon for the homescreen. I don't know where to place the ext.setup code. Please help.

Thanks.

mitchellsimoens
15 Dec 2011, 10:15 AM
Ext.setup({
icon : 'something.png',
onReady : function() {}
});

Icon must be 72px x 72px

http://docs.sencha.com/touch/1-1/#!/api/Ext-method-setup

Sameer Khan
15 Dec 2011, 8:51 PM
I hope you will get phonestartup screen if u do like this...Try this way


1. In your index.js file do like this
------------------------------------
Ext.regApplication('',{
name: 'Ext.oasis',
useLoadMask : true,
phoneStartupScreen:'./resources/img/tablet_startup.gif',
launch: function() {
this.launched = true;
this.mainLaunch();
},
mainLaunch: function() {
if (!this.launched) {return;}
Ext.oasis.main = Ext.extend(Ext.Panel, {
layout:'card',
floating: (Ext.is.Phone) ? true : true,
fullscreen: (Ext.is.Phone) ? true :true,
centered: (Ext.is.Phone) ? true : true,
autoRender: (Ext.is.Phone) ? true : true,
modal: (Ext.is.Phone) ? true : true,
//width: (Ext.is.Phone) ? undefined : 480,
//height: (Ext.is.Phone) ? undefined : 520,
items:[],
});
Ext.setup({
glossOnIcon:false,
statusBarStyle:'default',
onReady : function(){
//create objects for your js fiels here
main = new Ext.oasis.main();
main.add(login);
main.show();


},
});



}
});


2. Add the following css to your sencha-touch.css file at bottom of the page
---------------------------------------------------------------------------------------------------------
.x-tab img.add,.x-button img.x-icon-mask.add{-webkit-mask-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAYAAAA6/NlyAAABqUlEQVRoBe2awWnDUBBE843B4NxcQSAFOC4lJeTkoxtJDykgvRhcgCFNJCFgIs+ChEHSJX93YT6ZD4ssmR3NztNFH5Wu6+6iVynlEZpbp+4J3s5OjWm7DRxZuMMCdUB9oyzNmrJe01hEejMtM5exIh6bCI3JbFkDT27EckEDs5DI8iHCWcmy6IowC4ksHyKclSyLrgizkMjyIcJZybLoijALiSwfIpyVLItuOGFso/xiuEvAgJdeK0DqJrHEhtsTTh9ul9y/ChR2KE+Y1ruDt2ccI7d6PszcK+oFFblWELt3Cn6i/8epMW5/W+LKGrUZ/0NwboF5QxuPsfY8dmOxJs41cBOYHCZF2BFeE60i3AQmh0kRdoTXRKsIN4HJYVKEHeE10frvCNvr4RH1HojH3rGHr3hqA7VdkxPKvuKJ3AA4hn7BM3xxA5N71Fdv1gz/tax3P+hFHmsJwM/8wraMadqOh5GuXda76rVqNWb7wgeevQvRRQ1MBCPFiginxEokKsJEMFKsiHBKrESiIkwEI8WKCKfESiQqwkQwUqyIcEqsRKIiTAQjxcoVrP83/9czD9EAAAAASUVORK5CYII=')}#loading-mask{position:absolute;left:0;top:0;width:100%;height:100%;background-color:#fff;background-image:url("../../../resources/img/tablet_startup.gif");background-repeat:no-repeat;background-position:center;text-align:center;z-index:0}.detail,.emptytext{padding:10px}.count{font-weight:bold}.checkitem{float:right;width:70px;height:28px}.checkitem:after{border-color:#ddd}.checkitem.done:after{border-color:#a4df1a}


Here in this code your startup image should be there...plz observe