I want to have a favorite button on my app like in Gmail
So, when the user click on the star, the star became yellow, and when the user clicked it again, it turn back to normal
How can i make this happen with my custom image?
i have two images
when its not favorited (heart-grey.png)
and when its favorited (heart-red.png)
You can use visibilty to do this.You have to define the xml to have both images at the same postion(It can be done using Relative layout).
final ImageView play = (ImageView) findViewById(R.id.play);
final ImageView play2 = (ImageView) findViewById(R.id.play2);
play.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
Drawable playImage = play.getDrawable();
if (playImage.isVisible()){
play.setVisibility(View.GONE);
play2.setVisibility(View.VISIBLE);
mediaPlayer.start(); }
}
});
play2.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
Drawable playImage2 = play2.getDrawable();
if (playImage2.isVisible()){
play2.setVisibility(View.GONE);
play.setVisibility(View.VISIBLE);
mediaPlayer.pause();
}
If your star is an ImageButton you can do something like this :
starSelected.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
//add a condition to detect if it is already a favorite or not
if(starSelected.getDrawable() == R.drawable.theimage2) {
starSelected.setImageResource(R.drawable.thenewimage);
}else{
starSelected.setImageResource(R.drawable.thenewimage2);
}
}
});
Hope it helps
In your java code create a boolean flag:
boolean isSelected = false
Set an onClickListener inside your onCreate for the star (ImageView, Button whatever it is). Inside onClick, check for the flag like this:
if (isSelected) {
// change image src to unselected
isSelected = false;
} else {
// change image src to selected
isSelected = true;
}
and also you can save the boolean state with SharedPreferences to make sure you get the correct state every time.
Related
When I click a button it changes my ImageView from pic1 to pic2, I use this...
ImageView myImageView = (ImageView) findViewById(R.id.myImageView );
myImageView.setImageResource(R.drawable.pic2);
and it changes my ImageView to pic2 now I want to be able to click the button again and change it back to pic 1 using...
myImageView.setImageResource(R.drawable.pic1);
but I need some way to make a getImageResource so I can run an if statement on which pic is showing and display the other when the button is clicked. For Example if pic 2 is showing it will check which pic is showing and returns pic2 so it knows when the button is clicked to switch it to pic1
Set a flag to identify which image is set.
By default pic1 is selected, add the flag
boolean flag = true;
Then on imageview click listener check for the flag, if the flag is set then set the imageview with pic2 else pic2.
imageView.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
if(flag) {
imageView.setImageResource(R.drawable.pic2);
} else {
imageView.setImageResource(R.drawable.pic1);
}
flag = !flag;
}
});
Try Below code and see if it works for you:
Write this before onCreate: private boolean imageIs = false;
Write this in onCreate:
btnImageChange.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
if (!imageIs) {
imageV.setImageResource(R.mipmap.ic_launcher);
imageIs = true;
} else {
imageV.setImageResource(R.mipmap.ic_launcher_round);
imageIs = false;
}
}
});
You can add a variable, which will have a value when you click the button like
int x= R.drawable.pic2;
And when you click the button for changing the image to pic2 your code will be like
ImageView myImageView = (ImageView) findViewById(R.id.myImageView );
myImageView.setImageResource(R.drawable.pic2);
x=R.drawable.pic2;
And if you want to add pic1 again by clicking the button you can use if loop like
ImageView myImageView = (ImageView) findViewById(R.id.myImageView );
if(x=R.drawable.pic2){
myImageView.setImageResource(R.drawable.pic1);
}
else if(x=R.drawable.pic1){
myImageView.setImageResource(R.drawable.pic2);
x=R.drawable.pic2;
}
else{
myImageView.setImageResource(R.drawable.pic1);
}
I am making a music player app in which there is an image of the play button and once clicked it switch to pause.png and song start playing. Clicking again on the button will change the image to play.png and pause the sound. This pattern continues.
This question has been previously answered first click change to new image and second click change to old image, android
But the checked answer doesn't work because boolean variable used to switch need to be declared final. And once declared final I cannot change the value of the variable.
boolean showingFirst = true; //Declare globally
image1.setOnClickListener(new OnClickListener() {
public void onClick(View v) {
if(showingFirst){
image1.setImageResource(R.drawable.img1);
showingFirst = false;
}else{
image1.setImageResource(R.drawable.img2);
showingFirst = true;
}
}
});
You can do this in this way using tag attribute of ImageView:
iv.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
if(iv.getTag().equals("playing")){
iv.setImageResource(R.mipmap.play);
iv.setTag("paused");
} else {
iv.setImageResource(R.mipmap.pause);
iv.setTag("playing");
}
}
});
And your ImageView declaration in xml file will be like below:
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true"
android:src="#mipmap/pause"
android:tag="playing"
android:id="#+id/iv"/>
I am trying to toggle my button's background drawables, so that when the user clicks the button its background is changed and when the user clicks the button again its background returns to defaul. Here is my code:
public void Favorites(View V) {
Button star = (Button) findViewById(R.id.buttonStar);
if(star.getBackground().equals(R.drawable.btn_star_off)) {
star.setBackgroundResource(R.drawable.btn_star_on);
} else {
star.setBackgroundResource(R.drawable.btn_star_off);
}
}
I am pretty sure this is not how you use drawables with if statements. Can someone suggest a way to do it?
private boolean isButtonClicked = false; // You should add a boolean flag to record the button on/off state
protected void onCreate(Bundle savedInstanceState) {
......
Button star = (Button) findViewById(R.id.buttonStar);
star.setOnClickListener(new OnClickListener() { // Then you should add add click listener for your button.
#Override
public void onClick(View v) {
if (v.getId() == R.id.buttonStar) {
isButtonClicked = !isButtonClicked; // toggle the boolean flag
v.setBackgroundResource(isButtonClicked ? R.drawable.btn_star_on : R.drawable.btn_star_off);
}
}
});
}
You can create an xml in the drawable folder.
This xml (you choose the name...let's call it "bg_button_star.xml") could look just like this:
<?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/btn_star_on" />
<item android:drawable="#drawable/btn_star_off" />
Then you have to assign this drawable file to the Button background property in the layout file.
android:background="#drawable/bg_button_star"
If you want to do this programmatically then you just have to do:
button.setBackgroundResource(R.drawable.bg_button_star);
When the user click the first time on the button, you set the Selected state to 'true'. The background changes accordingly. (viceversa for the 'false' Selected state).
You can do in your onClick() something like:
if(star.getTag()==R.drawable.btn_star_on){
star.setTag(R.drawable.btn_star_off);
star.setBackgroundResource(R.drawable.btn_star_off);
} else {
star.setTag(R.drawable.btn_star_on);
star.setBackgroundResource(R.drawable.btn_star_on);
}
Obviously it's better to the the tag before the if and else statement based on your informations. I don't know the rest of your code and how you check if this button has to be iniziatilized with the drawable resource btn_star_off or btn_star_on
You can try this.
public void Favorites(View V) {
Button star = (Button) findViewById(R.id.buttonStar);
if(star.getBackground().getConstantState().equals(getResources().getDrawable(R.drawable.btn_star_off).getConstantState()))
{
star.setBackground(R.drawable.btn_star_on);
} else {
star.setBackground(R.drawable.btn_star_off);
}
}
But make sure you are calling this method onClick() of the start button.
Other wise you have to do something like this.
Button star = (Button) findViewById(R.id.buttonStar);
star.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
if(v.getBackground().getConstantState().equals(getResources().getDrawable(R.drawable.btn_star_off).getConstantState()))
{
v.setBackground(R.drawable.btn_star_on);
} else {
v.setBackground(R.drawable.btn_star_off);
}
}
});
In this case, instead of using Button you should use ToggleButton.
There is a API Guide for it:
http://developer.android.com/guide/topics/ui/controls/togglebutton.html
Dont do it like that. Use a selector resource instead http://www.compiletimeerror.com/2014/03/android-button-selector-tutorial-with.html
I have a ImageView that does an action called setAsFavorite(). This action sets a product as favorite, so I change the image of the ImageView. But when the product is favorite, I want to change the onclick event, so when the user presses the imageView, the action called should be unsetAsFavorite() instead of setAsFavorite.
How can I change the onclick event dynamically?
You could use A flag to know if it has been set as favorite then act on that
yourImageView.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
if(isSetAsFavorite){
unsetAsFavorite();
} else {setAsFavorite();}
}
});
where is isSetAsFavorite is of boolean type.
The answer given by av_lee is sufficient. But there is a better option.
Use if instead,
boolean isFavourite = false;
public void switchFavorite(){//Replace function setAsFavorite() with this
if(isFavourite)
isFavourite = false;
else
isFavourite = true;
}
This way you decrease the number of function needed for the job.
I think there are two operation in your onclick method setAsFavorite() & unsetAsFavorite()
int myFlag =0;
onclick(){
if(myFlag == 0)
setAsFavorite();
else
unsetAsFavorite();
}
void setAsFavorite(){
myFlag = 1;
//do your work...
}
void unsetAsFavorite(){
myFlag = 0;
//do your work...
}
Get a reference to your ImageView:
getView().findViewById(R.id.your_img_view_id)
and then assign a new listener to it like this:
yourImageView.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
// your code here
}
});
This way you change an old listener with the new one.
I am trying to change the background image of a button that is clicked. The button whose image I am trying to toggle is the same button that is clicked. I ultimately want the program to test the current background image and change it to the other picture given the result of the test.
final Button testButton = (Button) findViewById(R.id.buttonTestButton);
testButton.setOnClickListener(new View.OnClickListener() {
public void onClick(View v) {
//toggle picture
if (testButton.equals(getResources().getDrawable(R.drawable.fakepicture))) {
testButton.setBackgroundResource(R.drawable.alternatepicture);
}
else {
testButton.setBackgroundResource(R.drawable.fakpicture);
}
}//end void onClick
});//end test button on click listener
try
testButton.getBackground().equals(getResources().getDrawable(R.drawable.fakepicture));
However ToggleButton might suit your case better.
As others have said, your equals method is comparing the button itself with the image, but you need to compare the background drawables.
I recommend loading the images drawables you want to use and then using their references later to make things more clear, something like this:
final Drawable first = getResources().getDrawable(
android.R.drawable.arrow_up_float);
final Drawable second = getResources().getDrawable(
android.R.drawable.arrow_down_float);
final Button testButton = (Button) findViewById(R.id.toggleButton);
testButton.setOnClickListener(new View.OnClickListener() {
public void onClick(View v) {
if (testButton.getBackground().equals(first)) {
testButton.setBackgroundDrawable(second);
} else {
testButton.setBackgroundDrawable(first);
}
}
});
as the other friends answered , it is preferable to use the ToggleButton in Android ,
and in your case, if you want to keep your code , so your method should be like this :
final Button testButton = (Button) findViewById(R.id.buttonTestButton);
int status = 0;//GLOBAL VARIABLE : the status of the Button ( 0 or 1 )
testButton.setOnClickListener(new View.OnClickListener() {
public void onClick(View v) {
//toggle picture
if (status == 0) {
testButton.setBackgroundResource(R.drawable.alternatepicture);
status=1 ; // change the status to 1 so the at the second clic , the else will be executed
}
else {
testButton.setBackgroundResource(R.drawable.fakpicture);
status =0;//change the status to 0 so the at the second clic , the if will be executed
}
}//end void onClick
});//end test button on click listener
You can simply use ToggleButton: Android ToggleButton and use StateList for the changing of the background: StateList using the check attribute.
You can use Buttons or Image buttons..
private ImageButton mod1,mod2;
mod1 = (ImageButton) findViewById(R.id.mod1);
mod2 = (ImageButton) findViewById(R.id.mod2);
mod1.setOnClickListener(this);
mod2.setOnClickListener(this);
public void onClick(View v) {
mod1.getDrawable().clearColorFilter();
mod2.getDrawable().clearColorFilter();
switch (v.getId()) {
case R.id.mod1:
mod1.getDrawable().setColorFilter(0xfff47521,PorterDuff.Mode.SRC_ATOP);
break;
case R.id.mod2:
mod2.getDrawable().setColorFilter(0xfff47521,PorterDuff.Mode.SRC_ATOP);
break;
}
}