How can I make it so that the Buttons are not shifted to the bottom depending on the content a TextView above it?
If the TextView has a lot of text, the buttons are pushed down.
It may need to use RelativeLayout? Could you please explain how can i do it?
<?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_height="match_parent"
android:background="#drawable/mainbackground">
<TextView
android:id="#+id/tvBody"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/tv_company"
android:layout_marginLeft="30dp"
android:textColor="#002060"
android:layout_marginTop="20dp"
android:textSize="15sp"
>
</TextView>
<Button
android:id="#+id/button_operations"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/gradient_blue"
android:drawableLeft="#drawable/ic_purchase"
android:paddingLeft="10dp"
android:paddingTop="5dp"
android:paddingBottom="5dp"
android:gravity="left|center"
android:text=" oper1"
android:layout_marginTop="15dp"
android:layout_marginLeft="30dp"
android:layout_marginRight="30dp"
android:textColor="#001B51"
android:textSize="30sp"
android:textStyle="bold"
/>
....... //4 more buttons
<Button
android:id="#+id/button_exit"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/gradient_blue"
android:paddingLeft="10dp"
android:drawableLeft="#drawable/ic_exit"
android:gravity="left|center"
android:text=" Exit"
android:paddingTop="5dp"
android:paddingBottom="5dp"
android:layout_marginTop="10dp"
android:layout_marginLeft="30dp"
android:layout_marginRight="30dp"
android:textColor="#001B51"
android:textSize="30sp"
android:textStyle="bold"/>
</LinearLayout>
Yes, RelativeLayout would work better for this. Notice the new attributes added.
<?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"
android:background="#drawable/mainbackground">
<TextView
android:id="#+id/tvBody"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/tv_company"
android:layout_marginLeft="30dp"
android:textColor="#002060"
android:layout_marginTop="20dp"
android:textSize="15sp"
android:layout_alignParentStart="false"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true">
</TextView>
<Button
android:id="#+id/button_operations"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/gradient_blue"
android:drawableLeft="#drawable/ic_purchase"
android:paddingLeft="10dp"
android:paddingTop="5dp"
android:paddingBottom="5dp"
android:gravity="left|center"
android:text=" oper1"
android:layout_marginTop="50dp"
android:layout_marginLeft="30dp"
android:layout_marginRight="30dp"
android:textColor="#001B51"
android:textSize="30sp"
android:textStyle="bold"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"/>
Another way is to set their positions programmatically like this:
RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT);
params.addRule(RelativeLayout.ALIGN_PARENT_LEFT, RelativeLayout.TRUE);
Button button1 = (Button)findViewById(R.id.button_operations);
button1.setLayoutParams(params);
//or set its position relative to another button:
params = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT);
params.addRule(RelativeLayout.RIGHT_OF, button1.getId());
Button button2 = (Button)findViewById(R.id.secondBtn);
button2.setLayoutParams(params);
//or set its margins like this (left, top, right, bottom):
params = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT);
params.setMargins(200, 600, 0, 0); //if it is possible don't use hard coded numbers, use parameters based on screen resolution instead
Button button3 = (Button)findViewById(R.id.thirdBtn);
button3.setLayoutParams(params);
By default, your TextView is going to grow as much as it needs. You can place restrictions on it such as using maxLines
<TextView
android:maxLines="3"
...
</TextView>
There is also android:lines
If you wish, you can also use android:ellipsize to show, for instance, at the end of the TextView that there is more text.
You can read through the documentation to see which attributes are best for you.
Related
I'm trying to display a text inside a TextView in the left side of the screen and an image inside ImageView in the right side when "true":
<RelativeLayout
android:id="#+id/displayMessageCenter"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/displayMessageTop"
android:layout_centerHorizontal="true"
android:background="#android:color/white">
<TextView
android:id="#+id/textMessageText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:textColor="#000000"
android:layout_weight="0.5"
android:layout_alignBottom="#+id/dividerId" />
<ImageView
android:id="#+id/messagePicture"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_alignBottom="#+id/dividerId"
android:layout_weight="0.5"
android:gravity="right"/>
<View
android:id="#+id/dividerId"
android:layout_width="400dp"
android:layout_height="1dp"
android:background="#000"
android:layout_above="#id/leftTextGenericDialog"
android:gravity="center"
android:layout_centerHorizontal="true"
android:layout_marginBottom="20dp"/>
<TextView
android:id="#+id/leftTextGenericDialog"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:clickable="true"
android:gravity="center"
android:layout_centerHorizontal="true"
android:textColor="#FF72CCCC"
android:text="SEND RESPONSE"
android:textSize="40dp"
android:drawableLeft="#drawable/sendicon"
android:layout_above="#+id/closeButton"
android:onClick="sendMessage"/>
<ImageButton
android:id="#+id/closeButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingTop="5sp"
android:layout_gravity="center"
android:background="#drawable/button_close_animation"
android:onClick="closeActivity"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_marginBottom="20dp"/>
</RelativeLayout>
and if "false" to hide the image and display just the TextView with the text in the center. The hiding will be something like:
if(true) imageView.setVisibility(View.GONE);
else imageView.setVisibility(View.VISIBLE);
but I don't know how to align the ImageView and the TextView to be easier to hide/show just the ImageView when needed.
I'm new in Android development so please be gentle :)
When using Relative layout on these cases, you can use alignParentLeft=true for the TextView and alignParentRight=true for the ImageView, but if you wanted the TextView to adjust whenever the ImageView is visible or not. Use something like
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"
>
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="text"
android:layout_weight="0.5"
android:gravity="center_horizontal"
/>
<ImageView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.5"
android:visibility="gone"
/>
</LinearLayout>
For true condition, you can just set
android:alignParentLeft="true"
and
android:alignParentRight="true"
to your TextView and ImageView corresponsdingly.
For false condition, you can programmatically set rules to your TextView. Just get the TextView using findViewById and set rules like following:
TextView tv = (TextView) findViewById(R.id.textMessageText);
RelativeLayout.LayoutParams layoutParams =
(RelativeLayout.LayoutParams)tv.getLayoutParams();
layoutParams.addRule(RelativeLayout.CENTER_IN_PARENT, RelativeLayout.TRUE);
tv.setLayoutParams(layoutParams);
This is what I need to achieve:
|TEXTVIEW1|TEXTVIEW2|BUTTON|
TV1 can grow as much as it wants but only taking the space it needs to show the text inside. If the text is bigger than the space it has then it will ellipsize.
TV2 has to be always to the right of the text of TV1 and has to show all its content. It cannot have ellipsize. It always has to show its text.
TV1 and 2 are single line.
BUTTON is fixed at the right of the screen.
Example 1:
TV1 = THIS IS A TEXT WHERE THE TEXT IS TOO LONG
TV2 = 1923
| THIS IS A TEXT W...1923 BUTTON|
Example 2:
TV1 = JUST THIS
TV2 = 1923
| JUST THIS1923________BUTTON|
(ignore the underscores)
I have tried a thousand different combinations with weights, wrap_content, etc... and still can't get it right.
Help please!
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TextView
android:id="#+id/tv1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:singleLine="true"*
android:ellipsize"end" />
<TextView
android:id="#+id/tv2"
android:layout_width="wrap_content"
android:layout_height="match_parent" />
<Button
android:id="#+id/button"
android:layout_width="wrap_content"
android:layout_height="match_parent" />
</LinearLayout>
This is the sizing you would need to achieve the fitting you desire. After these xml attributes you can add any other styles you wanted to apply like color or text. I starred the single line because this will stop it from growing vertically. If you want the text to be aligned in a row even when the text is smaller than the screen, add android:gravity="right" to tv1 only.
I created some little thing for you, I think its what your looking for. The thing you might have not known about is maxLength and singleLine part I believe.
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TextView
android:layout_width="wrap_content"
android:maxWidth="100dp"
android:singleLine="true"
android:text="I Just this helo this is long"
android:layout_height="wrap_content"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</LinearLayout>
<Button
android:layout_width="wrap_content"
android:layout_alignParentRight="true"
android:layout_height="wrap_content"/>
</RelativeLayout>
Try this.
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TextView
android:id="#+id/textview1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_weight="1.0"
android:text="textview1" />
<TextView
android:id="#+id/textview2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_toRightOf="#+id/textview1"
android:layout_weight="1.0"
android:text="textview2" />
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1.0"
android:text="button"
android:layout_alignParentTop="true"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true" />
</RelativeLayout>
I have a form. Which has few rows. Every row has two text views side by side. the left textview is static and the right textview is dynamic. based on the text of right textview(it may be any number of lines) the origin of the next row must depend as shown below. I am using relativelayout and writing in xml. How can i do it.
Note: I dont want to use grid or table layout due to some limitation.
RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT);
params.addRule(xxxxx);
Fix the left side textview static and draw the remaining items from java code.
You can try this way
<RelativeLayout 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" >
<LinearLayout
android:id="#+id/firstLinearLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:orientation="horizontal" >
<TextView
android:id="#+id/textView1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="2"
android:singleLine="true"
android:text="Static Text 1"
android:textAppearance="?android:attr/textAppearanceMedium" />
<TextView
android:id="#+id/textView2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="3"
android:singleLine="false"
android:text="Multiple line\nDynamic text 1"
android:textAppearance="?android:attr/textAppearanceMedium" />
</LinearLayout>
<LinearLayout
android:id="#+id/secondLinearLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/firstLinearLayout"
android:layout_marginTop="8dp" >
<TextView
android:id="#+id/textView3"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="2"
android:singleLine="true"
android:text="Static Text 2"
android:textAppearance="?android:attr/textAppearanceMedium" />
<TextView
android:id="#+id/textView4"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="3"
android:singleLine="false"
android:text="Multiple line\nDynamic text 2"
android:textAppearance="?android:attr/textAppearanceMedium" />
</LinearLayout>
</RelativeLayout>
I have this XML RelativeLayout
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<RelativeLayout
android:id="#+id/relativeBackGround"
android:layout_width="wrap_content"
android:layout_height="40dp"
android:layout_gravity="right"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp" >
<ImageView
android:id="#+id/img1"
android:layout_width="40dp"
android:layout_height="40dp"
android:src="#drawable/sample" />
<LinearLayout
android:id="#+id/linout"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_alignParentBottom="true"
android:layout_alignParentTop="true"
android:layout_toRightOf="#+id/img1"
android:background="#drawable/bubble_left" >
<TextView
android:id="#+id/text1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="text1" />
<TextView
android:id="#+id/text2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="15dp"
android:text="text2"
android:textSize="10sp" />
</LinearLayout>
</RelativeLayout>
</LinearLayout>
What I'm trying to to do is to change the gravity of the RelativeLayout from right to left based on the row like so
wrapper = (RelativeLayout) view.findViewById(R.id.relativeBackGround);
if (even) {
wrapper.setGravity(Gravity.LEFT);//this one isn't working
//How can I change the alignment of linout to be on the left of the img1?
} else {
wrapper.setGravity(Gravity.RIGHT);
}
the setGravity isn't working, and I'm not sure how to do the alignment, can you help me with that?
You can set the layout of the LinearLayout with something similar to the following:
LinearLayout ll = (LinearLayout) view.findViewById(R.id.linout);
RelativeLayout.LayoutParams lp = new RelativeLayout.LayoutParams(
RelativeLayout.LayoutParams.WRAP_CONTENT,
RelativeLayout.LayoutParams.MATCH_PARENT);
lp.addRule(RelativeLayout.ALIGN_PARENT_RIGHT);
ll.setLayoutParams(lp);
Then just switch the rule based on whether it's odd or even row.
I have a layout A composed by a set of 2 texts and one image followed by another set of 2 texts and one image (they are separated by a line). I want to inflate this layout (lets say A) and put it inside another one (lets say B). The problem is that the images and the separator are getting in the middle of B, while I wanted them in the middle of A. My code is:
Layout A (to be inflated):
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/rootLayout"
android:layout_width="fill_parent"
android:layout_height="55dp"
android:background="#drawable/bg_numeros"
android:orientation="vertical" >
<ImageView
android:id="#+id/separator"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:src="#drawable/divisoria_numeros" />
<ImageView
android:id="#+id/artistsDoll"
android:layout_width="60dp"
android:layout_height="fill_parent"
android:layout_centerVertical="true"
android:layout_toLeftOf="#+id/separator"
android:scaleType="fitCenter"
android:src="#drawable/boneco_artistas_numeros" />
<ImageView
android:id="#+id/songsDoll"
android:layout_width="60dp"
android:layout_height="fill_parent"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:scaleType="fitCenter"
android:src="#drawable/bonecos_numeros" />
<TextView
android:id="#+id/songsNumbers"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignTop="#+id/artistsDoll"
android:layout_toLeftOf="#+id/songsDoll"
android:layout_toRightOf="#+id/separator"
android:text="blabla"
android:textColor="#333333"
android:textSize="14dp"
android:textStyle="bold" />
<TextView
android:id="#+id/songsText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/songsNumbers"
android:layout_toLeftOf="#+id/songsDoll"
android:layout_toRightOf="#+id/separator"
android:text="SOME SONGS"
android:textColor="#999999"
android:textSize="11dp" />
<TextView
android:id="#+id/artistsNumbers"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignTop="#+id/artistsDoll"
android:layout_toLeftOf="#+id/artistsDoll"
android:text="blabla"
android:textColor="#333333"
android:textSize="14dp"
android:textStyle="bold" />
<TextView
android:id="#+id/artistsText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/artistsNumbers"
android:layout_toLeftOf="#+id/artistsDoll"
android:text="SOME ARTISTS"
android:textColor="#999999"
android:textSize="11dp" />
</RelativeLayout>
I am inserting the inflated layout like this:
RelativeLayout A = (RelativeLayout) Patterns.mainContext
.getLayoutInflater()
.inflate(R.layout.A, null);
RelativeLayout.LayoutParams rlp = new RelativeLayout.LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.WRAP_CONTENT);
rlp.addRule(RelativeLayout.BELOW, someTopLayout.getId());
B.addView(A, rlp);
Note that although the attributes android:layout_height="fill_parent" and android:layout_centerHorizontal="true" are set for the images, I expected them to centered in A, not B.
Any help??
The solution found here: How to use layoutinflator to add views at runtime?
Solved my problem.
RelativeLayout A = (RelativeLayout) Patterns.mainContext
.getLayoutInflater()
.inflate(R.layout.A, parentLayout, false);