I'm building a contacts app which displays big contact photos. I need to add a label with the contacts name of each contact on top of the button (near the bottom) however I don't know how to get two views on top of each other. I cannot simply use settext since I need to add a semi-transparent background to the label.
EDIT:
I managed to get it on top but I cannot figure out how to get it on the bottom of the button.
RelativeLayout icon = new RelativeLayout(context);
// Create button
Button button = new Button(context);
button.setLayoutParams(new LayoutParams(LayoutParams.MATCH_PARENT,LayoutParams.MATCH_PARENT));
layout.addView(button);
// Create label
TextView label = new TextView(context);
label.setText(name);
label.setBackgroundColor(Color.argb(120, 0, 0, 0));
label.setLayoutParams(new LayoutParams(LayoutParams.MATCH_PARENT,LayoutParams.WRAP_CONTENT));
icon.addView(button);
icon.addView(label);
However the text appears on the top of the image and I want it to be on the bottom like this:
With xml this would be something like: android:layout_alignBottom="#+id/myButton" but I'm doing this programatically and I haven't found a way to do it. How can I place my label near the button?
Try this
<?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:orientation="vertical" >
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center" >
<Button
android:id="#+id/button1"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:gravity="right"
android:text="John"
android:background="#drawable/button_action_active" />
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:text="test textView" />
</FrameLayout>
</LinearLayout>
Dynamically you can do by
TextView lable = new TextView(this);
lable.setLayoutParams(new LayoutParams(android.widget.LinearLayout.LayoutParams.WRAP_CONTENT, android.widget.LinearLayout.LayoutParams.WRAP_CONTENT));
lable.setTextSize(25);
lable.setGravity(Gravity.CENTER);
lable.setText("John");
Button button = new Button(this);
button.setBackgroundResource(R.drawable.button_action_active);
button.setLayoutParams(new LayoutParams(android.widget.LinearLayout.LayoutParams.MATCH_PARENT, android.widget.LinearLayout.LayoutParams.WRAP_CONTENT));
FrameLayout fl = new FrameLayout(this);
fl.setLayoutParams(new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT));
fl.addView(button);
fl.addView(lable);
setContentView(fl);
To do this you can use a frame layout. The documentation for frame layout can be found here - http://developer.android.com/reference/android/widget/FrameLayout.html
However, frame layout is depreciated (if I remember correctly). So instead I would recommend using a relative layout. In your relative layout you can set the position of the button and then give the textview the attributes android:layout_alignLeft=#id/somethingand android:layout_alignRight="#id/Something"
Related
Ok, so here's the thing. I'm trying to make an app that resembles a piano for android, also I've never really had much experience with Java or programming for Android so all of this is pretty new to me. I've managed to do this in XML but I want to make it programmaticaly so I can easily add more white and black keys also dependant of screen size. In XML it looks like this
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<Button
android:id="#+id/white1"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="#fff" />
<Button
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="#fff"
android:id="#+id/white2"
android:layout_toRightOf="#+id/white1"/>
<Button
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="#fff"
android:id="#+id/white3"
android:layout_toRightOf="#+id/white2"/>
<Button
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="#fff"
android:id="#+id/white4"
android:layout_toRightOf="#+id/white3"/>
<Button
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="#fff"
android:id="#+id/white5"
android:layout_toRightOf="#+id/white4"/>
<Button
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="#fff"
android:id="#+id/white6"
android:layout_toRightOf="#+id/white5"/>
<Button
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="#fff"
android:id="#+id/white7"
android:layout_toRightOf="#+id/white6"/>
<Button
android:layout_width="wrap_content"
android:layout_height="100dp"
android:layout_marginStart="-10dp"
android:layout_marginEnd="-6dp"
android:background="#000"
android:id="#+id/black1"
android:layout_toRightOf="#+id/white1"/>
<Button
android:layout_width="wrap_content"
android:layout_height="100dp"
android:layout_marginLeft="-6dp"
android:layout_marginRight="-10dp"
android:background="#000"
android:id="#+id/black2"
android:layout_toRightOf="#+id/white2"/>
<Button
android:layout_width="wrap_content"
android:layout_height="100dp"
android:layout_marginLeft="-10dp"
android:layout_marginRight="-6dp"
android:background="#000"
android:id="#+id/black3"
android:layout_toRightOf="#+id/white4"/>
<Button
android:layout_width="wrap_content"
android:layout_height="100dp"
android:layout_marginLeft="-8dp"
android:layout_marginRight="-8dp"
android:background="#000"
android:id="#+id/black4"
android:layout_toRightOf="#+id/white5"/>
<Button
android:layout_width="wrap_content"
android:layout_height="100dp"
android:layout_marginLeft="-6dp"
android:layout_marginRight="-10dp"
android:background="#000"
android:id="#+id/black5"
android:layout_toRightOf="#+id/white6"/>
And now I wanted to recreate it programmaticaly, at first I've tried linear approach but first of all I was unable to make more than 7 keys, and I didn't really knew how to make black keys on top of that. So now I've went with RelativeLayout and all is fine as long as I create two buttons, then it works fine, one is next to another. But when I try to create more than two buttons they kinda make a stack.
I was trying to make some sort of array of buttons so I could easily make a loop to create destined number of buttons. Also I wanted to change the width of buttons, so if I create 8 buttons the would have the width of screen_width/8 but I'm not quite sure if it makes any sense since it's actually not doing anything when uncommented.
I would be grateful for any tips :)
public class MainActivity extends AppCompatActivity {
final int[] whitelist = {R.id.whitebt1,R.id.whitebt2,R.id.whitebt3,R.id.whitebt4,R.id.whitebt5,
R.id.whitebt6,R.id.whitebt7,R.id.whitebt8};
Button[] whiteKeys = new Button[whitelist.length];
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_LANDSCAPE);
Display display = getWindowManager().getDefaultDisplay();
Point size = new Point();
display.getSize(size);
int width = size.x;
int height = size.y;
final RelativeLayout pianoLayout = new RelativeLayout(this);
RelativeLayout.LayoutParams whiteKeyParams1 = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT);
whiteKeys[0] = new Button(this);
whiteKeys[0].setId(View.generateViewId());
//whiteKeys[0].setHeight(height);
//whiteKeys[0].setWidth(width/8);
whiteKeys[0].setLayoutParams(whiteKeyParams1);
pianoLayout.addView(whiteKeys[0]);
whiteKeys[1] = new Button(this);
whiteKeys[1].setId(View.generateViewId());
//whiteKeys[i].setHeight(height);
RelativeLayout.LayoutParams whiteKeyParams2 = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT);
whiteKeyParams2.addRule(RelativeLayout.RIGHT_OF, whiteKeys[0].getId() );
whiteKeys[1].setLayoutParams(whiteKeyParams2);
pianoLayout.addView(whiteKeys[1]);
//HERE'S IS THE MOMENT WHERE I TRY TO ADD THIRD BUTTON AND THE BUTTONS START TO PILE UP
/*
whiteKeys[2] = new Button(this);
whiteKeys[2].setId(View.generateViewId());
//whiteKeys[i].setHeight(height);
//RelativeLayout.LayoutParams whiteKeyParams2 = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT);
whiteKeyParams2.addRule(RelativeLayout.END_OF, whiteKeys[1].getId());
whiteKeys[2].setLayoutParams(whiteKeyParams2);
pianoLayout.addView(whiteKeys[2]);*/
this.setContentView(pianoLayout);
}
}
You can add 8 same size buttons using weightsum and layoutweight with LienarLayout with horizontal orientations.
see below code it may help you to add same size buttons dynamically.
/* Add a new Linearlayout as a container for the buttons */
LinearLayout linearLayout = new LinearLayout(this);
linearLayout.setOrientation(LinearLayout.HORIZONTAL);
//Added Weight Sum 8 in LinearLayout
linearLayout.setWeightSum(8);
/* Create a new Buttons in this container, for the status bar */
//below LayoutParams define with weight 1 for buttons.
LinearLayout.LayoutParams param = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT, LinearLayout.LayoutParams.MATCH_PARENT, 1.0f);
Button button1 = new Button(linearLayout.getContext());
button1.setLayoutParams(param);
Button button2 = new Button(linearLayout.getContext());
button2.setLayoutParams(param);
Button button3 = new Button(linearLayout.getContext());
button3.setLayoutParams(param);
Button button4 = new Button(linearLayout.getContext());
button4.setLayoutParams(param);
Button button5 = new Button(linearLayout.getContext());
button5.setLayoutParams(param);
Button button6 = new Button(linearLayout.getContext());
button6.setLayoutParams(param);
Button button7 = new Button(linearLayout.getContext());
button7.setLayoutParams(param);
Button button8 = new Button(linearLayout.getContext());
button8.setLayoutParams(param);
With your approach before adding the view to parent layout you will have to add margins for every new key also which will prevent stacking one key over another.
params.setMargins(left, top, right, bottom);
I've created a Vertical LinearLayout with a Horizontal LinearLayout within it in order to hold 3 EditText boxes within them for data entry. I've also placed a button below the vertical LinearLayout that I want to program to add another row of editText with every press.
I've succeeded so far and managed to programmatically add another row with 1 edittext in it. Then I tried with 3 and hit a roadblock. I tried to use weightsum and weights to get the editText boxes to be in 3 columns. However with the code below I get 2 editText boxes next to each other then a very very tiny editbox as the last one.
What am I doing wrong? Why aren't the widths of the edittext boxes being divided by 3?
XML:
<LinearLayout android:id="#+id/layout_ingredients"
android:layout_below="#id/text_recipeIngredients"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:weightSum="3"
android:orientation="horizontal">
<EditText android:id="#+id/edit_recipeIngredient"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:hint="#string/edit_recipe_ingredient"/>
<EditText android:id="#+id/edit_recipeAmount"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:hint="#string/edit_recipe_amount"/>
<EditText android:id="#+id/edit_recipeUnit"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:hint="#string/edit_recipe_unit"/>
</LinearLayout>
</LinearLayout>
<Button android:id="#+id/btn_add_ingredient"
android:background="#color/orange"
android:layout_marginTop="10dp"
android:layout_below="#id/layout_ingredients"
android:layout_width="match_parent"
android:layout_height="100dp"
android:text="#string/btn_add_ingredient"
android:onClick="addIngredients"/>
Java:
public void addIngredients(View view) {
final String ADDINGREDIENT = "ADD INGREDIENT";
Log.d(ADDINGREDIENT, ADDINGREDIENT);
LinearLayout linearLayout = (LinearLayout)findViewById(R.id.layout_ingredients);
LinearLayout ingredientLayout = new LinearLayout(this);
ingredientLayout.setLayoutParams(new LinearLayout.LayoutParams(
LinearLayout.LayoutParams.MATCH_PARENT,
LinearLayout.LayoutParams.WRAP_CONTENT));
ingredientLayout.setOrientation(LinearLayout.HORIZONTAL);
ingredientLayout.setWeightSum(3f);
EditText editTextIngredient = new EditText(this);
editTextIngredient.setHint("Ingredient");
editTextIngredient.setLayoutParams(new LinearLayout.LayoutParams(
0,
LinearLayout.LayoutParams.WRAP_CONTENT,
1f));
EditText editTextAmount = new EditText(this);
editTextAmount.setHint("Amount");
editTextAmount.setLayoutParams(new LinearLayout.LayoutParams(
0,
LinearLayout.LayoutParams.WRAP_CONTENT,
1f));
EditText editTextUnit = new EditText(this);
editTextAmount.setHint("Unit");
editTextAmount.setLayoutParams(new LinearLayout.LayoutParams(
0,
LinearLayout.LayoutParams.WRAP_CONTENT,
1f));
ingredientLayout.addView(editTextIngredient);
ingredientLayout.addView(editTextAmount);
ingredientLayout.addView(editTextUnit);
linearLayout.addView(ingredientLayout);
}
The problem here is that you are adding the weighted layouts to a layout that is not on the screen, so its width is unknown at the time you add them.
You have a couple of approaches, but the easiest one is probably to grab the widths of the elements already on the screen and simply duplicate them (since you are using a weighted layout to begin with).
You could also measure the screen and use that measurement to set the widths of each layout.
Last, you could use ViewTreeObserver to add them after the parent has been added and the width is known (see the post here: Getting the width/height of a layout in Android).
The last is the most "interesting" but the least efficient and useful since your original layout already did the calculations.
I have a MainActivity initially empty. When I click on the "plus" button, you open a DialogFragment where there are two buttons("cancel" and "continue") and a EditText. In EditText you can write the name of the project (project 1 in this case) and by clicking "continue" you can create at run time the "Project 1", a "play" button and a TextView "hello" placed as shown in the image below.
I would like the TextView "hello" was positioned next to the "play" button on the same line.
Here is my code:
Method of the button "continue":
#Override
public void onDialogPositiveClick(DialogFragment dialog) {
EditText editText = (EditText) dialog.getDialog().findViewById(R.id.project_name);
String projectName = editText.getText().toString();
LinearLayout.LayoutParams lp1 = new LinearLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
lp1.gravity = Gravity.END;
Button projectButton = new Button(this);
projectButton.setText(projectName);
projectButton.setLayoutParams(lp1);
projectButton.setOnClickListener(projectListener);
LinearLayout.LayoutParams lp2 = new LinearLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
lp2.gravity = Gravity.START;
lp2.setMarginStart(10);
Button playButton = new Button(this);
playButton.setBackgroundResource(R.drawable.play_button_green);
playButton.setLayoutParams(lp2);
TextView buttonView = new TextView(this);
buttonView.setText("Hello");
LinearLayout linearLayout = (LinearLayout) findViewById(R.id.button_row);
linearLayout.addView(projectButton);
linearLayout.addView(playButton);
linearLayout.addView(buttonView);
}
MainActivity XML layout:
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/main_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal" >
<LinearLayout
android:id="#+id/button_row"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_alignParentTop="true"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true" >
</LinearLayout>
</RelativeLayout>
The whole layout must be created dynamically and then using java code not XML.
Anyone have any ideas?
Put Button and TextView inside LinearLayout with orientation="horizontal"
LinearLayout ll = new LinearLayout(this);
ll.setOrientation(LinearLayout.HORIZONTAL);
ll.addView(playButton);
ll.addView(buttonView);
LinearLayout linearLayout = (LinearLayout) findViewById(R.id.button_row);
linearLayout.addView(projectButton);
linearLayout.addView(ll);
by using horizontal android:orientation
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="horizontal" >
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button 1" />
<TextView
android:id="#+id/textview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="textView"
android:layout_weight="1"/>
</LinearLayout>
Rather than using Button and Text View you can use a single button also.
Drawable img = getContext().getResources().getDrawable( R.drawable.smiley );
Button playButton = new Button(this);
playButton.setText("Hello");
playButton.setCompoundDrawablesWithIntrinsicBounds( img, null, null, null );
playButton.setLayoutParams(lp2);
now you will get a button with text and icon on its left.
I've made the next layout xml code which I call it layout_one -
<?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:orientation="vertical" >
<LinearLayout
android:id="#+id/layout_one"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="50dp"
android:layout_marginTop="50dp"
android:orientation="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="100dp"
android:text="Testing 1"
android:textSize="20sp" />
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/info_layout"
android:visibility="gone">
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
As you can see there are two layout in it - one with textview and button and one with textview.
The layout with the only textview - is gone, And i want by a click on the button, from the visible layout, it will be shown.
Now at the activity i wrote the next code -
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.test_layout);
ScrollView sv = new ScrollView(this);
LinearLayout ll = new LinearLayout(this);
ll.setOrientation(LinearLayout.VERTICAL);
sv.addView(ll);
LinearLayout newView0 = (LinearLayout)View.inflate(this, R.layout.layout_one, null);
LinearLayout newView1 = (LinearLayout)View.inflate(this, R.layout.layout_one, null);
LinearLayout newView2 = (LinearLayout)View.inflate(this, R.layout.layout_one, null);
LinearLayout newView3 = (LinearLayout)View.inflate(this, R.layout.layout_one, null);
ll.addView(newView0);
ll.addView(newView1);
ll.addView(newView2);
ll.addView(newView3);
setContentView(sv);
newView1.findViewById(R.id.layout_one).setBackgroundColor(0xff0000ff);
TextView tv3 = (TextView) newView3.findViewById(R.id.textView1);
tv3.setText("Suprise Suprise");
infoLay = (View) findViewById(R.id.info_layout);
ll.addView(newView3);
}
Now there is something I don't understad - How could I set an on click listener to the button that will know which layout to show?
Tanks for any kind of help
Actually, there are three linear layouts, which seems redundant.
You can set the onclick listener by checking if textview of each layout is empty or not.
First off, have a look at this http://developer.android.com/training/improving-layouts/reusing-layouts.html. Use that <include> tag instead of dynamically creating all these layouts in your Activity class. Define your ScrollView, and all your LinearLayouts in your test_layout.xml file.
Then, in your Activity, all you have to do is get a reference to those views that's you've defined using findViewById.
Once you've got that working we can address your question as follows:
setContentView(R.layout.test_layout);
LinearLayout layout1 = (LinearLayout)findViewById(R.id.layout1);
LinearLayout layout2 = (LinearLayout)findViewById(R.id.layout2);
LinearLayout layout3 = (LinearLayout)findViewById(R.id.layout3);
OnClickListener listener = new OnClickListener() {
#Override
public void onClick(View view) {
((View)view.getParent().getParent()).findViewById(R.id.textView2).setVisibility(View.VISIBLE);
}
});
layout1.findViewById(R.id.button1).setOnClickListener(listener);
layout2.findViewById(R.id.button1).setOnClickListener(listener);
layout3.findViewById(R.id.button1).setOnClickListener(listener);
I'd also add that it seems like you're trying to create a list here, in which case you should use a ListView instead of many LinearLayouts.
How can I group all dynamic created radioButtons into one group?
while (cursor.moveToNext()) {
TableRow row = new TableRow(this);
// CheckBox chk = new CheckBox(this);
RadioButton radioBtn = new RadioButton(this);
// chk.setText(cursor.getString(cursor.getColumnIndex("from_text")));
radioBtn.setText(cursor.getString(cursor.getColumnIndex("from_text")));
radioBtn.
row.addView(radioBtn);
table.addView(row);
}
Xml
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/hello" />
<TableLayout
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:id="#+id/myTable"/>
</LinearLayout>
To handle radio buttons as a group they have to be placed into a RadioGroup layout. If you are going to place the radio buttons in separate table cells instead then you'll have to implement the group behavior yourself.
You can use RadioButton.SetOnCheckedChangeListener() to register a listener that responds to checked events.
You can look at the RadioGroup source code to see how this is done with the RadioGroup layout.