I'm having trouble adding an imageview to a relative layout. I would like to add an image to a list of menu items that I am creating dynamically using RelativeLayout. All of my menu items show up just fine and in order but when I try to add an image to each of the items I only get one arrow and it is not centered vertically. Below is my code.
In my XML file
<RelativeLayout
android:id="#+id/pMenu"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content">
</RelativeLayout>
In my code:
private void buildMenu(String name, int id) {
String[] menuItems = getResources().getStringArray(pMenus[id]);
// Get the rel layout from xml
RelativeLayout container = (RelativeLayout) findViewById(R.id.pMenu);
int imageId=1;
Typeface tf = Typeface.createFromAsset(this.getAssets(),"mreavesmodot-reg.otf");
for(String menuItem: menuItems) {
// Defining the layout parameters
RelativeLayout.LayoutParams lp = new RelativeLayout.LayoutParams(
RelativeLayout.LayoutParams.WRAP_CONTENT,
RelativeLayout.LayoutParams.WRAP_CONTENT);
StyledButton menuImage = new StyledButton(this);
menuImage.setBackgroundResource(R.drawable.menu_button);
menuImage.setText(menuItem);
menuImage.setTypeface(tf);
menuImage.setTextSize(19);
menuImage.setPadding(20, 0, 0, 0);
menuImage.setTextColor(Color.WHITE);
menuImage.setGravity(Gravity.LEFT | Gravity.CENTER_VERTICAL);
menuImage.setOnClickListener(getOnClickListener(menuImage, name));
menuImage.setId(imageId);
if(imageId==1) {
lp.addRule(RelativeLayout.ALIGN_PARENT_TOP);
} else {
lp.addRule(RelativeLayout.BELOW ,imageId-1);
}
menuImage.setLayoutParams(lp);
ImageView arrow = new ImageView(this);
arrow.setImageResource(R.drawable.arrow_menu);
arrow.setPadding(0, 0, 15, 0);
RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams( RelativeLayout.LayoutParams.WRAP_CONTENT,
RelativeLayout.LayoutParams.WRAP_CONTENT );
params.addRule(RelativeLayout.ALIGN_RIGHT,menuImage.getId());
params.addRule(RelativeLayout.CENTER_VERTICAL);
arrow.setLayoutParams(params);
container.addView(menuImage);
container.addView(arrow);
imageId++;
}
}
I think the line below is your problem
params.addRule(RelativeLayout.CENTER_VERTICAL);
YES, you are most likely adding multiple arrows, they are just simply one on top of each other ALL aligned to the vertical center of the full relative layout. That command is not performing a vertical centering against your button item, but agains the parent RelativeLayout.
Related
When the user inputs a word, he creates a number of Buttons equal to the length of the word. For example: if user inputs "aaaa" he will create 4 Buttons, side by side, in the first row. Then if the user enters "bb" he will create 2 Buttons, side by side, in the second row. And "ccc" he creates 3 Buttons...
Image to demonstrate:
I dynamically create a RelativeLayout, then dynamically add Buttons to that layout. And finally I add the RelativeLayout to my existing LinearLayout. But the problem is, only one Button is added per row. And my program currently looks like this:
Can someone please me fix this problem?
CODE:
final LinearLayout linearLayout = (LinearLayout) findViewById(R.id.ll_bttn_words);
final LinearLayout.LayoutParams llp = new LinearLayout.LayoutParams(
LayoutParams.WRAP_CONTENT,
LayoutParams.WRAP_CONTENT);
button_test.setOnClickListener(
new View.OnClickListener()
{
public void onClick(View view)
{
RelativeLayout relativeLayout = new RelativeLayout(view.getContext());
RelativeLayout.LayoutParams rlp = new RelativeLayout.LayoutParams(
RelativeLayout.LayoutParams.WRAP_CONTENT,
RelativeLayout.LayoutParams.WRAP_CONTENT);
int size = enter_txt.getText().toString().length(); //the user input number of buttons
int id = 1;
for (int i=0; i<size; i++)
{
Button myButton = new Button(view.getContext());
myButton.setBackgroundResource(R.drawable.button);
myButton.setId(id);
rlp.addRule(RelativeLayout.RIGHT_OF, myButton.getId());
relativeLayout.addView(myButton, rlp);
id++;
}
linearLayout.addView(relativeLayout, llp);
rlp.addRule(RelativeLayout.RIGHT_OF, myButton.getId());
This line says that myButton should be added to right of myButton, which doesn't make any sense.
simple way to resolve this is to use the following line instead
rlp.addRule(RelativeLayout.RIGHT_OF, myButton.getId()-1);
But this isn't the best way to do this, you should use LinearLayout with horizontal orientation instead.
The structure should be simple
Just need to add your buttons in 3 different linear layout with orientation horizontal.
Like
<Relative layout>{
<LinearLayout global container with vertical orientation >{
<LinearLayout for 'a' type buttons container with horizontal orientation>
<LinearLayout for 'b' type buttons container with horizontal orientation>
<LinearLayout for 'c' type buttons container with horizontal orientation>
}
}
You guys are right. It is much easier using a LinearLayout. For those interested
final LinearLayout linearLayout = (LinearLayout) findViewById(R.id.ll_bttn_words);
final LinearLayout.LayoutParams llp = new LinearLayout.LayoutParams(
LayoutParams.WRAP_CONTENT,
LayoutParams.WRAP_CONTENT);
button_test.setOnClickListener(
new View.OnClickListener()
{
public void onClick(View view)
{
LinearLayout linearLayout2 = new LinearLayout(view.getContext());
linearLayout2.setOrientation(LinearLayout.HORIZONTAL);
LinearLayout.LayoutParams rlp = new LinearLayout.LayoutParams(
LinearLayout.LayoutParams.WRAP_CONTENT,
LinearLayout.LayoutParams.WRAP_CONTENT);
int size = enter_txt.getText().toString().length();
for (int i=0; i<size; i++)
{
Button myButton = new Button(view.getContext());
myButton.setBackgroundResource(R.drawable.button);
linearLayout2.addView(myButton, rlp);
}
linearLayout.addView(linearLayout2, llp);
I have made a customView for a .gif image support in android. I got success in that, but currently that view is aligned to the top left corner of my activity. I want it to be aligned to the center of my activity. Please tell me how can I do this.
My code is as below:
GifwebView view = new GifwebView(this, "file:///android_asset/p3.gif");
view.setBackgroundColor(Color.parseColor("#00000000"));
RelativeLayout rel = (RelativeLayout) findViewById(R.id.rl_pics);
RelativeLayout.LayoutParams p = new RelativeLayout.LayoutParams(
LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
rel.setBackgroundColor(Color.parseColor("#00000000"));
view.setLayoutParams(p);
rel.addView(view);
CustomView
public class GifwebView extends WebView {
public GifwebView(Context context, String path) {
super(context);
// TODO Auto-generated constructor stub
loadUrl(path);
}
}
Your activity main layout (RelativeLayout), it's height and width should be match_parent, so it will take the whole screen, and it's gravity should be set to center, so that the elements in it will be positioned to center of the screen.
XML:
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/rl_pics"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center">
</RelativeLayout>
Activity:
RelativeLayout rel = (RelativeLayout) findViewById(R.id.rl_pics);
RelativeLayout.LayoutParams p = new RelativeLayout.LayoutParams(
LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
GifwebView view = new GifwebView(this, "file:///android_asset/p3.gif");
view.setBackgroundColor(Color.parseColor("#00000000"));
view.setLayoutParams(p);
rel.addView(view);
p.addRule(RelativeLayout.CENTER_HORIZONTAL);
view.setGravity(Gravity.CENTER_VERTICAL);
This should work. Also if you want the activity to take the whole screen instead of the requiered for filling your content you should use match_parent instead of wrap_content.
edit: if your custom view doesn't implement the setGravity(int) method, you can do this instead:
p.addRule(RelativeLayout.CENTER_HORIZONTAL|RelativeLayout.CENTER_IN_PARENT, view.getId());
How can we add buttons at dynamic positions in layout or using canvas, not in table layout?
Can anyone please help me on this?
Use RelativeLayout to position your controls where you like them. Have a look at this link:
Dynamic TextView in Relative layout
and here
How to create a RelativeLayout programmatically with two buttons one on top of the other?
If you like to achieve it within XML only. Look here:
http://www.mkyong.com/android/android-relativelayout-example/
Here an example how you could use the RelativeLayout to position your controls dynamically:
public class MainActivity extends Activity {
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
// Creating a new RelativeLayout
RelativeLayout mainRelativeLayout = new RelativeLayout(this);
// Defining the RelativeLayout layout parameters with Fill_Parent
RelativeLayout.LayoutParams relativeLayoutParameters = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.FILL_PARENT, RelativeLayout.LayoutParams.FILL_PARENT);
// Creating a new Left Button
Button buttonLeft = new Button(this);
buttonLeft.setText("Left");
// Creating a new Left Button with Margin
Button buttonLeftWithMargin = new Button(this);
buttonLeftWithMargin.setText("Left with Margin");
// Creating a new Center Button
Button buttonCenterParent = new Button(this);
buttonCenterParent.setText("Center");
// Creating a new Bottom Button
Button buttonBottom = new Button(this);
buttonBottom.setText("Bottom");
// Add a Layout to the Buttons
AddButtonLayout(buttonLeft, RelativeLayout.ALIGN_PARENT_LEFT);
AddButtonLayout(buttonCenterParent, RelativeLayout.CENTER_IN_PARENT);
AddButtonLayout(buttonBottom, RelativeLayout.ALIGN_PARENT_BOTTOM);
// Add a Layout to the Button with Margin
AddButtonLayout(buttonLeftWithMargin, RelativeLayout.ALIGN_PARENT_LEFT, 30, 80, 0, 0);
// Add the Buttons to the View
mainRelativeLayout.addView(buttonLeft);
mainRelativeLayout.addView(buttonCenterParent);
mainRelativeLayout.addView(buttonBottom);
mainRelativeLayout.addView(buttonLeftWithMargin);
// Setting the RelativeLayout as our content view
setContentView(mainRelativeLayout, relativeLayoutParameters);
}
private void AddButtonLayout(Button button, int centerInParent, int marginLeft, int marginTop, int marginRight, int marginBottom) {
// Defining the layout parameters of the Button
RelativeLayout.LayoutParams buttonLayoutParameters = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT);
// Add Margin to the LayoutParameters
buttonLayoutParameters.setMargins(marginLeft, marginTop, marginRight, marginBottom);
// Add Rule to Layout
buttonLayoutParameters.addRule(centerInParent);
// Setting the parameters on the Button
button.setLayoutParams(buttonLayoutParameters);
}
private void AddButtonLayout(Button button, int centerInParent) {
// Just call the other AddButtonLayout Method with Margin 0
AddButtonLayout(button, centerInParent, 0 ,0 ,0 ,0);
}
}
And you should get something like this:
I am working to create fields at run time, like in a relative layout am adding one text field at right corner and one Check-box at the left corner.
For this am getting problem, currently i am using the following code:
ViewGroup hori_layout=new RelativeLayout(getParent());
hori_layout.setLayoutParams(new ViewGroup.LayoutParams(ViewGroup.LayoutParams.FILL_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT));
TextView tv1=new TextView(getParent());
tv1.setText(_medContactNames[i]);
tv1.setTextColor(Color.BLACK);
CheckBox cb = new CheckBox(getApplicationContext());
hori_layout.addView(tv1);
hori_layout.addView(cb);
layout.addView(hori_layout);
*
/**
* GENERATING RELATIVE LAYOUT AT RUNTIME
* */
public class RL extends RelativeLayout {
public RL(Context context,int i,String flag) {
super(context);
//FIRST FIELD OF THE LAYOUT
TextView firstField = new TextView(context);
firstField.setTextColor(Color.BLACK);
if(flag.equalsIgnoreCase("LAW")){
firstField.setText(_lawContactNames[i]);
}else{
firstField.setText(_medContactNames[i]);
}
firstField.setId(1);
//SECOND FIELD OF THE LAYOUT
CheckBox secondField = new CheckBox(context);
secondField.setId(2);
//FIRST LAYOUT WHICH MUST BE PRESENT AT LEFT END == TEXT FIELD
RelativeLayout.LayoutParams lpSecond = new RelativeLayout.LayoutParams(
LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
addView(firstField, lpSecond);
//SECOND LAYOUT AT RIGHT END == CHECK BOX
RelativeLayout.LayoutParams lpFirst = new RelativeLayout.LayoutParams(
LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
lpFirst.addRule(RelativeLayout.ALIGN_PARENT_RIGHT, secondField.getId());
addView(secondField, lpFirst);
}
}
*
I created a custom view. In it, theres a line, a textview, another line. beneath the bottom line, i wanted to put a new horizontally oriented linearlayout. when i run it, this nested linearlayout doesnt seem to show up at all. Instead, i can see the test button right underneath the bottom line. what am i doing wrong?
public class MyView extends LinearLayout {
public MyView(Context context, Question question) {
super(context);
// this.setLayoutParams(params);
this.setOrientation(VERTICAL);
this.setBackgroundColor(Color.WHITE);
LinearLayout.LayoutParams lineParams = new LinearLayout.LayoutParams(LayoutParams.FILL_PARENT, 2);
View topLine = new View(context);
lineParams.setMargins(0, 15, 0, 0);
topLine.setBackgroundColor(Color.argb(255, 0, 159, 218));
topLine.setLayoutParams(lineParams);
this.addView(topLine);
LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.WRAP_CONTENT);
//Challenge Question
TextView questionText = new TextView(context);
questionText.setTextColor(Color.BLACK);
questionText.setTextSize(14);
questionText.setLayoutParams(params);
questionText.setGravity(Gravity.CENTER_HORIZONTAL);
questionText.setText(question.getQuestion());
this.addView(questionText);
View bottomLine = new View(context);
bottomLine.setBackgroundColor(Color.argb(255, 0, 159, 218));
bottomLine.setLayoutParams(lineParams);
this.addView(bottomLine);
LinearLayout innerLayout = new LinearLayout(context);
LinearLayout.LayoutParams innerLayoutParams = new LinearLayout.LayoutParams(300, LayoutParams.WRAP_CONTENT);
innerLayout.setLayoutParams(innerLayoutParams);
innerLayout.setBackgroundColor(Color.RED);
innerLayout.setOrientation(HORIZONTAL);
//TableLayout for the multiple choices
TableLayout tableLayout = new TableLayout(context);
LayoutParams tableLayoutParams = new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
// tableLayoutParams.weight = .8f;
tableLayout.setBackgroundColor(Color.RED);
tableLayout.setLayoutParams(tableLayoutParams);
innerLayout.addView(tableLayout);
this.addView(innerLayout);
Button button = new Button(context);
button.setLayoutParams(params);
button.setText("testing 123");
this.addView(button);
}
Note that I pasted the code without all the stuff that I added to the tablelayout. I probably should have pasted that too. But it didn't work when I did that either. but either way, if i set the nested linearlayout to 300 width and set a background color of red to it, i should at least see it, no?
Think about what the height of the inner layout should be. Right now it is wrap_content and contains a TableLayout (with no rows) with its height also set to wrap_content. There doesn't seem to be anything in that inner layout giving it a height dimension, so that may be why it is not being displayed.
Trying the following will make your layout visible:
LinearLayout.LayoutParams innerLayoutParams = new LinearLayout.LayoutParams(300, 300);
More usefully, you can try adding something with a real width/height to the TableLayout.
Also consider writing your layout in XML to better separate your application logic and the presentation.