CODEWITHSUNDEEP
android
cherry
cherry

Reputation: 194

Images as buttons in Android

What is best way to apply styles for images. i.e, I am using an image as button. when I focused on it, i click on it, and i release the button different styles should be apply. I can use different images for different purposes. But its not a feasible solution.

Upvotes: 0

Views: 114

Answers (2)

Amokrane Chentir
Amokrane Chentir

Reputation: 30385

This is done by specifying the normal, focused and pressed states in an XML file (using State ListDrawable).

A StateListDrawable is a drawable object defined in XML that uses a several different images to represent the same graphic, depending on the state of the object. For example, a Button widget can exist in one of several different states (pressed, focused, or niether) and, using a state list drawable, you can provide a different background image for each state.

For example you can create the following xml file in res/drawable, let's call it selector.xml:

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/ic_btn_pressed"
        android:state_pressed="true" />
    <item android:drawable="@drawable/ic_btn_focused"
        android:state_focused="true" />
    <item android:drawable="@drawable/ic_btn_normal" /> 
</selector>

And later you can set it as a background for you button.

<Button
   android:background="@drawable/selector"
/>

Upvotes: 2

Michael A.
Michael A.

Reputation: 4193

Why don't you just use a button as a button?

Just style the button in your attrs.xml. Example:

<style name="MyButton.Standard" parent="@android:style/Widget.Button">
    <item name="android:textColor">#FFFFFF</item>
    <item name="android:textStyle">bold</item>
    <item name="android:background">@drawable/btn_gfx</item>
    <item name="android:focusable">true</item>
    <item name="android:clickable">true</item>
</style>

To use this, simply apply the Style to your button in your layout:

style="@style/MyButton.Standard"

btn_gfx.xml is a StateList drawable

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
    <item 
        android:state_pressed="true" 
        android:state_enabled="false"
        android:drawable="@drawable/btn_tab_pressed_disabled" />
    <item 
        android:state_pressed="true" 
        android:state_enabled="true"
        android:drawable="@drawable/btn_tab_pressed" />
    <item 
        android:state_enabled="false"
        android:drawable="@drawable/btn_tab_disabled" />
    <item 
        android:state_enabled="true"
        android:drawable="@drawable/btn_tab_default" />
</selector>

You can add graphics for even more states, if required - check the Android documentation.

If you want to use the same system for button everywhere in your app instead of applying a style on each, you can create a custom theme. An example (without the TitleBar):

<style name="MyTheme" parent="@android:style/Theme.NoTitleBar">
    <item name="android:buttonStyle">@style/MyButton.Standard</item>
</style>

Then simply apply the Theme to your Application object (or - if you just want it for a single Activity, apply it to your Activity).

You can style the ImageButton component in exactly the same way as the Button component. It's an incredibly powerful system when you start to play around with it.

Upvotes: 3

Related Questions