Saturday, June 2, 2012

Styles and Themes in Android

Hello coders,
Lets look at a fairly simple example of creating a transparent theme and how to apply it to a Dialog……
Step 1> Create a colors.xml file in the ‘values’ folder under ‘res’ and add the following line..
<drawable name="transparent">#00000000</drawable>
Step 2> Create a styles.xml file in the ‘values’ folder under ‘res’ and the following lines…
<style name="Transparent">
<item name="android:windowIsTranslucent">true</item>
<item name="android:windowAnimationStyle">
@android:style/Animation.Translucent
</item>
<item name="android:windowBackground">@drawable/transparent</item>
<item name="android:windowNoTitle">true</item>
<item name="android:colorForeground">#fff</item>
</style>
( I guess the tags and attributes are self explanatory …. )
Step 3> Actually thats it……………………
Let’s add this to a dialog…..
Step 4> Create a class with the following lines……
public class DialogBox extends Dialog {

    public DialogBox(Context context, int theme) {
        super(context, theme);
        setContentView(R.layout.dialog);
        okButton = (Button) findViewById(R.id.dialog_OkButton);
        setListeners();
    }
}
(Make sure you create a layout for the dialog )
Step 5> Next create an activity class as follows….
public class T_Temp extends Activity {

    private DialogBox dialog;

    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        dialog = new DialogBox(this, R.style.Transparent);
        dialog.show();
    }
}
When creating the dialog just add the transparent theme ……
Step 6> That’s it …
( don’t forget to add the activity in the android manifest file..)
When you add the widgets and background it will look something like this..
before
Before
after
After
Step 7> Another trick is you can make the background blurred ….
just add the following line in the dialog box…
   getWindow().setFlags(WindowManager.LayoutParams.FLAG_BLUR_BEHIND, WindowManager.LayoutParams.FLAG_BLUR_BEHIND);
Output looks somthing like this…….
blurred
So the final code is:
public class DialogBox extends Dialog {

    public DialogBox(Context context, int theme) {
        super(context, theme);
        getWindow().setFlags(WindowManager.LayoutParams.FLAG_BLUR_BEHIND, WindowManager.LayoutParams.FLAG_BLUR_BEHIND);
        setContentView(R.layout.dialog);
        okButton = (Button) findViewById(R.id.dialog_OkButton);
        setListeners();
    }
}

No comments:

Post a Comment