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>
Related
I have two TextViews in a RelativeLayout. One to the left and the other one to the right. Both of them shows a string which may become very long. I want to make a min space of 10dp between two TextViews and let the right one have ellipse if no enough space.
I have below layout definition which does not work. The right TextView may cover the first one if it is very lone.
<RelativeLayout
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_centerVertical="true"
android:layout_marginLeft="3dp">
<TextView
android:id="#+id/left_one"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_marginBottom="7dp"
android:gravity="bottom"
android:text=""/>
<TextView
android:id="#+id/right_one"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_marginBottom="8dp"
android:layout_alignParentRight="true"
android:layout_marginRight="10dp"
android:gravity="center"
android:maxLines="1"
android:ellipsize="end"
/>
</RelativeLayout>
The only way I can do is to set the max length to the right one. But this is not what I want because if the left one is short, i want the right one to be longer than the maxWidth.
And when I added "toRightOf" this work but the textView width becomes too long for a short string shown in it. That is not acceptable
add Add android:layout_toRightOf="#+id/left_one in right_one textview
remove android:layout_alignParentRight="true" from right_one textview
replace android:layout_marginRight="10dp" by android:layout_marginLeft="10dp" in right_one textview
For right_one textview to remain right if it is short replace right_one textview portion by
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:layout_marginLeft="10dp"
android:layout_alignParentBottom="true"
android:layout_toRightOf="#+id/left_one>
<TextView
android:id="#+id/right_one"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:gravity="center"
android:maxLines="1"
android:ellipsize="end"
/>
</RelativeLayout>
You can do like this.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:weightSum="1">
<TextView
android:id="#+id/left_one"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_marginBottom="7dp"
android:gravity="bottom"
android:layout_weight="0.3"
android:text="Left text "/>
<TextView
android:id="#+id/right_one"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:gravity="center"
android:maxLines="1"
android:ellipsize="end"
android:layout_weight="0.7"
android:layout_marginLeft="10dp"
android:text="edkjfcnrdskjvkjrdfvsxsdcndsjkvnjksdnvkj
sdjkvbksdbvkj zskjvn jsdnbjkvfdbde"/>
</LinearLayout>
Add:
android:layout_toLeftOf="#+id/right_one"
android:layout_marginRight="10dp"
to your left_one TextView.
I have the xml code shown below. Everything is working as it should except the final textView( id locationTextView) which won't stay right. I want it to stay as right as possible, but I can't do that(it still appears straight after the linear Layout).Should I set a left margin?. And for the textView1 how can I make it to show only a certain part of the whole text, because I have texts of different lengths and they ruin the layout.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#color/product_list_item_bg"
android:descendantFocusability="blocksDescendants">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<ImageView
android:id="#+id/icon"
android:layout_width="72dip"
android:layout_height="72dip"
android:layout_margin="3dip"
android:adjustViewBounds="true"
android:contentDescription="#string/descr_image"
android:scaleType="centerCrop" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:id="#+id/item"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginTop="5dp"
android:padding="2dp"
android:text="Medium Text"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textColor="#33CC33" />
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:text="TextView" />
</LinearLayout>
<TextView
android:gravity="right"
android:layout_width="72dip"
android:layout_height="72dip"
android:layout_marginTop="0dp"
android:textAppearance="?android:attr/textAppearanceLarge"
android:id="#+id/locationTextView"
android:layout_gravity="right" />
</LinearLayout>
</RelativeLayout>
Try android:layout_weight="1" or some other value for your locationTextView. You can also try out android:weightSum="3" (or that is appropriate instead of 3) on your root LinearLayout. Assign proper weights to your different child views. You can get help here
For showing text in a presentable way, you could use android:ellipsize="marquee" or other options available.
I have the following layout for a ListView item:
<?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:padding="5dp">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/item_icon_image"
android:layout_centerVertical="true"
android:layout_alignParentLeft="true"
android:src="#drawable/m" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Business Name"
android:id="#+id/item_title_text"
android:layout_toRightOf="#+id/item_icon_image"
android:layout_marginLeft="3dp"
android:textStyle="bold"
android:textAppearance="?android:attr/textAppearanceSmall"
android:layout_alignTop="#+id/item_icon_image" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceSmall"
android:text="Distance"
android:id="#+id/item_distance_text"
android:layout_alignLeft="#+id/item_title_text"
android:layout_alignBottom="#+id/item_icon_image" />
</RelativeLayout>
And this is the rendered result:
As you can see there is a gap between the real text and the bottom of the image... I was expecting to have the bottom of the text matching exactly with the bottom of the image...so question is: How can I align the text to the bottom of the image?
(this also happens for the top text, but in the top instead)
EDIT:
For now I am using:
android:layout_marginBottom="-10dp"
But I wanted something more automatic, some solution that won't depend on dp or screen....but as commented, this might be impossible, because the View needs to make space for letter such as 'y', 'g' and 'j'....but I wish there could be something that will align it based on it's contents, so if there wasn't a 'g', it won't be saving this space.
You should add android:gravity="top" to your top text view and android:gravity="bottom" to your bottom text view to get the desired result.
Try this way,hope this will help you to solve your problem.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="5dp">
<ImageView
android:id="#+id/item_icon_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_launcher" />
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_marginLeft="5dp"
android:layout_weight="1"
android:orientation="vertical">
<TextView
android:id="#+id/item_title_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Business Name"
android:textAppearance="?android:attr/textAppearanceSmall"
android:textStyle="bold" />
<View
android:layout_width="1dp"
android:layout_height="odp"
android:layout_weight="1"/>
<TextView
android:id="#+id/item_distance_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Distance"
android:textAppearance="?android:attr/textAppearanceSmall" />
</LinearLayout>
</LinearLayout>
Do it like this to acheive the desired result:
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceSmall"
android:text="Distance"
android:id="#+id/item_distance_text"
android:layout_alignLeft="#+id/item_title_text"
android:layout_alignBottom="#+id/item_icon_image"
android:gravity="bottom" />
As seen in picture below I need a layout where Textview containing contents 'Hello' and layout '2' are always visible and are between layout '1' and ']'
{1}Hello{2} ]
{1}Hello I..{2}]
If textview contents are too long they should ellipsize
Layout '2' shouldn't be right aligned to parent or ']', but be next to TextView
I have tried playing with wieghts and relative layout but do not seem to get a working solution.
Any ideas/pointers?
Here is slimdown version of my layout
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#drawable/simple_white_button"
android:orientation="horizontal" >
<RelativeLayout
android:id="#+id/topLayout1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.85"
android:paddingBottom="5dp"
android:paddingLeft="5dp"
android:paddingTop="5dp" >
<ImageView
android:id="#+id/photo"
android:layout_width="75dp"
android:layout_height="75dp"
android:scaleType="centerCrop"
android:src="#drawable/headshot_alt"
android:visibility="visible" />
<LinearLayout
android:id="#+id/myRow"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/photo" >
<TextView
android:id="#+id/address"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:layout_marginTop="2dp"
android:ellipsize="end"
android:singleLine="true"
android:text="New Jersey"
android:textColor="#color/grey_text"
android:textSize="16sp" />
<LinearLayout
android:id="#+id/weather"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_marginTop="2dp"
android:layout_weight="1"
android:gravity="left" >
<!-- Weather -->
<ImageView
android:id="#+id/imgWeather"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_notification_news"
android:visibility="visible" />
<TextView
android:id="#+id/txtWeather"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_marginLeft="3dp"
android:gravity="center_vertical"
android:text="50/43"
android:textColor="#color/text_dark"
android:textSize="13sp"
android:visibility="visible" />
</LinearLayout>
</LinearLayout>
</RelativeLayout>
<LinearLayout
android:id="#+id/menu"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="0.15"
android:background="#drawable/simple_white_button"
android:gravity="center"
android:orientation="horizontal" >
<ImageView
android:id="#+id/menu_icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scaleType="center"
android:src="#drawable/ic_quickaction_default" />
</LinearLayout>
</LinearLayout>
Where {1} would be the id = photo, ] is id=menu and id=myRow is the textview + weather layout i want in between photo and menu. I preferably do not want to set max width on my address text view, in worst case i want it ellipsize when weather touches the menu, But when address is small i want weather next to address and not close to menu
Hopefully its bit more clear now
In a relative layout, with fixed width for the textview, Layout'2' as layout_toRightOf the textview, something like this:
<TextView
android:id="#+id/firstText"
android:layout_width="60dp"
android:layout_height="wrap_content"
android:background="#android:color/white"
android:text="Hello String"
android:lines="1"
android:ellipsize="end"
android:textAppearance="?android:attr/textAppearanceMedium" />
<TextView
android:id="#+id/layoutTwo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/firstText"
android:background="#android:color/white"
android:text="Layout 2"
android:textAppearance="?android:attr/textAppearanceMedium" />
</RelativeLayout>
Provide the container layout as per your requirement. With a fill_parent width, you can adjust the "]" to be at the extreme right or xdp away after your Layout 2
Can you specify, precisely, what is required...i'l edit my answer
It is a simple question but I don't know how to do it because I'm new in android.
I have two TextViews in a relative layout and when the first TextView getting bigger it writes on the other TextView which I want to avoid it. How can I do it ?
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="first"
android:gravity="left"/>
<TextView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="second"
android:layout_alignParentRight="true"/>
</RelativeLayout>
but when the text = firstfirstfirst.... it overrides the second textview.
You need to give you TextViews ids. Since you're using a RelativeLayout you can use layout_toLeftOf and layout_toRightOf, but you only need to use one of them.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_toLeftOf="#+id/textView2"
android:gravity="left"
android:text="firstfirstfirstfirstfirstfirsitseirodsifjdsoijfoisddsefdfadafdafad" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_alignParentRight="true"
android:text="second" />
give some advice:
first you can set the left textview's max width using android:maxWidth="" to control the left size, but if the size bigger than the size the text will become like this:text...
or you need make the left and right area cleanly, for example:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"
android:weightSum="2" >
<TextView
android:id="#+id/left"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_weight="1"
android:text="firstdasssssssssssssssssssssssssssssssssssssssssssssssssssssssss" />
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_weight="1"
android:gravity="left"
android:text="secondsdasdasdarerewrwcxcadasdasdsadsdasdasdadadsd" />
it make the left and right half area, also you can change the android:weightSum size.