making imagebutton changed when presses - android

i want to make image button, so when it pressed i will replase the not-pressed image to pressed image of the button, and then go to other activity. i have two different images in drawable.
i have two xml files:
first one- load the main activity: background and image button
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#android:color/black"
android:orientation="vertical" >
<ImageButton
android:id="#+id/b1_l"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/s1"
android:scaleType="centerCrop"
android:background="#color/trans"
android:src="#drawable/b1_l" />
</RelativeLayout>
second one:
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="false"
android:drawable="#drawable/image_not_pressed" />
<item android:state_pressed="true"
android:drawable="#drawable/image_pressed"" />
</selector>
what is the code that i need to write in addition to my xml?
or can i pass the xml and write it only as code...?
thanks!

you need to usually have drawable for pressed and default(unpressed) state. You can have the xml file like this(below) for that. You need to put this xml file in the drawable folder and then use as src for ImageButton or background source in case of Button.
Lets name it is mybutton.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_focused="true" android:state_pressed="true"
android:drawable="#drawable/your image name" />
<item android:state_focused="false" android:state_pressed="true"
android:drawable="#drawable/your image name" />
<item android:drawable="#drawable/your image name" />
</selector>
You layout file for main activity:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#android:color/black"
android:orientation="vertical" >
<ImageButton
android:id="#+id/b1_l"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/s1"
android:scaleType="centerCrop"
android:background="#color/trans"
android:src="#drawable/mybutton" />
</RelativeLayout>

You migth want do check out android developer guide on this
http://developer.android.com/guide/topics/ui/controls/button.html

Related

Android button effect does not work

I want to use 2 pictures for one button to make a effect when user click it.
I think I did properly but, the effect does not work.
Specifically, the button background set to camera_button_after.jpg which is meant for pressed state and does not change when it is clicked.
Could you tell me what's wrong? I'll be very appreciated.
Here is the main_frame.xml which contains buttons.
main_btn1.xml, main_btn2.xml, main_btn3.xml are selectors.
Those three selectors have same structure and also same problem..
<?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:orientation="vertical" >
<Button
android:id="#+id/button001"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#drawable/main_btn1"
android:text=" Mood"
android:textSize="30dp"/>
<Button
android:id="#+id/button002"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#drawable/main_btn2"
android:text=" Mood Lists"
android:textSize="30dp"/>
<Button
android:id="#+id/button003"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#drawable/main_btn3"
android:text=" Help"
android:textSize="30dp" />
</LinearLayout>
Here is the main_btn1.xml
<selector
xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:state_pressed="false"
android:drawable="#drawable/camera_button_before" />
<item
android:state_pressed="true"
android:drawable="#drawable/camera_button_after"/>
</selector>
One more question is..I think the eclipse doesn't fully recognize the pictures and xml files. I cleaned the project few times and reboot the eclipse but it they still have question mark like below
I was facing the similar problem. I tried the below code. I did get this solution from stack overflow itself, but do not have its link for reference. So writing the code snippet for xml in drawable folder. Do remember to provide the right image names :)
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:state_enabled="false"
android:drawable="#drawable/image1" />
<item
android:state_pressed="true"
android:state_enabled="true"
android:drawable="#drawable/image2" />
<item
android:state_focused="true"
android:state_enabled="true"
android:drawable="#drawable/image3" />
<item
android:state_enabled="true"
android:drawable="#drawable/image4" />
</selector>
Let me know how it works for you.
Replace your xml with this.
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:drawable="#drawable/camera_button_before" />
<item
android:state_pressed="true"
android:drawable="#drawable/camera_button_after"/>

Change Color onClick and background on Focus

i have a ListView in my Navigation Drawer and want it looks like the Playstore App or Youtube App.
Means onClick changing FontColor for Example to red and when i just hold it the background should turn grey.
Do i have to use 2 onitemclicklistener?
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="48dp">
<ImageView
android:id="#+id/icon"
android:layout_width="25dp"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_marginLeft="12dp"
android:layout_marginRight="12dp"
android:contentDescription="#string/DrawerListIcon"
android:src="#drawable/ic_home"
android:layout_centerVertical="true" />
<TextView
android:id="#+id/title"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_toRightOf="#id/icon"
android:textSize="14sp"
android:textStyle="bold"
android:minHeight="?android:attr/listPreferredItemHeightSmall"
android:textAppearance="?android:attr/textAppearanceListItemSmall"
android:textColor="#color/DrawerListFontColor"
android:gravity="center_vertical"
android:paddingRight="40dp"
android:paddingLeft="0dp"/>
</RelativeLayout>
Tried with Item and Selector. First thing Font Color don't change when i pressed the Button. Second the background of the Relative Layout turns blue insead of Grey.
drawer_list_font.xml
<?xml version="1.0" encoding="utf-8"?><selector xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:state_focused="true"
android:color="#color/DrawerListFontColorPressed"
/>
<item android:color="#color/DrawerListFontColor"/></selector>
drawer_list_background.xml
<?xml version="1.0" encoding="utf-8"?><selector xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:state_focused="true"
android:color="#color/DrawerListBackgroundFocused"
/>
<item
android:color="#color/DrawerBackground"
/></selector>
I had to use android:drawable instead of background on the relative Layout. On the Textview Android Stuio accepted android:color.
This is changed by changing view from ur java file at every click event u can change the view. U have to make multiple view ie xml files for that. Which are dynamically changed or u can also send parameters to a function and create an xml at runtime but that will be too deep for u
No need for listeners at all.
A better approach here is to create drawable XML's with definitions for every state ("pressed", "focused", etc).
Check out Color State List resources
For example:
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_focused="true" android:state_pressed="false"android:color="#80000" />
<item android:state_focused="true" android:state_pressed="true" android:color="#ff0000" />
<item android:state_focused="false" android:state_pressed="true" android:color="#ff0000" />
<item android:color="#color/DrawerListFontColor" />
</selector>

Android: how to use selector?

I have a problem of using selector that it does not work as what I expect. I wanna click on it then it gives me reaction and I select it(By long click but I probably do it through programmatic way) then it gives me another reaction. However, it reacts nothing in result....
reaction part:
<TableRow
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:weightSum="10"
android:padding="5dp"
android:background="#drawable/border_bottom"
>
<LinearLayout
android:layout_weight="9"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:background="#drawable/selector_row">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/grey"
android:text="#string/tel"/>
<TextView
android:id="#+id/telText"
android:layout_width="wrap_content"
android:textSize="18sp"
android:layout_height="wrap_content"
android:text="#string/blank"/>
</LinearLayout>
<ImageButton
android:layout_weight="1"
android:id="#+id/tel_call"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:src="#drawable/ic_action_call"
android:background="#drawable/border_left"/>
</TableRow>
selector_row.xml:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
<item
android:state_pressed="true"
android:drawable="#color/semitransparent_grey"></item>
<item
android:state_selected="true"
android:drawable="#color/semitransparent_blue"></item>
<item
android:drawable="#color/transparent"></item>
</selector>
Thank you to all brothers trying hard to answer me. I have got the answer....just simply by setting android:clickable="true" at LinearLayout. Ha, it's silly.....
I remember dude who provide relating information but I ignored... sorry to him.
Create an XML file and place it in the drawable folder. Open it and write the following code:
<selector
xmlns:android="http://schemas.android.com/apk/res/android"
>
<item
android:drawable="YOUR IMAGE OR COLOR"
android:state_pressed="true"/>
<item
android:drawable="YOUR IMAGE OR COLOR"
android:state_selected="true"/>
<item
android:drawable="YOUR IMAGE OR COLOR"
android:state_focused="true"/>
</selector>
Then in your main XML file, place android:background="#drawable/selector.xml"
What are you expecting? A reaction only when it's clicked?
Try removing removing:
android:state_selected="true"
Edit:
This should be your selector:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/my_drawable" android:state_selected="true"></item>
<item android:drawable="#drawable/my_drawable" android:state_pressed="true"></item>
<item android:drawable="#drawable/my_drawable"></item>
</selector>
What is the behaviour that you are experiencing?
Edit:
<LinearLayout
android:layout_weight="9"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:background="#drawable/selector_row"
android:duplicateParentState=true>
I don't know if it actually solves the problem

Image pressed button changing size

I realize this has been asked multiple times, but my image is changing size when it is pressed (which is should be the same size, but a different image). I've previously tried setting the size of the button in java, but it didn't work either. Here is my code.
XML Selector
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true"
android:drawable="#drawable/testbuttonpressed" /> <!-- pressed -->
<item android:drawable="#drawable/testbutton" /> <!-- default -->
</selector>
XML
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/backtest1">
<Button
android:id="#+id/start_button"
android:layout_width="225px"
android:layout_height="55px"
android:layout_marginTop="10dp"
android:layout_gravity="center"
android:text="#string/start"
android:background="#drawable/buttonsxml"
/>
</LinearLayout>
It turns out my pictures were a pixel off...

Android - Image button (XML) isn't working?

I have three images in my drawable folder, and an XML Image Button code:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">\
<item android:state_pressed="true"
android:drawable="#drawable/happycarrot" /> <!-- pressed -->
<item android:state_focused="true"
android:drawable="#drawable/largerunicornbutton2" /> <!-- focused -->
<item android:drawable="#drawable/largerunicornbutton" /> <!-- default -->
</selector>
In my layout folder, I have my main XML:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<ImageView
android:src="#drawable/button"
android:layout_height="fill_parent"
android:layout_width="fill_parent"
></ImageView>
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/hello"
/>
</LinearLayout>
When I run it in the emualtor I only get the first image. It doesn't do anything else. Is there anything I can do to solve this?
Using a Linearlayout instead of a relative one fixes the issue.

Categories

Resources