CODEWITHSUNDEEP
androidlayoutclickable
iCaesar
iCaesar

Reputation: 411

android selector for clickable layout with imageview

guys if i have such layout 

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/deals_list_item_bckg"
    android:orientation="vertical" >

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:layout_margin="15dp"
        android:background="@drawable/deals_list_item_background"
        android:clickable="true"
        android:orientation="horizontal" >

        <ImageView
            android:id="@+id/imageView1"
            android:layout_width="85dp"
            android:layout_height="50dp"
            android:scaleType="fitXY"
            android:src="@drawable/btn_unpressed" />

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:gravity="center_vertical|right"
            android:orientation="vertical" >

            <TextView
                android:id="@+id/textView1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:paddingRight="10dp"
                android:text="My Account"
                android:textSize="16sp" />
        </LinearLayout>
    </LinearLayout>

</LinearLayout>

the result is

result

is it any way to write selector that will be change only imageView's img when state is pressed

like this

pressed

or show me plz how can i do such button, because the problem is that the right part of button also need background image, and left part is image view that must change it image when pressed on right part (layout)

Upvotes: 5

Views: 18156

Answers (2)

Dan Alboteanu
Dan Alboteanu

Reputation: 10232

use the Android provided style as below 

<ImageView
    android:src="@drawable/sky_image"
    style="@style/Widget.AppCompat.ActionButton"
    ...
/>

and you will get the tint effect onClick

source

Upvotes: 2

Ifrit
Ifrit

Reputation: 6821

Unless you plan on adding a ton of views to that button layout at runtime...its overly complicated for what you need it to do. Here's a much simpler version that should suite you fine:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_margin="15dp"
android:clickable="true"
android:orientation="horizontal">

<ImageView
    android:layout_width="85dp"
    android:layout_height="match_parent"
    android:scaleType="fitXY"
    android:duplicateParentState="true"
    android:src="@drawable/btn_background" />

<TextView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center_vertical|right"
    android:background="@drawable/your_grey_bar"
    android:paddingRight="10dp"
    android:text="My Account"
    android:textSize="16sp" />
</LinearLayout>

Then in res/drawable you'll want to define btn_background.xml as follows:

<selector xmlns:android="http://schemas.android.com/apk/res/android">

<item android:drawable="@drawable/btn_default_disabled_focused" android:state_focused="true" android:state_enabled="false"/>
<item android:drawable="@drawable/btn_default_focused" android:state_focused="true" android:state_enabled="true"/>
<item android:drawable="@drawable/btn_default_disabled" android:state_enabled="false"/>
<item android:drawable="@drawable/btn_default_pressed" android:state_pressed="true"/>
<item android:drawable="@drawable/btn_default_normal" />

</selector>

The trick here is that the LinearLayout is made clickable. That way the user can click anywhere on the 'button'. Then have the ImageView duplicate it's parent state. Which means whenever the LinearLayout changes it's state (Eg, enabled, focused, pressed, etc), the ImageView will also receive it. Whereby the selector drawable will do its thing and update for you.

Upvotes: 14

Related Questions