I am trying to do a simple selector.
Here is my selector xml code, its called "butt.xml":
<?xml version="1.0" encoding="utf-8"?>
<item android:drawable="#drawable/btn_activate_on" android:state_pressed="true"/>
<item android:drawable="#drawable/btn_activate_off" android:state_pressed="false"/> <!-- default -->
thats the layout:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<ImageButton
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_marginBottom="42dp"
android:src="#drawable/butt" />
and thats the code:
ImageButton ib;
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
ib = (ImageButton) findViewById(R.id.imageView1);
ib.setOnClickListener(this);
}
#Override
public void onClick(View v) {
ib.setSelected(true);
}
My problem is that the state is not changing, when i press and hold on the button. It is changing its image to the "selected" one when I pressed. But when I release my finger, it is getting back to the "not sellected" state.
Why is that so? How can I make it stay in "Selected" mode?
No need to use selector if you need to show a button's state as selected or non-selected.
Instead you have to setBackground() using code and by managing a flag you can check that your button is currently selected or not.
Like
if(flag)
btn.setDrawableBackground(R.id.btn_activate_on)
else
btn.setDrawableBackground(R.id.btn_activate_off)
If you want to show the effect on state press create Two selectors with opposite states.
<item android:state_pressed="true"
android:drawable="#drawable/btn_activate_on"></item>
<item android:drawable="#drawable/btn_activate_off"></item>
and another one is
<item android:state_pressed="true"
android:drawable="#drawable/btn_activate_off"></item>
<item android:drawable="#drawable/btn_activate_on"></item>
Use this in your selector butt.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/btn_activate_on" android:state_pressed="true"/>
<item android:drawable="#drawable/btn_activate_off"/>
</selector>
Also yuo can remove this line ib.setSelected(true); from your onClick(). It will be taken care off.
UPDATE
<ImageButton
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_marginBottom="42dp"
android:background="#drawable/butt" />
You need to set the background instead of setting the src.
A button shouldn't be used for toggling like that - use a checkbox instead.
"Selected" for a button means that the user currently has their finger down on the button, so when the user lifts their finger it won't be selected anymore.
Related
I followed steps on other places, and I made an xml file like so:
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/yeah2"
android:state_pressed="true" />
<item android:drawable="#drawable/yeah" />
My activity xml for my button looks like this:
<ImageButton
android:layout_width="150dp"
android:layout_height="wrap_content"
android:id="#+id/imageButton"
android:onClick="play1"
android:layout_below="#+id/textView"
android:layout_alignParentStart="true"
android:layout_marginTop="100dp"
android:src="#drawable/yeah"
android:clickable="false"
android:nestedScrollingEnabled="true"
android:background="#drawable/highlight" />
How to assign highlighted state image to an Android Image Button ?
make xml like this
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<!-- Remember: order is important. First matching state(s) is rendered) -->
<item
android:state_selected="true"
android:drawable="#drawable/yeah" />
<item
android:drawable="#drawable/yeah2" />
Then in Java do following
imageButton.setImageDrawable(getBaseContext().getResources().getDrawable(R.drawable.ImageButton));
//set the click listener
imageButton.setOnClickListener(new OnClickListener() {
public void onClick(View button) {
//Set the button's appearance
button.setSelected(!button.isSelected());
if (button.isSelected()) {
//Handle selected state change
} else {
//Handle de-select state change
}
}
});
I am using custom action bar in an Android app, which has custom ImageButtons on the right, with their onClick behaviour added programatically (see code snippet below).
XML source of the button
<ImageButton
android:id="#+id/btn_refresh"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_toLeftOf="#+id/btn_right_menu"
android:background="#null"
android:contentDescription="#string/image_description"
android:onClick="refresh"
android:padding="10dp"
android:src="#drawable/button_refresh" />
OnClickListener source
mRefreshButton = (ImageButton) findViewById(R.id.btn_refresh);
mRefreshButton.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
doSomething();
}
});
I would like to change the background color of my ImageButton programatically (without having to use additional graphics), so that the background would change when the user clicks on the button (after the click the background should go back to normal, i.e. transparent). How do I do that?
Use a selector for your ImageButton and set background from xml.
If you want to use Drawable Images:
<?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/pressed_bg" /> <!-- pressed -->
<item android:state_focused="true"
android:drawable="#drawable/focused_bh" /> <!-- focused -->
<item android:drawable="#drawable/default_bg" /> <!-- default -->
</selector>
If you want to use just color:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_selected="true" android:drawable="#android:color/white" />
<item android:state_pressed="true" android:drawable="#android:color/white" />
<item android:drawable="#android:color/transparent" />
</selector>
The invalidate() method will force a redraw of any view:
Try using this:
mRefreshButton = (ImageButton) findViewById(R.id.btn_refresh);
mRefreshButton.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
Drawable replacer = getResources().getDrawable(R.drawable.replacementGraphic);
mRefreshButton .setBackgroundDrawable(replacer);
mRefreshButton .invalidate();
}
});
See here for reference.
To change color you can use the following
Btn.setBackgroundColor(Color.BLUE);
To set back to transparent
Btn.setBackgroundColor(Color.parseColor("#000000"));
I have image Button like below.
<ImageButton
android:id="#+id/imagebutton"
android:layout_width="250dp"
android:layout_height="100dp"
android:background="#drawable/perm_group_calendar"/>
perm_group_calendar.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_selected="true" android:drawable="#drawable/perm_group_calendar_selected" />
<item android:drawable="#drawable/perm_group_calendar_normal" />
</selector>
The selected state is not working by itself. I found answer from this SO
Android ImageButton with a selected state?
I used the below code. now it works.
imageButton.setOnClickListener(new OnClickListener() {
public void onClick(View button) {
if (button.isSelected()){
button.setSelected(false);
//...Handle toggle off
} else {
button.setSelected(true);
//...Handled toggle on
}
}
});
Why We have to toggle the selected state ?
Because the selected state isn't automatically shown by an ImageButton, which - normally (as opposed to artificially) - shows only the normal and pressed statuses (not sure about the focused state, but it should).
You could else use a custom ToggleButton (or a Switch or a CheckBox).
Anyway, your solution doesn't look that bad at all, to me.
i think you should do some thing as the following in your drawable XML file :
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_selected="true" android:drawable="#drawable/aaaa" />
<item android:state_pressed="true" android:drawable="#drawable/aaaa"></item>
<item android:drawable="#drawable/ic_launcher" />
</selector>
and your ImageButton like the following :
<ImageButton
android:id="#+id/imageView"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#123456"
android:padding="10dp"
android:scaleType="fitXY"
android:src="#drawable/drawableFile" />
you should add the android:state_pressed="true" , and that should do the trick for the pressed state .
as RomianGuy mentioned in this answer :
state_selected is used when an item is selected using a keyboard/dpad/trackball/etc .
so i think thats why you have to toggle the state .
Hope That Helps .
Just a note. If you want to change icon AND color for ImageButton - you need 2 selectors - for 'android:src' and for 'android:src' :
<ImageButton
android:id="#+id/ibToFavorites"
android:layout_width="35dp"
android:layout_height="35dp"
android:layout_gravity="center_vertical"
android:background="#null"
android:src="#drawable/selector_checkin_to_favourite"
android:tint="#color/selector_checkin_to_favourite"
android:layout_marginEnd="15dp" />
res/drawable/selector_checkin_to_favourite.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:state_selected = "true"
android:drawable="#drawable/ic_star_black_45dp"/>
<item
android:drawable="#drawable/ic_star_border_black_45dp"/>
</selector>
res/color/selector_checkin_to_favourite.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:state_selected = "true"
android:color="#color/colorAccent"/>
<item
android:color="#color/colorSecondary"/>
</selector>
I am new to android and working with the following code, I am trying to set a default image button which when clicked switched to the on state till pressed again or tapped anywhere else on the screen such that the popup associated with the on state goes away.
Here's the code:
java code:
private void setOnclickListeners(View view){
ImageButton button = (ImageButton) view.findViewById(R.id.menu_button);
button.setOnClickListener(this);
}
I want to connect this code to the following so on and off states are triggered:
<ImageButton
android:id="#+id/menu_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:background="#android:color/transparent"
android:paddingRight="8dp"
android:src="#drawable/menu_btn" />
Here's the menu_btn code for xml class :
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_focused="true" android:drawable="#drawable/menu_on"/>
<item android:state_pressed="true" android:drawable="#drawable/menu_on" />
<item android:drawable="#drawable/menu_off" />
</selector>
Any clue how to go about it? Ant help appreciated. Thanks!justin
You may want to check ToggleButton (or any sub-class of Checkable) for your implementation and then setting its state to something like this,
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_checked="false" android:drawable="#drawable/menu_off"/>
<item android:state_checked="true" android:drawable="#drawable/menu_on" />
<item android:drawable="#drawable/menu_off" />
</selector>
Then on your Java code, get an instance of your ToggleButton (or Checkable) and update the setChecked-method accordingly to your actions.
I need to make a toggle button using two image instead of ON/OFF state.
At off state i set a background image.But the OFF text can not removed while i use background image.
And i can not set another image on ON state by clicking the toggle button :(
I am new in android.
I hope you guys help me get out of this problem
Do this:
<ToggleButton
android:id="#+id/toggle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/check" <!--check.xml-->
android:layout_margin="10dp"
android:textOn=""
android:textOff=""
android:focusable="false"
android:focusableInTouchMode="false"
android:layout_centerVertical="true"/>
create check.xml in drawable folder
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<!-- When selected, use grey -->
<item android:drawable="#drawable/selected_image"
android:state_checked="true" />
<!-- When not selected, use white-->
<item android:drawable="#drawable/unselected_image"
android:state_checked="false"/>
</selector>
AkashG's solution don't work for me. When I set up check.xml to background it's just stratched in vertical direction. To solve this problem you should set up check.xml to "android:button" property:
<ToggleButton
android:id="#+id/toggle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:button="#drawable/check" //check.xml
android:background="#null"/>
check.xml:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<!-- When selected, use grey -->
<item android:drawable="#drawable/selected_image"
android:state_checked="true" />
<!-- When not selected, use white-->
<item android:drawable="#drawable/unselected_image"
android:state_checked="false"/>
</selector>
You can try something like this.
Here on click of image button I toggle the imageview.
holder.imgitem.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View view) {
if(!onclick){
mSparseBooleanArray.put((Integer) view.getTag(), true);
holder.imgoverlay.setImageResource(R.drawable.ipad_768x1024_editmode_delete_overlay_com);
onclick=true;}
else if(onclick)
{
mSparseBooleanArray.put((Integer) view.getTag(), false);
holder.imgoverlay.setImageResource(R.drawable.ipad_768x1024_editmode_selection_com);
onclick=false;
}
}
});