I've got some problem with positioning TextViews. Currently my layout looks like:
Text1: Text2
Text3: Text4
Ok, but when Text2 has 2 rows length or more I've got:
Text1: Text2:1
Text3: Text2:2/Text4
I don't know how to set up my layout to obtain view like:
Text1: Text2:1
Text2:2
Text3: Text4
Can somebody help me solve that problem?
XML code:
(...)
//Text1:
<TextView
android:id="#+id/tv_author_label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/tv_genre_label"
android:layout_toRightOf="#+id/img_Cover"
android:text="Author: "
android:textAppearance="?android:attr/textAppearanceMedium"
android:textStyle="bold" />
//Text2:
<TextView
android:id="#+id/tv_author"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBaseline="#+id/tv_author_label"
android:layout_alignBottom="#+id/tv_author_label"
android:layout_toRightOf="#+id/tv_author_label"
android:text="Anonymous Anonymous"
android:textAppearance="?android:attr/textAppearanceMedium" />
//Text3:
<TextView
android:id="#+id/tv_availability_label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/tv_author_label"
android:layout_toRightOf="#+id/img_Cover"
android:
android:textStyle="bold"
android:text="Availability: "
android:textAppearance="?android:attr/textAppearanceMedium" />
//Text4:
<TextView
android:id="#+id/tv_availability"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBaseline="#+id/tv_availability_label"
android:layout_alignBottom="#+id/tv_availability_label"
android:layout_toRightOf="#+id/tv_availability_label"
android:layout_alignParentLeft="#+id/tv_availability_label"
android:layout_below="#+id/tv_author"
android:text="b/d"
android:textAppearance="?android:attr/textAppearanceMedium" />
(...)
you can reconstruct your code something like this,
<LinearLayout 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"
android:orientation="vertical" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TextView
android:id="#+id/tv1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/hello_world" />
<TextView
android:id="#+id/tv2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="dfsdjfkd dsfsdf sdfsdf sdfsdfsd fjlsdjf sdj; j; jlksdfjl sdjflkdsjflsdk jkldsjf lsjldkfj sdl" />
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TextView
android:id="#+id/tv3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/hello_world" />
<TextView
android:id="#+id/tv4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/hello_world" />
</LinearLayout>
I hope it will be helpful !!
You can encapsulate the row of text views inside a linear layout with orientation - horiontal
Related
How can I make position center of long textView in layout at android.I used android:gravity="center" in layout but it didn't for the TextView has a long text.How can I solve this problem?
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#drawable/memorialvodafonebackground_2"
android:gravity="center"
android:orientation="vertical"
>
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Ekranda adınız göründükten sonra hastanemizi değerlendirmenizden memnuniyet duyacağız"
android:textColor="#color/black"
android:textSize="40dp" />
</LinearLayout>
Use
android:layout_gravity="center"
for TextView
android:gravity - sets the gravity of the content of the View its used on.
android:layout_gravity - sets the gravity of the View or Layout in its parent.
Hope this helps.
Try Replacing:
android:gravity="center"
to
android:layout_gravity="center"
Like this:
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="Ekranda adınız göründükten sonra hastanemizi değerlendirmenizden memnuniyet duyacağız"
android:textColor="#color/black"
android:textSize="40sp" />
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Ekranda adınız göründükten sonra hastanemizi değerlendirmenizden emnuniyet duyacağız"
android:gravity="center"
android:singleLine="true"
android:textColor="#color/black"
android:textSize="40dp" />
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 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
When I declare 3 TextViews in RelativeLayout, 'textA', 'textB', and 'textC'. The textC should appear below textB. But when run, the textC displayed in improper position (at the top-left of screen).
I don't know can textC use android:layout_below to textB.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent" android:layout_height="match_parent" >
<TextView
android:id="#+id/textA"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_alignParentLeft="true"
android:text="This is TextA : " />
<TextView
android:id="#+id/textB"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/textA"
android:layout_alignBaseline="#id/textA"
android:text="this is textB" />
<TextView
android:id="#+id/textC"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#id/textB"
android:text="This is TextC" />
</RelativeLayout>
You can also change
android:layout_below="#id/textA"
to textC
The complete Example would look:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent" android:layout_height="match_parent" >
<TextView
android:id="#+id/textA"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_alignParentLeft="true"
android:text="This is TextA : " />
<TextView
android:id="#+id/textB"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#+id/textA"
android:layout_alignBaseline="#+id/textA"
android:text="this is textB" />
<TextView
android:id="#+id/textC"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/textB"
android:layout_below="#+id/textA"
android:text="This is TextC" />
Just make below changes for the TextView3 :
<TextView
android:id="#+id/textC"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignRight="#+id/textB"
android:layout_below="#+id/textA"
android:text="This is TextC" />
It cannot use vertical alignment to the elements that use alignBaseline to other elements. Then in this case in 'textB' change alignBaseline to be alignTop like in the code.
<TextView
android:id="#+id/textB"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/textA"
android:layout_alignTop="#id/textA"
android:text="this is textB" />
Using this way it will support muti-line for textB.