Clicking an ImageButton to change to a different image everytime - java

I have an ImageButton, which as false appears as a gray image, while as true appears as a green image. If I use state_pressed="true" and state_pressed="false" the function DOES work, however I need to hold the left-click button for the button to change to true.
P.S: I do believe that I am using the wrong state but I have tried the others but didn't work.
My question is: How do I keep the image as true with just clicking once on the ImageButton?
Code:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/green_clock" android:state_selected= "true"> </item>
<item android:drawable="#drawable/grey_clock" android:state_selected="false"> </item>
</selector>
Java File:
public void onClickClock(View v)
{
ImageButton clockBtn = (ImageButton)findViewById(R.id.Clock);
clockBtn.setImageResource(R.drawable.clock);
}
activity.xml:
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/Clock"
android:src="#drawable/clock"
android:background="#android:color/transparent"
android:layout_alignParentTop="true"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
android:layout_marginTop="73dp"
android:onClick="onClickClock" />
Thanks!

Add setSelected()
public void onClickClock(View v) {
ImageButton clockBtn = (ImageButton)findViewById(R.id.Clock);
clockBtn.setSelected(!clockBtn.isSelected());
}

Related

How to change the background color of a clicked button in android when background tint attribute is default in button?

These are the attributes I have used in this button.
I have also created one XML file button_round_corner_view.
<Button
android:id="#+id/true_button"
android:layout_width="90dp"
android:layout_height="50dp"
android:layout_margin="10dp"
android:background="#drawable/button_round_corner_view"
android:padding="10dp"
android:text="True"
android:textColor="#000000"
android:textStyle="bold"
app:backgroundTint="#F8F4F4"
/>
This is the XML file attribute that I have created for a better button look.
please provide me the best answer for this problem and also tell me how to stop
the background tint attribute which applied by default on the button
<?xml version="1.0" encoding="utf-8"?>
<shape
xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<corners
android:radius="20dp"/>
<!-- This is the border color -->
<stroke
android:width="2dp"
android:color="#color/purple_700"/>
<!-- This is the background color -->
<solid
android:color="#color/white"/>
</shape>
BackgroundTint attribute in a button is the default. And I want to change the background color of my button when the user clicks the button.
How to achieve this. please help me.
For Example Lets say there button1 so it will be like
button1.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
if(Answer.equals("Correct")){
button1.setBackgroundColor(mContext.getResources().getColor(R.color.DarkGreen));
}else if(Answer.equals("InCorrect")){
button1.setBackgroundColor(mContext.getResources().getColor(R.color.red));
}
}
});
You can do something like this. This is how you change colour of a button.

How to change iconTint of a specific item in BottomNavigationView

I am trying to change the iconTint of the favorites menuItem in the bottomNavigationView.
To achieve so, I've tried the following:
Creating a selector with colors
Creating a selector with drawables
Programatically setting icon drawable
programatically setting iconItemTint of bottomNavigationView to null
Using colored icon drawables, instead of iconItemTint
Setting the icon of favorites to the drawable selector
Setting the background of favorites to the desired color
Setting iconTint of favorites to desired color
None of the above solutions worked for me. Then I figured that it might be because I'm using com.google.android.material.bottomnavigation.BottomNavigationView instead of android.support.design.widget.BottomNavigationView
My bottomNavigationView
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/bottom_navigation"
app:labelVisibilityMode="labeled"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
app:itemTextColor="#232323"
app:menu="#menu/bottom_nav_menu" />
My bottom_nav_menu
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
...
<item
android:title="Favorites"
android:id="#+id/btn_favorites"
android:enabled="true"
android:background="#color/red_heart"
android:icon="#drawable/ic_favorite_red"
app:showAsAction="ifRoom" />
...
Here is a screenshot of my app:
The selected color is blue for all menuItems. I want the favorites to have the color #ff4444 (pale red) when selected.
I wasted a lot of time searching the correct answer to "How to change color of one specific icon of Bottom Navigation View" and I resolved this by myself. Here is the example:
val view = viewBinding.bottomNavigationView.menuView as NavigationBarMenuView
val itemToChange = view.findViewById<NavigationBarItemView>(R.id."item_to_change_id")
itemToChange.setIconTintList(
ColorStateList.valueOf(
ContextCompat.getColor(requireContext,R.color."color you need")
)
)
I didn't try this with android.support.design.widget.BottomNavigationView, but with com.google.android.material.bottomnavigation.BottomNavigationView it works correctly :)
<android.support.design.widget.BottomNavigationView
android:id="#+id/navigation"
android:layout_width="match_parent"
android:layout_height="56dp"
android:layout_gravity="bottom"
android:layout_marginBottom="0dp"
app:itemTextColor="#color/bootom_text_color"
app:itemIconTint="#color/bootom_text_color"
android:background="#color/bottom_color"
app:elevation="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:menu="#menu/bottom_navigation" />
create colour.xml in values
<?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_checked="true" android:color="#FFFF00" />
<item android:color="#color/white" /> </selector>

ImageButton onclick

When I click restart button, it creates blue coloured thing. How to set that blue coloured thing to transparent? Please help me.
Set your image in android:src and set the background as null to remove the visual feedback:
android:background="#null"
Please note that this will remove the visual feedback for button press and is not recommended. Use a selector to set different images depending on the button state for better UX
If you are using "Button", try using "selector" as background(android:background="#drawable/button_selector").
A sample selector -> button_selector.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/button_bg_selected" android:state_selected="true"></item>
<item android:drawable="#drawable/button_bg_pressed" android:state_pressed="true"></item>
<item android:drawable="#drawable/button_bg_normal"></item>
</selector>
use ImageView Instead of ImageButton
<ImageView
android:layout_width="120dp"
android:layout_height="130dp"
android:layout_alignParentBottom="true"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:layout_marginEnd="20dp"
android:layout_marginRight="20dp"
android:background="?android:selectableItemBackground" android:id="#+id/ibtn_restart" />
and in Java file
ImageView ibtn_restart=(ImageView)findViewById(R.id.ibtn_restart);

How to change background resource of an image button to implement on/off switch [duplicate]

This question already has answers here:
Toggle button using two image on different state
(3 answers)
Closed 9 years ago.
I have two power button images, one red and the other is green. I want to create a button set its background resource to red power button initially. I want its resource to be changed to green when it is pressed & after another click, i want it to turn back into red again. Please Help...
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>
This works perfectly fine.
use ToggleButton. numerous examples available like here.
How to Make a Toggle Button with Custom On/Off Graphics
Use a CheckBox with a custom selector.
This will provide the ability to switch between checked and unchecked images for enabled and disabled states without any programmatic intervention in Java code.
Example - XML layout:
<CheckBox
android:id="#+id/my_custom_toggle"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:button="#drawable/my_selector"
/>
Example - drawable/my_selector.xml:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:state_checked="true"
android:state_enabled="false"
android:drawable="#drawable/ic_button_custom_toggle_disabled"
/>
<item
android:state_checked="false"
android:state_enabled="false"
android:drawable="#drawable/ic_button_custom_toggle_disabled"
/>
<item
android:state_checked="true"
android:drawable="#drawable/ic_button_custom_toggle_linked"
/>
<item
android:state_checked="false"
android:drawable="#drawable/ic_button_custom_toggle_unlinked"
/>
Add custom .png images for each of the above states.
you need to place two images red and green in drawable folders.
static int set = 0;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
final ImageButton toggle = (ImageButton) findViewById(R.id.imageButton1);
toggle.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
if(set==0)
{
toggle.setBackgroundResource(R.drawable.red);
set=1;
}
else
{
toggle.setBackgroundResource(R.drawable.green);
set=0;
}
}
});
}

Android: Image set as button background is not being shrunk?

I created a button with an image set as the background through a drawable. When I run the program the image is not being centered nor shrunk to fit the button. But when you click it, the pressed image is showing properly. This was working just the other day and I have no clue what happened to change it.
main.xml
<Button
android:id="#+id/rightarrow"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="1"
android:background="#android:color/transparent"
android:clickable="false" />
Activity.java
rightarrow = (Button) findViewById(R.id.rightarrow);
rightarrow.setBackgroundResource(R.drawable.rightarrow_drawable);
rightarrow_drawable.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/rightarrow_pressed" android:state_pressed="true"/>
<item android:drawable="#drawable/rightarrow" />
</selector>
Why not set the selector in XML? You do not have to set it by code.
Try Project->Clean in Eclipse - maybe your resources got mixed.
Just replace your Button with an ImageView

Categories