Tips for Designing Website /GUI , silverlight , HTML , Flash, CSS, Android UI

Wednesday, December 5, 2012

Quick guide to CSS3 and CSS2 shorthand

Check out cool CSS3 and CSS2 shorthand guide
CSS shorthand can really help you reduce and optimize CSS files. Instead of using multi-lines of properties, we can make it one liner. The following is the CSS3 and CSS2 shorthands properties:

Check out here :
http://www.mindfreakerstuff.com/2012/12/css3-and-css2-shorthand-guide/

cheers.... :)

Thursday, June 7, 2012

How to create Styles for Android Button, UI (android Custom Button)

Android : How to create Style for Button which we can be use multiple time like CSS Classes in HTML : Eclipse

1) Create Android Project - Suppose we are creating a button style which has default blue color and on press orange color as shown in above image.

2) Create one android XML and select values as per shown in figure

Resource Type : Drawable
Root Element : Selector

Add Folowing Code in bluebutton.XML

3)Create one more Android XML for styles styles.xml or you can use default string.xml

Resource Type : Values
Root Element : Resources

Add following Code in "Style.XML "

4) Add one Button in "main.xml"

main.xml -

<Button
android:id="@+id/button1"
android:layout_width="250dp"
android:layout_height="wrap_content"
android:text="My Button"
style="@style/btnBlue"/>

Thats it !!

Friday, June 1, 2012

Fullscreen Toggle Button Action Script 2.0 : Flash

Add Action Script in Flash

btn = "Button Instance Name"

Flash Action Script

stop();
Stage.displayState = "normal";
Stage.scaleMode = "noScale";
function toggleFullScreen ()
{
    trace ("::::::::::::::::::::::::::::::::::::::::");
    if (Stage.displayState == "normal")
    {
        Stage.displayState = "fullScreen";
    }
    else
    {
        Stage.displayState = "normal";
    }// end else if
}
btn.onRelease=function()
{
toggleFullScreen () 
}

HTML Code : Replace your Swf file path with "index.swf"

Thursday, May 3, 2012

Doctype Tag : HTML5

Using the HTML5 structural elements

1) What is <DOCTYPE> tag?

No URLs that even the most prolific web authors need to cut and paste.

add the <!DOCTYPE> declaration to your HTML documents, so that the browser knows what type of document to render.

*Note - http://remysharp.com/2009/01/07/html5-enabling-script/ To enable HTML 5 Elements on Older IE browser