How to prevent buttons from getting bigger when pressed - android

I am practicing changing button colors when another button is pressed but every time I press the button to change the color the buttons enlarge as well. Is there something I need to define in the XML to keep the button size constant when pressed? I also was wondering if relative vs linear layout would make a difference in this?
CODE:
private Button back;
private Button front;
private Button b1;
private Button b2;
Button[] buttons = new Button[4];
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
front = (Button) findViewById(R.id.front);
back = (Button) findViewById(R.id.back);
b1 = (Button) findViewById(R.id.b1);
b2 = (Button) findViewById(R.id.b2);
buttons[0] = front;
buttons[1] = back;
buttons[2] = b1;
buttons[3] = b2;
front.setOnTouchListener(new View.OnTouchListener() {
#Override
public boolean onTouch(View view, MotionEvent event) {
for(int i = 0; i < buttons.length; i++) {
if (buttons[i] == buttons[2]) {
buttons[i].setBackgroundColor(Color.GREEN);
}
else
buttons[i].setBackgroundColor(Color.GRAY);
}
return false;
}
});
}
}
XML:
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center">
<Button
android:id="#+id/front"
android:layout_width="75dp"
android:layout_height="75dp"
android:text="Front"/>
<Button
android:id="#+id/back"
android:layout_toRightOf="#+id/front"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Back"/>
<Button
android:id="#+id/b1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="b1"
android:layout_alignLeft="#+id/front"
android:layout_below="#+id/front" />
<Button
android:id="#+id/b2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="b2"
android:layout_below="#+id/b1"
android:layout_alignLeft="#+id/b1"/>

Default button background drawable has some kind of margins. These Buttons margins have a transparent color when you change the color of the button then the transparent color is changed into a new color you assigned then the button size will be enlarged. Use this to change color of button.

You might try to set a backgroundTint instead of a backgroundColor. A backgroundColor gives a background color to the view, not the button. A backgroundTint however, gives the button itself a color.
When you set it you have to user the BackgroundTintList, but you can just give a color by using ColorStateList.valueOf(Color.MY_COLOR).
So your code should be
if (buttons[i] == buttons[2]) {
buttons[i].setBackgroundTintList(ColorStateList.valueOf(Color.GREEN));
}
else
buttons[i].setBackgroundTintList(ColorStateList.valueOf(Color.GRAY));
Hope this helps you!

Related

Moving buttons at desired locations

I have this problem: I want to put some Buttons at a certain locations, for example at the four squares of the screen (resolved) and I also want them to become red when clicking on each one, at exactly those locations (not resolved yet).
This is the main xml:
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/scrollView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true"
android:layout_weight="15"
android:orientation="vertical">
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:components="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:id="#+id/layout1">
<Button
android:id="#+id/one"
android:layout_width="40dp"
android:layout_height="40dp"
android:background="#color/colorPrimary"/>
<Button
android:id="#+id/two"
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_alignParentEnd="true"
android:background="#color/colorPrimary" />
<Button
android:id="#+id/three"
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_alignParentBottom="true"
android:background="#color/colorPrimary" />
<Button
android:id="#+id/four"
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_alignParentBottom="true"
android:layout_alignParentEnd="true"
android:background="#color/colorPrimary"/>
</RelativeLayout>
</ScrollView>
</android.support.constraint.ConstraintLayout>
And this is the main java:
RelativeLayout layout = (RelativeLayout) findViewById(R.id.layout1);
RelativeLayout.LayoutParams rel_btn = new RelativeLayout.LayoutParams(
RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT);
Button btnTag = new Button(this);
btnTag.setLayoutParams(rel_btn);
btnTag.setBackgroundColor(Color.BLUE);
btnTag.setOnClickListener(listen);
layout.addView(btnTag);
}
private View.OnClickListener listen = new View.OnClickListener() {
#Override
public void onClick(View view) {
if (pressed != null) {
Button button1 = (Button) pressed;
button1.setBackgroundColor(Color.BLUE);
}
Button button2 = (Button) view;
GradientDrawable drawable = new GradientDrawable();
drawable.setShape(GradientDrawable.RECTANGLE);
drawable.setStroke(8, Color.RED);
button2.setBackgroundDrawable(drawable);
pressed = view;
}
in onCreate set up your buttons:
RelativeLayout layout = (RelativeLayout) findViewById(R.id.layout1);
RelativeLayout.LayoutParams rel_btn = new RelativeLayout.LayoutParams(
RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT);
Button one = (Button) findViewById(R.id.one);
one.setOnClickListener(listen);
Button two = (Button) findViewById(R.id.two);
two.setOnClickListener(listen);
Button three = (Button) findViewById(R.id.three);
three.setOnClickListener(listen);
Button four = (Button) findViewById(R.id.four);
four.setOnClickListener(listen);
and finally create your listener for all 4 of the buttons:
private View.OnClickListener listen = new View.OnClickListener() {
#Override
public void onClick(View view) {
GradientDrawable drawable = new GradientDrawable();
drawable.setShape(GradientDrawable.RECTANGLE);
drawable.setStroke(8, Color.RED);
Button button = (Button) view;
button.setBackground(drawable);
}
};
If you were created Buttons in the layout then why are you adding it dynamically.
If you are using layout then inflate these buttons using "findViewById()". And when user will click perform the action to that or all buttons.
one.setBackgroundColor(Color.RED);
But if you are using dynamic button creation then store all 4 button id's which you are creating. Then perform something like this.
buttonId[index].setBackgroundColor(Color.RED);
Make your main class implement to View.OnclickListener
public class MainFragment extends Fragment implements View.OnClickListener {
private void setUpViews() {
button1.setOnClickListener(this);
button2.setOnClickListener(this);
button3.setOnClickListener(this);
button4.setOnClickListener(this);
}}
#Override
public void onClick(View view) {
if(view instance of Button){
button.setBackgroundColor(getResources().getColor(android.R.color.holo_red_dark));
}
}
}
Well, if you give those buttons IDs, then you can change the color of them when you click it.
So if you tap on buttonID, do your logic and then change the color to buttonID.
// If you're in an activity:
buttonID.setBackgroundColor(getResources().getColor(R.color.red));
Add the color red to your color xml.
this can go inside of your onCreate. the buttonOne and buttonTwo at the IDs to the buttons in your XML.
This is the most BASIC way to do it. There are more ways, you can see those answers here too.
buttonOne.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
//logic here
}
});
buttonTwo.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
//logic here
}
});
When you have a listener changing something is relatively easy. You do not need to implement different methods or check every button one by one. Since Button is a View as well, do the following pseudo-code.
// You need this if part, if you have other views that having the same listener.
// Otherwise, you do not need this if check.
if(is Clicked View is Button) {
// Now here, take the clicked view, which we know it is a button and change its colour.
}
By the way, the code above will be inside the overridden method onClick.
EDIT
To clarify, I am adding a small chunk of code.
#Override
public void onClick(View view) {
// Checking if the clicked View is a Button or not.
if(view instanceof Button) {
// view.getId() returns an integer.
Button clickedButton = (Button) findViewById(view.getId());
// Now, change the button's colour.
clickedButton.setBackground(........);
}
}
Hope it helps. Have a nice day!

Select a button android

I have many buttons with different color names on them.
yellow - red - blue
I want, when user tap on one it creates a border around it (select the button) and in the end of my activity I have another button to SAVE the color user selected.
<Button
android:text="Yellow"
android:layout_width="111dp"
android:layout_height="wrap_content"
android:id="#+id/button1" />
<Button
android:text="Red"
android:layout_width="111dp"
android:layout_height="wrap_content"
android:id="#+id/button2" />
<Button
android:text="SAVE"
android:layout_width="111dp"
android:layout_height="wrap_content"
android:id="#+id/buttonsave" />
java
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.color);
Button btnYellow;
btnYellow = (Button) findViewById(R.id.button1);
Button btnRed;
btnRed = (Button) findViewById(R.id.button2);
Intent intent = getIntent();
String url2 = intent.getStringExtra("image");
btnYellow.setOnClickListener(new View.OnClickListener() {
public void onClick(View v) {
}
});
}
how can I selected a button when user click on it and get a value (red,green, red1) when user click in save?
Place each button in a FrameLayout. This will give the button a border. Changing the background color on the FrameLayout will change the border of the button.
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<Button
android:id="#+id/btnYellow"
android:layout_width="111dp"
android:layout_height="wrap_content"
android:text="Yellow" />
</FrameLayout>
Set an onClickListener for the buttons that looks something like the following, but don't use the hard-coded colors - this is just an example. mLastClicked is a member variable defined as Button mLastClicked.
#Override
public void onClick(View view) {
if (mLastClicked !=null) {
((FrameLayout) mLastClicked.getParent()).setBackgroundColor(0xFFFFFFFF);
}
mLastClicked = (Button) view;
switch (view.getId()) {
case R.id.btnYellow:
((FrameLayout) view.getParent()).setBackgroundColor(0xFFFFFF00);
break;
case R.id.btnRed:
// Similar to yellow
break;
case R.id.btnSave:
// Do something with mLastClicked to save it
break;
}
}
You can define your button as a shape To give it a border, use the element (name the file your.xml and place it in res/drawables):
and Refer this link

How to Move cursor from one EditText to another one and back to the first edit text if a custom button is clicked?

i am basically developing a small mathematics app, in a activity their will be problems like additions subtractions etc. the user has to fill the answers in edittext from the custom buttons from 0-9, a dot, a slash button and a backspace button which i created on the same activity. now i like to add up and down button, so that when the up button is pressed the cursor has to move towards upside edit text and vice versa.
here is a sample code which i used
XML:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<EditText
android:id="#android:id/et1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Some string of text"
/>
<EditText
android:id="#android:id/et2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Some string of text"
/>
<Button
android:id="#android:id/button1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Button"
/>
</LinearLayout>
Class:
public class Example extends Activity {
TextView et1;
TextView et2;
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
et1 = (EditText) findViewById(android.R.id.et1);
et2 = (EditText) findViewById(android.R.id.et2);
Button button = (Button) findViewById(android.R.id.button1);
button.setOnClickListener(new OnClickListener() {
public void onClick(View view) {
Selection.setSelection((Editable) et2.getText(), et1.getSelectionStart());
et2.requestFocus();
}
});
}
}
You could create an array of of your EditTexts and a variable containing your current position, defaulted to 0, meaning the first text box. Then if the user presses the up button, if the variable is greater than 0, set the position -1 and then get the textbox object from the array and call focus(). Below is an example piece of code, its not accurate but should get you started
List<EditText> textfields = null;
int currentTextFieldPosition = 0;
public void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
textfields = new ArrayList<EditText>();
textfield1 = (EditText)findViewById(R.id.textfield1);
.....
textfields.add(textfield1);
......
}
protected OnClickListener mBtnUpClickListener = new OnClickListener()
{
public boolean onClick()
{
if (currentTextfieldPosition > 0)
{
currentTextfieldPosition--;
textfields.get(currentTextFieldPosition).focus()
}
}
}

How to show another button by clicking a button?

I don't want to create a new activity. Just like this gentleman's example (http://www.youtube.com/watch?v=V6AdmCIe4Ik),but I want to implement this on LinearLayout using Button instead of main.
Say on the video at 00:44 user clicks a button specified on res/layout/activity1.xml and sub button shows up at 00:47.
He implemented it using menu and creating a sub folder (menu) under res instead of using layout.
What I would like to do is that once user clicks a button declared on LinearLayout it will show another button just like 00:47 on the video.
With a very simple XML file:
<LinearLayout
android:orientation="vertical"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:animateLayoutChanges="true">
<Button
android:id="#+id/button1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="button1" />
<Button
android:id="#+id/button2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="button2"
android:visibility="gone" />
</LinearLayout>
Then in code, you set the listener for button1 as follows:
private Button button1;
private Button button2;
protected void onCreate(Bundle savedInstanceState) {
setContentView(R.layout.activity1);
button1 = findViewById(R.id.button1);
button2 = findViewById(R.id.button2);
button1.setOnClickListener(new OnClickListener() {
public void onClick(View v) {
button2.setVisibility(View.VISIBLE);
}
});
}
This code sample sets up the event listener for the first button and, when clicked, changes the visibility of the button from gone (which means it takes up no space in the layout and is invisible) to Visible, which is the normal state.

set transparent button image and background color to button

I have a transparent button image with white border and without label. I want to create a button which will have its label, its background transparent image and want to set a background color to button dynamically.
The transparent button image:
The Button should look like this after setting its button image with label and background color :
I have tried to implement this by using FrameLayout, TextView and Button. As in framelayout the first child will be textview and second will be button. Setting a transparent btn image to button and textview will have label and background color which has to set dynamically. I am almost able to do this but textview size should be little smaller than button image, this thing i have to calculate dynamically. currently textview background color sometimes goes outside the button and also round shape is not coming.
The xml:
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginBottom="15dip" >
<TextView
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:textSize="20sp"
android:textColor="#FFFFFFFF"
android:id="#+id/btn_bacground"
android:gravity="center"
android:layout_gravity="center_horizontal"
android:layout_marginTop="5dip"
android:layout_marginRight="1dip"
android:layout_marginLeft="0dip" />
<Button
android:id="#+id/button_img"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:background="#drawable/btn_transparent_img"/>
</FrameLayout>
Edit:
Setting the background color, size and label to Textview. background image to Button.
buttonClick = (Button) buttonClickFrame.findViewById(R.id.button_img);
buttonBg = (TextView) buttonClickFrame.findViewById(R.id.btn_bacground);
buttonBg.setBackgroundColor(Color.parseColor(BG_COLOR));
buttonBg.setText("Click");
buttonPhone.setBackgroundDrawable(getResources().getDrawable(R.drawable.btn_transparent_img));
setBackgroundDimentions(buttonClick, buttonBg);
buttonClick.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
onPhoneClick(v);
}
});
private void setBackgroundDimentions(Button btn, TextView bckView) {
final Button mBtn = btw;
final TextView mBckView = bckView;
ViewTreeObserver vto = mBtn.getViewTreeObserver();
vto.addOnPreDrawListener(new ViewTreeObserver.OnPreDrawListener() {
public boolean onPreDraw() {
int finalHeight = mBtn.getMeasuredHeight();
int finalWidth = mBtn.getMeasuredWidth();
mBckView.setWidth(finalWidth - 14);
mBckView.setHeight(finalHeight - 15);
return true;
}
});
}
Please suggest me how can i achieve this.
why don't you use Image Button.!
like this:
<ImageButton
android:id="#+id/imageButton1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/btn_transparent_img"
android:background="#000000"
/>
use imageButton
add your transparent image as src
change background colour according to your need
Refer this link for further help:

Categories

Resources