How to create image button in android? - java

So I'm new to android development...How can I create an image that acts like button, so when I press that image, image starts a specific activity.
So I want this to show as image:
<Button
android:id="#+id/button1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginTop="33dp"
android:text="Button" />

Create ImageButton as:
In main.xml:
<ImageButton android:id="#+id/ib"
android:src="#drawable/bookmark" <-- SET BUTTON IMAGE HERE -->
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
In Code part:
ImageButton ib=(ImageButton)findViewById(R.id.ib);
ib.setOnClickListener(ibLis);
}
private OnClickListener ibLis=new OnClickListener(){
#Override
public void onClick(View v) {
// TODO Auto-generated method stub
//START YOUR ACTIVITY HERE AS
Intent intent = new Intent(YOUR_CURRENT_ACTIVITY.this,NextActivity.class);
startActivity(intent, 0);
}
};
EDIT:
and second option if you want to create an image like button using Button View then Create an Custom button as:
First put your all images like for pressed,focused and default in res/drawable folder and then add an newbtn.xml in drawable/newbtn.xml as:
<?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/button_pressed" /> <!-- pressed -->
<item android:state_focused="true"
android:drawable="#drawable/button_focused" /> <!-- focused -->
<item android:drawable="#drawable/button_normal" /> <!-- default -->
</selector>
Finally in button XML set android:background as :
<Button
android:id ="#+id/btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hello"
android:textColor="#ffffffff"
android:background="#drawable/newbtn" <-- get button background to selector -->
/>
See this tutorial for Creating Custom Button with images
Creating custom, fancy buttons in Android

With the ImageView element, attaching a click listener to it.
The XML:
<ImageView
android:id="#+id/myImageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/myPic"
/>
The code:
ImageView imageView = (ImageView) findViewById(R.id.myImageView);
imageView.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
Intent intent = new Intent(ThisActivity.this, MyOtherActivity.class);
startActivity(intent);
}
});
You also could use a ImageButton (in the same way). It makes almost no difference. You can see more details here. Difference between a clickable ImageView and ImageButton

It's an overcomplication to use "setOnClickListener()". Instead, use the 'onClick' property in XML:
<ImageButton
android:id="#+id/button19"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#android:color/transparent"
android:onClick="yourCallback"
android:src="#drawable/your_image"
/>
public void yourCallback(View view)
{
...
}

Related

Android custom dialog button styles not applied

I wish to create a simple dialog for the user with 2 buttons as follows:
Dialog Layout (dialog_layout.xml):
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="8dp"
android:orientation="vertical">
<Button
android:id="#+id/btn_select_choice_1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="First Choice"
android:theme="#style/secondary_button_normal" />
<Button
android:id="#+id/btn_select_choice_2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Second Choice"
android:theme="#style/secondary_button_normal" />
</LinearLayout>
secondary_button_normal:
<style name="secondary_button_normal" parent="Widget.AppCompat.Button">
<item name="colorButtonNormal">#color/button_secondary_normal_background</item>
<item name="android:textColor">#color/button_secondary_normal_text</item>
<item name="android:textSize">#dimen/button_textSize</item>
<item name="android:padding">#dimen/button_padding</item>
</style>
Activity's onCreate:
final Dialog selection = new Dialog(this);
selection.setContentView(R.layout.dialog_layout);
Button selectFirstChoice = (Button)selection.findViewById(R.id.btn_select_choice_1);
Button selectSecondChoice = (Button)selection.findViewById(R.id.btn_select_choice_2);
selectFirstChoice.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
//do something
selection.dismiss();
}
});
selectSecondChoice.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
//do something
selection.dismiss();
}
});
selection.setTitle("Some Title");
selection.setCancelable(false);
selection.show();
The preview is alright:
Preview
It works well on Nougat, but when I run it on Lollipop (5.0 and 5.1.1), the buttons are without styling, although the same button styling worked on activity buttons on Lollipop:
App
I wonder what could be going wrong, I also tried moving the Dialog into a DialogFragment but I faced the same behavior.
Found the following solution:
In my Styles.xml, I added:
<style name="dialog_button" parent="Theme.AppCompat.Light.Dialog">
<item name="colorButtonNormal">#color/button_secondary_normal_background</item>
<item name="android:textColor">#color/button_secondary_normal_text</item>
<item name="android:textSize">#dimen/button_textSize</item>
<item name="android:padding">#dimen/button_padding</item>
</style>
And in my custom dialog layout, I used that style as a theme for my buttons:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_margin="8dp"
android:layout_height="match_parent">
<Button
android:id="#+id/btn_select_student"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/student"
android:theme="#style/dialog_button" />
<Button
android:id="#+id/btn_select_tutor"
android:layout_width="match_parent"
android:text="#string/tutor"
android:layout_height="wrap_content"
android:theme="#style/dialog_button" />
</LinearLayout>

Button in dialog not behaving as a button when clicked

After create and testing my custom dialog I've noticed that my button does not show any visual sign of change (such as the ripple effect or highlighting) when clicked. Does anyone know what I'm doing wrong and how to resolve this issue?
XML
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:paddingBottom="#dimen/activity_vertical_margin">
<Button
android:id="#+id/world"
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:layout_marginBottom="10dp"
android:padding="10dp"
android:background="#color/green"
android:textColor="#color/white"
android:text="#string/world"
android:textAllCaps="false"
style="#android:style/TextAppearance.Medium"/>
</LinearLayout>
Java
#Override
public boolean onOptionsItemSelected(MenuItem item) {
int id = item.getItemId();
if (id == R.id.action_other_lines) {
final Dialog dialog = new Dialog(this);
dialog.setContentView(R.layout.dialog_hello_world);
dialog.setTitle("Dialog");
Button world = (Button) dialog.findViewById(R.id.world);
world.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
dialog.dismiss();
}
});
dialog.show();
}
return super.onOptionsItemSelected(item);
}
You override the default onClick effect by putting a background color.
android:background="#color/green"
You can do it by creating a custom background xml file on drawable, like this.
custom_background.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="#color/Pressed_Color" />
<item android:state_activated="false" android:drawable="#color/green"/>
</selector>
then you call it on the button styling as like this:
android:background="#drawable/custom_background"
when you change your default appearance, you should handle different state if you want like this
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/button_sel" android:state_selected="true" />
<item android:drawable="#drawable/button_sel" android:state_pressed="true" />
<item android:drawable="#drawable/button_unsel" />
</selector>
save this as xml drawable and add as android:background

Make a selected state for textview (highlighted)

So currently, I am trying to create a selected state for three textviews
Currently, for each of the textviews ( H M S) the text is red:
However, when tap the H M or S I want it to turn another color--white.
So I tried to follow this:
Android - Textview change color on changing of state
and I did this (selected_text.xml):
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_selected="true"
android:color="#ffd10011"/> <!-- selected -->
<item android:color="#color/red_highlight"/> <!-- default -->
</selector>
and applied that:
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/Hours"
android:textSize="30sp"
android:textColor="#color/selected_text"
android:id="#+id/hourtext"
android:layout_marginLeft="45dp"
android:layout_alignTop="#+id/minutetext"
android:layout_alignLeft="#+id/seekArc"
android:layout_alignStart="#+id/seekArc" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/Minutes"
android:textSize="30dp"
android:textColor="#color/selected_text"
android:id="#+id/minutetext"
android:layout_below="#+id/seekArc"
android:layout_centerHorizontal="true"
android:layout_marginTop="28dp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/Second"
android:textSize="30dp"
android:textColor="#color/selected_text"
android:id="#+id/secondtext"
android:layout_alignTop="#+id/minutetext"
android:layout_alignRight="#+id/seekArc"
android:layout_alignEnd="#+id/seekArc"
android:layout_marginRight="43dp" />
However, the textviews do not change color after I click on them.
How do I fix this?
Also,
I was wondering if it is better to implement this in java code since I need to perform a different function after each textview is clicked/highlighted. If so, how can that be implemented?
You can do this programatically like this:
findViewById(R.id.txt).setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
TextView textView = (TextView) v;
if (textView.isSelected()) {
textView.setTextColor(Color.RED);
v.setSelected(false);
} else {
textView.setTextColor(Color.BLUE);
v.setSelected(true);
}
}
});
And here's my layout:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<TextView
android:id="#+id/txt"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="some text"
android:textSize="20sp"
android:textColor="#FF0000"/>
</LinearLayout>
EDIT:
For your specific case would be like:
View previousView;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
View.OnClickListener clickListener = new View.OnClickListener() {
#Override
public void onClick(View v) {
TextView previousText = (TextView) previousView;
TextView curText = (TextView) v;
// If the clicked view is selected, deselect it
if (curText.isSelected()) {
curText.setSelected(false);
curText.setTextColor(Color.RED);
} else { // If this isn't selected, deselect the previous one (if any)
if (previousText != null && previousText.isSelected()) {
previousText.setSelected(false);
previousText.setTextColor(Color.RED);
}
curText.setSelected(true);
curText.setTextColor(Color.BLUE);
previousView = v;
}
}
};
findViewById(R.id.txt).setOnClickListener(clickListener);
findViewById(R.id.txt2).setOnClickListener(clickListener);
findViewById(R.id.txt3).setOnClickListener(clickListener);
}

Button topmost in android

I have layer, it is transparent. I can click on button only, I want to click through layer.
Here's my Manifest:
<activity android:name=".Test" android:theme="#style/Theme.Transparent"/>
Here's Transparent theme style:
<style name="Theme.Transparent" parent="android:Theme">
<item name="android:windowIsTranslucent">true</item>
<item name="android:windowBackground">#android:color/transparent</item>
<item name="android:windowContentOverlay">#null</item>
<item name="android:windowNoTitle">true</item>
<item name="android:windowIsFloating">true</item>
<item name="android:backgroundDimEnabled">false</item>
</style>
Here's my Activity code:
import android.app.*;
import android.os.*;
import android.view.*;
import android.widget.*;
public class Test extends Activity {
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.test);
// v I can touch through app, but cant click on button
getWindow().addFlags(WindowManager.LayoutParams.FLAG_NOT_TOUCHABLE);
// ^ I can touch through app, but cant click on button
Button xclose = (Button) findViewById(R.id.buttonx);
xclose.setOnClickListener(new View.OnClickListener() {
public void onClick(View arg0) {
finish();
}
});
}
}
Here's my test.xml layout:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" >
<Button android:id="#+id/buttonx" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentRight="true" android:layout_alignParentTop="true" android:text="X" />
</RelativeLayout>
Try this code and set click listener on the linear layout
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent" android:layout_height="match_parent" >
<LinearLayout android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/ll">
<Button android:id="#+id/buttonx" android:layout_width="wrap_content"
android:layout_height="wrap_content" android:layout_alignParentRight="true"
android:layout_alignParentTop="true" android:text="X" />
</LinearLayout>
</RelativeLayout>
You already do the following here to set the click listener for the X button.
Button xclose = (Button) findViewById(R.id.buttonx);
xclose.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View arg0) {
// TODO Auto-generated method stub
finish();
}
});
Now all you need to do is the same thing but for the Layout which you have created that is transparent. So that when you click the layout in the area that your play button is, it listens to the click, rather than the button, as the button is out of reach.

App does not register custom button clicks

I am having a problem with one of my applications. I have written a basic application menu which has custom buttons linking to other activity's. My problem is that it seems my application is not registering my button clicks when I am testing it. I do not receive any errors or crashes upon clicks, the application just acts as if the click never happened. Could anyone provide me with any help with this problem, I have provided some code bellow.
Main Menu code:
public void initialize(){
Film = (Button) findViewById(R.id.bFilm);
}
#Override
public void onClick(View view) {
try{
switch(view.getId()){
case R.id.bFilm:
Intent film = new Intent(this, Film.class);
startActivity(film);
break;
Layout Code:
<Button
android:id="#+id/bFilm"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginLeft="20dp"
android:layout_marginTop="110dp"
android:background="#drawable/film"
android:textSize="20sp" />
Custom 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/actor_1"></item>
<item android:state_focused="true" android:drawable="#drawable/actor_1"></item>
<item android:drawable="#drawable/actor_1"></item>
</selector>
Within your initialize(), add after findViewById the following:
Film.setOnClickListener(onClick);
Try this
public void initialize(){
Film = (Button) findViewById(R.id.bFilm);
Film.setOnClickListener(this);
}
add
android:onclick="onClick"
in
<Button
android:id="#+id/bFilm"
android:onclick="onClick"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginLeft="20dp"
android:layout_marginTop="110dp"
android:background="#drawable/film"
android:textSize="20sp" />
it will work
EDIT
However
onClick attribute is not defined for API 3 and less. (Android <= 1.5)
It works since API 4 (Android 1.6)
If you want compatibility you can use:
findViewById(R.id.myButton).setOnClickListener(new View.OnClickListener() {
public void onClick(View v) {
// Do stuff
}
});

Categories