PDA

View Full Version : "no images"



bobmane
5 Aug 2010, 2:33 PM
how is "no images" achieved?

CSS3 is all that is used?


also, If have a highly developed PSD UI what is the process of taking it from PSD to an application/format like Sencha Touch

kevchuey
5 Aug 2010, 3:26 PM
I'm assuming by "no images", you mean not using images in the design of a given site. This isn't always achievable. It simply depends on how complex your site/app is. Most design elements can be done with only CSS, though.

If you have a PSD, you'll need to convert it to HTML/CSS first. If you don't have the requisite skills yourself, you can use a site like http://www.psd2html.com to have it done for you.

A second step (which could be done in parallel) could be to create your application/site using Sencha Touch without worrying about the graphics/UI.

The last step would be to merge the output of the first step (i.e., the new HTML/CSS) with the output of the second step. This requires a good understanding of both Sencha Touch and CSS though.

bobmane
7 Aug 2010, 9:12 AM
i would like to see examples of "merged".

kevchuey
7 Aug 2010, 9:17 AM
Most of the "merging" I'm talking about is customizing the configuration parameters of Sencha Touch components. So for instance, lets say you have an Ext.Panel (one of the most basic Sencha Touch components). Without any customization, its just a blank panel. But you can specify the height, width, CSS class, etc., when you create the Panel object.

To see what you can customize, you can take a look at the API documents (http://dev.sencha.com/deploy/touch/docs/) for each of the components.

nosarious
7 Aug 2010, 9:52 AM
Are you talking about the images that are integrated in the css file for Sencha? the fact you don't get images in the files you download for Sencha? They are 'hardwired' so to speak, using an encoding method. That's how they handle a lot of the icons used in the toolbar because they are in the css file.

You can find some information on encoding at these sites:

http://www.greywyvern.com/code/php/binary2base64

http://mark.koli.ch/2009/07/howto-include-binary-image-data-in-cascading-style-sheets-css.html

http://aralbalkan.com/3066

You still need to work with a normal graphic files like png, gif or jpeg. The best case is png since they handle transparency so well.

bobmane
7 Aug 2010, 1:21 PM
i understand more or less....

so this http://www.aspirationhosting.com/images/aspiration_small.gif

= this


data:image/gif;base64,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%3D
so, my assumption then, that is done automatically in ST but if you wanted to do this on your own you would create a UI > slice it (strategically planning that certian slices will be converted to base64) > convert each slice that is to be in base64 using that tool you linked to > use normal images in webpage and/or webapp and where desired using base64 in CSS.


Is base64 the same thing used in stuff like jquery theamroller?

or in this: http://videojs.com/

nosarious
7 Aug 2010, 4:40 PM
I don't think jquery themeroller uses that. The graphics on the page I saw were one png file with the color changes underneath.

Jquery themeroller looks more like a consistent naming and structuring concept for css, that makes it easier to build themable sites. Does nothing for me as I think there's more to the flavor of a site than the variations of color. Cool concept, though. The large amount of graphics towards the bottom of the themeroller page is just one large png file with the color changed underneath.

As for sencha doing it automatically I think that it is html5 and css3 that are responsible for that. Sencha just leverages the capabilities of these new standards. html5 also allows you to take a snapshot of the canvas to save as an encoded image, which makes it easier to build offline web applications that refer to previously viewed or generated content (ie: Visiting a map location and snapping the image of the map for offline reference as you travel, without having access to the internet)

I would suggest you do a bit more research to find out if it is necessary for your application. I would (personally) hesitate to use it for company logos since it is more difficult to change at a later date. It's easier to update by replacing a gif or png than it is to re-copy&paste base64 elements.