How does one create an ImageButton with transparent background that still clickable (still acts like a Button)?
This is the xml snippet:
<ImageButton
android:paddingRight="10dp"
android:paddingLeft="10dp"
android:paddingTop="7dp"
android:paddingBottom="7dp"
android:src="#drawable/serverschedule"
android:background="#null"
android:clickable="true"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="#string/predict"
local:MvxBind="Click PredictCmd" />
I have also tried android:background="#00000000" and android:background="#android:color/transparent"and in all cases, I do get the desired visual effect but button no longer can be clicked.
I am using MvvmCross framework to binding to the Click event of the button, hence there is no code behind.
I am testing against API Level 15, if this matters.
EDIT Added entire axml for button.
EDIT Adding MVVM framework as it may have something to do with problem.
TIA.
Thanks for all of the suggestions.
This is what finally worked for me:
android:background="?android:attr/selectableItemBackground"
Based on responses from this thread.
Please provide width and height of your button.
Also try this :
ImageButton theButton = (ImageButton )findViewById(R.id.theButton);
theButton.setVisibility(View.VISIBLE);
theButton.setBackgroundColor(Color.TRANSPARENT);
theButton.setOnClickListener(new OnClickListener()
{
#Override
public void onClick(View v)
{
// DO STUFF
}
});
Hope this helps.
Do certain Necessary changes
<ImageButton
android:paddingRight="10dp"
android:paddingLeft="10dp"
android:paddingTop="7dp"
android:paddingBottom="7dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/serverschedule"
android:background="#null"
android:id="#+id/mybutton"
</ImageButton
Into Your code:
mybutton.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View view) {
//Your Stuff here
}
});
try this...
<ImageButton
android:id="#+id/imageButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/timeText"
android:layout_centerHorizontal="true"
android:background="#android:color/transparent"
android:clickable="true"
android:contentDescription="image button"
android:src="#drawable/anchor" />
set clickable attribute to true, and handle onclick event in your activity like
findViewById(R.id.imageButton).setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
Toast.makeText(getApplicationContext(), "text", Toast.LENGTH_SHORT).show();
}
});
No change in your xml file.. even no need to add this android:clickable="true"
edit your java file as below code...
ImageButton imageButton;
#Override
public void onCreate(Bundle savedInstanceState) {
imageButton = (ImageButton) findViewById(R.id.imageButton1);
imageButton.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View arg0) {
Toast.makeText(MyAndroidAppActivity.this,
"ImageButton is clicked!", Toast.LENGTH_SHORT).show();
}
});
}
}
If this doesn't work you might have problem with your parent layout. Please post that if so....
what's the meaning of the "acts as a button" ? when you use
android:background="#null"
your ImageButton will have no background and you can use selector as the src ,you'll get the same acts as a button,also can click as usual
selector like this
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/button_bg_pressed" android:state_pressed="true"/>
<item android:drawable="#drawable/button_bg_pressed" android:state_focused="true"/>
<item android:drawable="#drawable/button_bg_normal"/>
</selector>
also see enter link description here
back.setBackgroundColor(Color.TRANSPARENT);
works for all android versions
Related
I need to create this type of UI.
But it should work similar to Radio Button that is when one button got selected other two should be deselected.
There are various approaches like using three Images for each button and also images for pressed and unpressed state.
But how to achieve this using Button Tag.
Perhaps here may be useful to library work
https://github.com/pucamafra/android-segmentedtab
You can create 3 buttons and control other buttons with OnClickListener. For example:
layout:
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<Button
android:id="#+id/btn1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<Button
android:id="#+id/btn2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<Button
android:id="#+id/btn3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</LinearLayout>
class:
btn1.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
btn1.setSelected(true);
btn2.setSelected(false);
btn3.setSelected(false);
//Do something
}
});
btn2.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
btn1.setSelected(false);
btn2.setSelected(true);
btn3.setSelected(false);
//Do something
}
});
btn3.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
btn1.setSelected(false);
btn2.setSelected(false);
btn3.setSelected(true);
//Do something
}
});
Sure, here .. keep it in selected state in OnClickListener when event x is fired. when event y is fired, keep button2 in selected state *& don't forget to remove button1 from selected state, Just try to improve this, it will work
I just made this , you are welcome to use & commit changes too!
If the button was clicked I want to turn on the wifi and also change the Image of ImageButton, but I do not know how to change it
I have also tried this from how to change the image of a button with every click? but is isn't working:
boolean isPressed=false
button.setOnClickListener(buttonListener);
OnClickListener buttonListener= new OnClickListener() {
#Override
public void onClick(View v) {
if(isPressed){
button.setBackgroundResource(R.drawable.icon1);
}else{
button.setBackgroundResource(R.drawable.icon2);
}
isPressed=!isPressed;
}};
when I write the code above, android studio shows this:
Cannot resolve symbol setOnClickListener
I have also created a button_wifi_selector xml, which it looks like this:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<item android:drawable="#drawable/wifi_on"
android:state_pressed="true" />
<item android:drawable="#drawable/ic_launcher"
android:state_focused="true" />
<item android:drawable="#drawable/wifi" />
</selector>
and in my activity i have this
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/imageButton_wifi"
android:layout_below="#+id/toggleButton_wifi"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:onClick="turnOffWifiDemo"
android:src="#drawable/button_wifi_selector" />
but it isn't doing, what I want
Can somebody pls help me?
Thanks
EDIT: it works with the first code. I just had to remove the onClick from ImageButton in the xml
BUT: he is changing the picture the second time, when I start the app. After that he changes it every time
this code work for me; test it
final ImageButton btnTest =(ImageButton) findViewById(R.id.btnexctract);
btnTest.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
btnTest.setSelected(!btnextra.isPressed());
if (btnTest.isPressed()) {
btnextra.setImageResource(R.drawable.yourImage);
}
else {
btnTest.setImageResource(R.drawable.yourImage2);
}
}
});
This is how you have to do it
Selector 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/info_icon_solid_with_shadow" />
<item
android:drawable="#drawable/info_icon_outline_with_shadow" />
</selector>
And then in java:
//assign the image in code (or you can do this in your layout xml)
imageButton.setImageDrawable(getBaseContext().getResources().getDrawable(R.drawable....));
//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 have modified it,for on/off it may help you
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<ImageButton
android:id="#+id/imageButton_wifi2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:onClick="clickEvent"
android:visibility="invisible"
android:src="#drawable/on" />
<ImageButton
android:id="#+id/imageButton_wifi1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:onClick="clickEvent"
android:src="#drawable/off" />
</FrameLayout>
like you need to create method with view parameter
{
c=false;
im1=(ImageButton)findViewById(R.id.imageButton_wifi1);
im2=(ImageButton)findViewById(R.id.imageButton_wifi2);
}
public void clickEvent(View v)
{
//Code to implement
if(c) {
im2.setVisibility(View.VISIBLE);
im1.setVisibility(View.INVISIBLE);
c=false;
}
else {
im1.setVisibility(View.VISIBLE);
im2.setVisibility(View.INVISIBLE);
c=true;
}
You can use togglebutton like this
<ToggleButton
android:id="#+id/toggleButton1"
android:layout_width="74dp"
android:layout_height="26dp"
android:background="#drawable/toggle"
android:checked="false"
android:paddingRight="10dp"
android:text="ON"
android:textColor="#ffffff"
android:textSize="13sp"
android:textStyle="bold" />
And in java file
final ToggleButton toggleButton=(ToggleButton)findViewById(R.id.toggleButton1);
toggleButton.setOnCheckedChangeListener(new OnCheckedChangeListener() {
#Override
public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
// TODO Auto-generated method stub
if(isChecked){
//
toggleButton.setBackgroundResource(R.drawable.icon1);
}else{
//
toggleButton.setBackgroundResource(R.drawable.icon2);
}
}
});
You can define a boolean flag and just change visibility of items.
Description: changeBack is a button. This code is for change images
Your onClick does not know which id is clicked?
private boolean bgcolor = false;
public void onClick(View view) {
switch(view.getId())
{
case R.id.changeBack:
bgcolor = !bgcolor;
if (bgcolor) {
imv.setVisibility(View.VISIBLE);
imv2.setVisibility(View.INVISIBLE);
}
else {
imv2.setVisibility(View.VISIBLE);
imv.setVisibility(View.INVISIBLE);
}
break;
}
}
I wanted to invoke method when the button is clicked. I have found this solution
Button buttonOne = (Button) findViewById(R.id.button1);
buttonOne.setOnClickListener(new Button.OnClickListener() {
public void onClick(View v) {
//Do stuff here
}
});
but this solution is horrible.
Is it possible to add method invocation in XML when the:
<Button
android:id="#+id/actionButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/actionButtonUnclicked"
/>
is clicked? In similar manner that it can be done in Windows Phone's and WPF's XAML? Something like android:onClick=clickMethod().
You can add method in xml using android:onClick="clickMethod"
In xml:
<Button
android:id="#+id/actionButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/actionButtonUnclicked"
android:onClick="clickMethod"
/>
and in activity/ fragment add
your method should receive View v
public void clickMethod(View v){
// do smth
}
PS: If you want to use same method for multiple buttons
public void clickMethod(View v){
// check for id
if(v.getId() == R.id.button1){
//operation for button 1 click
} else if(v.getId() == R.id.button2){ //operation for button 1 click
}
}
Here:
<?xml version="1.0" encoding="utf-8"?>
<!-- layout elements -->
<Button android:id="#+id/actionButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Click me!"
android:onClick="myButtonClick" />
<!-- even more layout elements -->
and in your class:
public void myButtonClick(View v) {
// does something very interesting
}
I allow the App's User to change the ImageButton's pictures from the drawable folders?
It's possible?
I want associate this action after onLongClickListener,
I put in the Drawable folder about 3 or 4 pictures(png) and the User can choose one for its ImageButton.
Yes, you can. On onLongClickListener click, you can pop up the option and then put a switch statement and put the following for each of the cases:
aButton.setImageResource(R.drawable.image2);
Here is the more detailed answer:
Put the following at the bottom of the layout (just before the last closing layout tag)
<FrameLayout
android:id="#+id/imagebuttonselectorlayout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="gone"
android:background="#android:color/black" >
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical" >
<ImageButton
android:id="#+id/imgButton1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/image1" />
<ImageButton
android:id="#+id/imgButton2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/image2" />
</LinearLayout>
</FrameLayout>
Then, in the java class file, add the following lines:
FrameLayout mFrameLayout;
ImageButton mImageButton1;
ImageButton mImageButton2;
mFrameLayout = (FrameLayout)findViewById(R.id.imagebuttonselectorlayout);
mImageButton1 = (ImageButton)findViewById(R.id.imgButton1);
mImageButton2 = (ImageButton)findViewById(R.id.imgButton2);
For the onLongClick of the main image button
mImageButton1.setOnLongClickListener(new OnLongClickListener() {
#Override
public boolean onLongClick(View v) {
mFrameLayout.setVisibility(View.VISIBLE);
return true;
}
});
Add the following lines in the same file to complete the functionality:
mImageButton1.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
mainImageButton.setImageResource(R.drawable.image1);
mFrameLayout.setVisibility(View.GONE);
}
});
mImageButton2.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
mainImageButton.setImageResource(R.drawable.image2);
mFrameLayout.setVisibility(View.GONE);
}
});
I try to get the effect click background color for linear layout. I've set clickable to linear layout. and from the code also I've put the click listener the setBackgroundResource.
Here it is the xml:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<LinearLayout
android:id="#+id/llinsertmem"
android:clickable="true"
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="50px">
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:textSize="20sp"
android:text="PUSH it"
/>
</LinearLayout>
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/hello"
/>
</LinearLayout>
and the java code:
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
LinearLayout linearInsertMem = (LinearLayout)findViewById(R.id.llinsertmem);
linearInsertMem.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
v.setBackgroundResource(android.R.drawable.list_selector_background);
Toast.makeText(testdoank.this, "succeded", Toast.LENGTH_SHORT)
.show();
}
});
}
When first time click the clickable linearlayout, the toast text is displayed but the background color click effect doesn't. The flash background click color is only work from the second click.
any idea what the problem is?
Is not necessary do anything in JAVA code.
You can only add this as attribute:
android:background="#android:drawable/list_selector_background"
And it works for me (on Android 2.2 device)
After try and error, somehow it's work.
just put the setBackgroundResource also on the onCreate.
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
LinearLayout linearInsertMem = (LinearLayout)findViewById(R.id.llinsertmem);
linearInsertMem.setBackgroundResource(android.R.drawable.list_selector_background);
linearInsertMem.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
v.setBackgroundResource(android.R.drawable.list_selector_background);
Toast.makeText(testdoank.this, "succeded", Toast.LENGTH_SHORT)
.show();
}
});
}
Don't know the logic explanation. if you have a thought, please.
In the onClick method you are using v as the View which is passed, but that view may not be the LinearLayout which you want to change the background.
Thus you need to create a class level variable or a final varibale and pass the handle for the LineraLayout to the onClick method.
Remove/cut from onCreate:
linearInsertMem.setBackgroundResource(android.R.drawable.list_selector_background);
and paste it into onClick or change v. into linearInsertMem.
I think that Exlipse will then demand that linearInsertMem must be final like:
final LinearLayout linearInsertMem = (LinearLayout)findViewById(R.id.llinsertmem);
Or you can define this object above onCreate like this:
LinearLayout linearInsertMem;
then in onCreate you state:
linearInsertMem = (LinearLayout)findViewById(R.id.llinsertmem);
then onClick method will know exactly which view you want to change if you use linearInsertMem.setBackgroundResource...