Is it possible to create a button like radio button without using images?
Would like to have a pressed state upon selection. Then back to normal state when I click other options.
simply include the respective drawables of the radio button in different states (i.e. focused, pressed, checked, or normal). Include these in a selector.xml to specify the looks of the button for the respective states, and include that xml in the android:background attribute of your button. That should do it all...! :)
Check this link to understand the method better: Change how a CheckBox looks
(it is given for a CheckBox, but similar stuff will work for button as a radio button as well).
Edit:
Define round_button.xml as below:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_checked="true" android:state_focused="true"
android:drawable="#drawable/roundbutton_on_background_focus_yellow" />
<item android:state_checked="false" android:state_focused="true"
android:drawable="#drawable/roundbutton_off_background_focus_yellow" />
<item android:state_checked="false"
android:drawable="#drawable/roundbutton_off_background" />
<item android:state_checked="true"
android:drawable="#drawable/roundbutton_on_background" />
</selector>
Then, wherever you need to include that button, just add the following:
<Button android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/round_button"
android:checked="true"/>
[P.S.: Don't forget to include the drawables for a round button, you'll have to search them yourself, or get from the default files (.android), which is given in the link]
Yes you can do it by using states for the button in drawable such as
(I have drawable for states you can have colors too.)
This is the file button_selector.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="#drawable/dark_silver_filled_square" />
<item android:drawable="#drawable/light_silver_filled_square"/>
</selector>
And place this drawable file as background to your button as background like this:
<Button
android:id="#+id/allBtn"
android:layout_width="#dimen/_80sdp"
android:layout_height="#dimen/_22sdp"
android:layout_marginStart="16dp"
android:layout_marginTop="16dp"
android:background="#drawable/button_selector"
android:text="All"
android:textAllCaps="false"
app:layout_constraintBottom_toTopOf="#+id/btnTest"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.0" />
And programmatically create an ArrayList of buttons like this in your class
private var btnList = ArrayList<Button>()
Add your buttons in XML to the list like this:
btnList.add(allBtn)
Then set OnTouchListener for maintaining the selected color in the button like this:
binding.allBtn.setOnTouchListener { v, event ->
buttonStatePreserver(allBtn)
true
}
And pass it to a method to preserve selection for that particular button and make other remaining buttons unselected:
fun buttonStatePreserver(button: Button) {
for(btn in btnList) {
if(btn == button) {
btn.isPressed = true
} else {
btn.isPressed = false
}
}
}
Related
Im trying to change the background of some buttons programmatically with a selector.
I have two different selectors
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#color/palette.greyscale.lightgrey" android:state_pressed="false"></item>
<item android:drawable="#color/palette.blue.mid" android:state_pressed="true"></item>
and
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#color/palette.greyscale.lightgrey" android:state_pressed="false"></item>
<item android:drawable="#color/palette.orange.mid" android:state_pressed="true"></item>
which get applied programmatically depending on a boolean:
void setUI() {
int primary;
Drawable btn_color;
if (((App) getActivity().getApplication()).isGender_isMale()) {
primary = getResources().getColor(R.color.palette_blue_mid);
btn_color = getResources().getDrawable(R.drawable.button_blue);
}
else {
primary = getResources().getColor(R.color.palette_orange_mid);
btn_color = getResources().getDrawable(R.drawable.button_orange);
}
btn_speichern.setBackground(btn_color);
btn_teilen.setBackground(btn_color);
btn_offnen.setBackground(btn_color);
}
Here is one button from the fragment xml:
<Button
android:id="#+id/btn_speichern"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:background="#drawable/button_blue"
android:text="Speichern"
android:textColor="#drawable/button_text_color"
android:textSize="20sp" />
When pressing one button another button also triggers the selector.
When changing the background in the fragment xml it works fine.
I also tried to remove android:background="#drawable/button_blue" which refers to one of the drawables ressource file, but with no sucess.
I think you can get a better picture of what my issue is by taking a look at this:
https://youtu.be/y2xKHz3bgfs
EDIT:
It seems like the selector always selects the button that is pressed and the next button with the same drawable background.
If you've got two distinct buttons you could attach onClickListeners to each and then have the onClick call send a message to your main activity indicating that the button was pressed
I have a "Like" button that the user can click to "like" something (similar to Facebook).
I need to make it so that after the user has liked something, the text color of the button changes to red.
Here's is my code now:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:state_pressed="true"
android:color="#color/red" />
<item
android:color="#color/normal" />
</selector>
The button:
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Like"
android:textColor="#drawable/like_button" />
The problem is that the text color doesn't stay red when I lift my finger, it only changes to red when I hold my finger over the button.
What should I change?
According to your code you are specifically using:
android:state_pressed="true"
This basically means it is only red when pressed hence the results you are getting
Source: https://developer.android.com/guide/topics/resources/color-list-resource.html
You need to include in your Activity (Java)
Button likeButton = (Button) findViewById(R.id.like_button);
likeButton.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
if(likeButton.isSelected())
likeButton.setSelected(false);
else
likeButton.setSelected(true);
}
});
You need to include in your Layout (XML)
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:color="#color/red" android:state_selected="true"/>
<item android:color="#color/red" android:state_pressed="true"/>
<item android:color="#color/normal" android:state_pressed="false"/>
<item android:color="#color/normal"/>
</selector>
<Button
android:id="#+id/like_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/like"
android:layout_gravity="center"
android:text="#string/like" />
Cheers.
In order to "save" the "state" of a "like", you have to update the data model / database behind the button with some boolean indicator that says "yes, this is now liked/unliked".
Your XML selector only says "change color when this is pressed, otherwise revert", it has no logic to say "this is now liked".
You are just stating one state for button that is state pressed.That's why,It is getting red only when you pressed on it.If you want to make the text in Red after pressing the button,Then you should add selector in drawable something like this:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:color=""#color/red" android:state_selected="true"/>
<item android:color=""#color/red" android:state_pressed="true"/>
<item android:color="#color/normal" android:state_pressed="false"/>
<item android:color="#color/normal"/>
</selector>
In your activity,put this code:
final Button button = (Button) findViewById(R.id.button);
button.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
if(button.isSelected())
button.setSelected(false);
else
button.setSelected(true);
}
});
This will select the button and will change the text color to red and if the button is already selected,It will change it to normal.If you just want to keep button selected on click,You can simply add this line in OnClickListener.
button.setSelected(true);
The state_pressed is a mechanism to let you know whether the button is really pressed or not. This is similar to the case of giving a little sound when you really click a key in the virtual keyboard.
Since I do not know the whole story of your situation, I guess that maybe a MVC pattern is suitable for your case.
For example, in the back end, there is a data storing liked= true or false.
In the view, there are two buttons : likeButton and unlikeButton. When liked==false, likeButton is visible and unlikeButton is invisible. When liked==true, likebutton is invisible and unlikeButton is visible.
The OnClick listener for the likeButton and unlikeButton is to set the data liked= true or false.
Both likeButton and unlikeButton can have state_pressed to change the button color to red to let user know that the button is already pressed and being pressed. But, anyway, once the button is released after pressed, the onClick listener should start doing the jobs and finally the already pressed button should become invisible.
Hope that this example can clarify.
I'm using a standard button in my layout:
<Button
android:id="#+id/earlier_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="earlier"/>
And I figured out how to change it's color without changing it's default style:
earlierButton = (Button) findViewById(R.id.earlier_button);
earlierButton.getBackground().setColorFilter(getResources().getColor(R.color.red_500), PorterDuff.Mode.MULTIPLY);
My question is now, how can I set a new selector/ripple or change the color of the current one? Does anyone know the default theme/style, which needs to be overwritten for that? Talking about these buttons:
You can set selector.
See this link for detail. https://stackoverflow.com/a/28431028/850347
You have Button,
<Button
android:id="#+id/earlier_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="earlier"/>
And you may have selecor,
btn_selecor.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/btn_normal" android:state_pressed="false"/>
<item android:drawable="#drawable/btn_pressed" android:state_pressed="true"/>
</selector>
btn_normal, btn_pressed is png images.
Note that this btn_selecor.xml must be placed folder name "drawable"
Finally, set selector to your button programmatically.
Drawable buttonDrawable = getResources().getDrawable(R.drawable.btn_selector);
buttonDrawable.mutate();
btn1.setBackground(buttonDrawable);
Edit1:
Sure, you can set android default button selector by using code below.
In this case, you don't need to make your own selector.
Drawable buttonDrawable = getResources().getDrawable(android.R.drawable.btn_default);
buttonDrawable.mutate();
btn1.setBackground(buttonDrawable);
So I have an image button and I want to have two states on it. It will work like a bookmark button which has two states. If the user presses the button then it changes the image and if it re-presses the button then I want the original image back.
Is that possible? Is there an easier way using another type of button?
Thank you
Try changing the topic to :"What kind of Button can toggle/change states?"
Seems like you need ToggleBotton
<ToggleButton
android:layout_width="wrap_content"
android:layout_height="26dp"
android:background="#color/button_colors"
android:button="#null"
android:textOff="#null"
android:textOn="#null" />
And this xml defines the colors/images of the button at rest/pressed states, put it in res/color/button_colors.xml
<?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/button_rest"/>
<item android:state_checked="true" android:drawable="#drawable/button_on" />
</selector>
Yes, you can use regular buttons also. First make a selector XML file in the res/drawable directory. Example:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_enabled="true" android:state_selected="true"
android:drawable="#drawable/selectedimage"/>
<item android:state_enabled="true" android:state_selected="false"
android:drawable="#drawable/notselectedimage"/>
</selector>
In the button definition in the layout xml, you just add this attribute:
android:background="#drawable/myselectorxmlfile"
And then you programmatically set the selected states yourself (in a onClickListener) and the button images will change background state.
button.setSelected(true) // or false;
These links might help you..
http://developer.android.com/resources/tutorials/views/hello-formstuff.html
and
http://developer.android.com/reference/android/widget/ToggleButton.html
I guess you can use Toggle Button and hope it'll solve your issue.
Just have a look at a simple xml code of it:
<ToggleButton
android:id="#+id/tglbtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textOn="ON"
android:textOff="OFF"
/>
And Just check the answer given here in this link:
Android: Specify two different images for togglebutton using XML
Also,
I've posted a simple tutorial about Toggle Button. Just have a look at my humble blog if you find it helpful. Here is link: http://androiddesk.wordpress.com/2012/03/10/toggle-button-in-android/
Why is this button changing color to orange when clicked:
<Button android:background="#android:drawable/btn_plus" ...>
but this one is not?
<Button android:background="#drawable/ic_btn_round_plus" ...>
Edit:
Found another type of button (text and image) that changes color to orange when clicked
without having to create a selector:
<Button android:text="List" android:drawableTop="#drawable/list" ...>
because the first one is from android framework and has a selector associated to it, and the other one is a custom from your code, and you obviously didn't put a selector on it.
This is nicely explained here.
In short you need to put a selector drawable in the background of your button, instead of just one drawable :
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_selected="true" android:drawable="#drawable/ic_btn_round_plusorange" />
<item android:state_pressed="true" android:drawable="#drawable/ic_btn_round_plusorange" />
<item android:drawable="#drawable/ic_btn_round_plus" />
</selector>
and you create you copy of your drawable but with an orange color added to it for instance.
Android system will switch the drawable when the button is clicked or selected.