Develop Reference

Changing src for ImageButton when clicked

I am doing an Android application in which I have placed an image button. I have given a default image source. When I click the image it should change the image source to another and if I press the image again I should get the default image back.
It's like toggling between two images. But I don't want to use toggleButton due to requirements of my app.

If you don't want anything to do with toggle, you would have to keep a counter.
XML:
<android.support.v7.widget.AppCompatImageButton
android:id="#+id/button"
android:layout_width="10dp"
android:layout_height="match_parent"
android:src="#mipmap/original"
android:background="#color/original"/>
Activity:
public class Activity extends AppCompatActivity {
int clickcounter = 0;
#Bind(R.id.button)
ImageButton Button;
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
//Butter Knife
ButterKnife.bind(this);
//Hook up the OnClick Listener
feedButton.setOnClickListener(feedButtonHandler);
}
View.OnClickListener feedButtonHandler = new View.OnClickListener() {
public void onClick(View v) {
clickcounter = clickcounter + 1;
if (clickcounter % 2 == 1) {
// setImageResource is the method for setting imagebutton's src in xml
Button.setImageResource(R.mipmap.new);
// setBackgroundResource is the method for setting imagebutton's background in xml
Button.setBackgroundResource(R.color.new);
}
if (clickcounter % 2 == 0) {
Button.setImageResource(R.mipmap.original);
Button.setBackgroundResource(R.color.original);
}
};
}
But toggle is a simpler way to do it.

ImageButton:
<ImageButton
android:id="#+id/imagebutton"
android:layout_width="250dp"
android:layout_height="100dp"
android:background="#drawable/img_btn_selector"/>
img_btn_selector:
<?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/img_selected" />
<item android:drawable="#drawable/img_un_selected" />
</selector>
Activity:
imgBtn.setOnClickListener(new OnClickListener() {
public void onClick(View button) {
if (button.isSelected()){
button.setSelected(false);
} else {
button.setSelected(true);
}
}
});

Inflated ImageView with attribute Onclick

i want that when i click on ImageView two things happen:
Background of ImageView change and a Toast must appear on the screnn , so i use Selector (imgPressed.xml) to change Background and method onImageClick in MainActivity to launch Toast.
but it shows me this error : java.lang.IllegalStateException: Could not find method onImageClick(View) in a parent or ancestor Context for android:onClick attribute defined on view class android.widget.ImageView with id 'imageView'
Note : the ImageView exist in a layout Resource File named pause.xml. I noticed that when i use ImageView directly in content_main.xml (layout of MainActivitiy.java) it works , but when i inflate pause.xml it shows me Error.
Code Java :
public class MainActivity extends AppCompatActivity {
RelativeLayout Rel_main_game;
View pauseButton;
public void onImageClick(View view) {
Toast.makeText(MainActivity.this,"Thank You", Toast.LENGTH_SHORT).show();
}
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.content_main.xml);
LayoutInflater myInflater = (LayoutInflater) getApplicationContext().getSystemService(getApplicationContext().LAYOUT_INFLATER_SERVICE);
pauseButton = myInflater.inflate(R.layout.pause, null, false);
Rel_main_game = (RelativeLayout) findViewById(R.id.relativeLayout);
Rel_main_game.addView(pauseButton);
}
}
imgpressed.xml :
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="false">
<bitmap android:src="#drawable/pauseimg"/>
</item>
<item android:state_pressed="true">
<bitmap android:src="#drawable/pauseimgclicked"/>
</item>
</selector>
pause.xml :
<ImageView
android:onClick="onImageClick"
android:layout_width="100dp"
android:layout_height="100dp"
android:id="#+id/imageView"
android:contentDescription="#string/pauseimgS"
android:focusableInTouchMode="false"
android:background="#drawable/imgpressed"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true"
/>

Your code example seems to be incomplete. But anyway you may define the onclick action programmatically instead of using the XML attribute onClick. You can do this by setting an OnClickListener on your View after inflating it, and call your onImageClick method from there:
pauseButton = myInflater.inflate(R.layout.pause, null, false);
pauseButton.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
onImageClick(v);
}
});

How to add icon image button in android studio

I want to design the layout of this type of app(as shown in the image). In this layout when we click the circle icon it moves to next page. I want to know how its done.

in drawer folder create circle_background.xml and put this code to it :
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="oval">
<solid android:color="#FE4543"></solid>
<stroke android:color="#FE4543" android:width="1dp"></stroke>
</shape>
so now in your activity add image view like this
<ImageView
android:layout_width="wrap_content"
android:gravity="center"
android:layout_height="wrap_content"
android:src="#drawable/ic_action_search"
android:padding="15dp"
android:id="#+id/btn_search"
android:background="#drawable/circle_background"
/>
and if you want to add click action on this you have to use intent something like this , my view id is btn_search so at the first i have to find it like this and then set onclick listener for it like below
ImageView btnSearch= (ImageView) findViewById(R.id.btn_search);
btnSearch.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
Intent intent= new Intent(getApplicationContext(),ExampleActivity.class)
}
});

The top one I think it can implement by ImageButton simplely.
Another one need a Layout with a circle background, and contain ImageView and TextView.
Hope it will be help for you.

public class TourActivity extends AppCompatActivity {
private ImageView tour;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_tour);
tour = (ImageView) findViewById(R.id.tour);
tour.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
Intent intent= new Intent(getApplicationContext(),FirstActivity.class);
launchThird();
}
});
}
private void launchThird() {
Intent intent = new Intent(this, FirstActivity.class);
startActivity(intent);
}
}

how to change the image on click of imagebutton?

I am make a image button .I need to change the image when I click on image button .Actually it change the background image but only for few seconds .why ?
here is my code
<ImageButton android:id="#+id/favorite"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:src="#drawable/start"
android:background="#00ffffff"
/>
<?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/on" /> <!-- pressed -->
<item android:drawable="#drawable/off" /> <!-- default -->
</selector>
I need to show on image when I click on image button ..? can I write on java side ? can I write on click listener of image button ?

That's why you are using a selector for your button background and the image changes depending on the state of the button. If it is pressed the image will be "on" and in its normal state (no pressed and no focused) the image will be "off".
EDIT:
public class MainActivity extends AppCompatActivity {
ImageButton btn;
boolean isPressed;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
btn = (ImageButton) findViewById(R.id.btn);
btn.setBackgroundResource(R.drawable.normal);
btn.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
if(isPressed){
v.setBackgroundResource(R.drawable.normal);
}else{
v.setBackgroundResource(R.drawable.pressed);
}
isPressed = !isPressed; // reverse
}
});
}
<ImageButton
android:id="#+id/btn"
android:text="#string/hello_world" android:layout_width="wrap_content"
android:layout_height="wrap_content"/>

Actually it change the background image but only for few seconds .why ?
I think it's obvious,those items in drawable are for states that ImageButton is pressed by user or in normal mode.
can I write on java side ? can I write on click listener of image button ?
Yes, and yes again :D if you want to change it when user presses it, just do it like this :
XML layout:
<ImageButton android:id="#+id/favorite"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:src="#drawable/off"
android:background="#00ffffff"
/>
Java side (eg. in you onCreate method)
ImageButton favorite;
boolean isFav = false;
public void onCreate(Bundle savedInstanceState){
///...
favorite = findViewById(R.id.favorite);
favorite.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
isFav = !isFav;
if (isFav){
favorite.setImageResource(R.drawable.on);
}
else{
favorite.setImageResource(R.drawable.off);
}
}
});
///...
}

change the source of the image by providing an absolute path or an internet url dynamically in the onClickListener of the image.
image.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
//Here before changing the image you can check if the appropriate //image is set to the view.
image.setImageResource(R.drawable.on);
}
});
and also can be like this
btn.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
if(isPressed){
v.setBackgroundResource(R.drawable.normal);
}else{
v.setBackgroundResource(R.drawable.pressed);
}
isPressed = !isPressed; // reverse
}
});

How to make imagebutton and textview to be clicked together in android?

I have ImageButton and TextView inside RelativeLayout.
I want to change their colors to blue when they are pressed and make them white again when released. also I need to do it to both of them no matter which of them I click.
and I want to activate the same action to both of them, for example a Toast that will be shown on the screen.
I tried to do it using selectors and duplicateParentState and many other options.
Can someone give me a simple example of how to do it?
UPDATE:
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/trash_pressed" android:state_pressed="true"/>
<item android:drawable="#drawable/trash_pressed" android:state_focused="true"/>
<item android:drawable="#drawable/trash"/>
</selector>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true" android:color="#33B5E5" />
<item android:state_focused="true" android:color="#33B5E5" />
<item android:color="#ffffff" />
</selector>
and this is the layout
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:scaleType="fitCenter"
android:gravity="center"
android:layout_gravity="center">
<ImageButton
android:id="#+id/button_ResetData"
android:layout_width="wrap_content"
android:layout_height="25dp"
android:layout_centerHorizontal="true"
android:layout_gravity="center"
android:layout_weight="1"
android:adjustViewBounds="true"
android:background="#android:color/transparent"
android:clickable="true"
android:duplicateParentState="true"
android:scaleType="fitCenter"
android:src="#drawable/reset_button_selector"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_below="#id/button_ResetData"
android:scaleType="fitCenter"
android:clickable="true"
android:text="#string/Button_ResetData"
android:textSize="10dp"
android:duplicateParentState="true"
android:textColor="#drawable/main_buttons_text_color_selector"/>
</RelativeLayout>
when I click the layout the selectors of the text and button is activated but not the click event. when I click the button the selectors don't work but the click event works

You can set selectors to RelativeLayout directly and implement onClickListener for the same. And make sure you include android:clickable="true" inside your RelativeLayout.

Very Simple
In your activity where u call the on click function... define them separately but use them like this
public class yourclass extends Activity implements OnClickListener
{
ImageButton IMGBTN1;
TextView tv1;
#Override
protected void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_previousentry);
IMGBTN1 = (ImageButton) findViewById(R.id.imageButton1);
tv1= (TextView) findViewById(R.id.textview1);
IMGBTN1.setOnClickListener(this);
tv1.setOnClickListener(this);
}
public void onClick(View v)
{
if (v == IMGBTN1 )
{
IMGBTN1.setBackgroundColor(Color.BLUE);
tv1.setTextColor(Color.parseColor("#bdbdbd"));
Toast.makeText(getBaseContext(),"img 1 pressed", Toast.LENGTH_LONG).show();
delay();
}
if (v == tv1)
{
IMGBTN1.setBackgroundColor(Color.BLUE);
tv1.setTextColor(Color.parseColor("#bdbdbd"));
Toast.makeText(getBaseContext(),"textview 1 pressed", Toast.LENGTH_LONG).show();
delay();
}
public void delay()
{
final Handler handler = new Handler();
handler.postDelayed(new Runnable() {
#Override
public void run()
{
IMGBTN1.setBackgroundColor(Color.RED);
tv1.setTextColor(Color.parseColor("#ffffff"));
}
}, 500);
}
}

Use yourView.performClick() to programatically click a button.

You can try this,
Add selectors to both Textview and image drawable. Add that image drawable to textview using attributes like drawableLeft, drawableTop etc in xml.
Let me know if it works.

FOUND A SOLUTION:
final ImageButton resetButton = (ImageButton) findViewById(R.id.button_ResetData);
final TextView resetButton_Title = (TextView) findViewById(R.id.textview_button_ResetData_title);
View.OnTouchListener onTouchListener_ResetButton = new View.OnTouchListener() {
#Override
public boolean onTouch(View view, MotionEvent motionEvent) {
switch (motionEvent.getAction()){
case MotionEvent.ACTION_DOWN:
resetButton.setImageResource(R.drawable.trash_pressed);
resetButton_Title.setTextColor(getResources().getColor(R.color.Blue_Light));
break;
case MotionEvent.ACTION_UP:
resetButton.setImageResource(R.drawable.trash);
resetButton_Title.setTextColor(Color.WHITE);
AlertDialog.Builder builder = new Builder(MainActivity.this);
builder.setMessage("Are you sure you want to clear the list (except \"In progress\")?")
.setPositiveButton("Yes", resetListDialogClickListener)
.setNegativeButton("No", resetListDialogClickListener);
AlertDialog dialog = builder.show();
TextView messageView = (TextView) dialog.findViewById(android.R.id.message);
messageView.setGravity(Gravity.CENTER);
}
return false;
}
};
resetButton.setOnTouchListener(onTouchListener_ResetButton);
resetButton_Title.setOnTouchListener(onTouchListener_ResetButton);