I am developing an app. In that I am getting data from webservice and I am inserting it in TextView. But, the alignment of the textview is getting scrambled. Please check the image.
First 3 rows(black colored) is in proper order, from the 4th it is scrambled. I googled on it so many times but not getting the exact solution as I wanted.
XML Code:
<?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="70dp"
android:orientation="horizontal"
>
<TextView
android:id="#+id/schedule_1_textView_day_date"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="KKR"
android:layout_weight="1.5"
android:layout_marginTop="10dp"
android:textColor="#color/Black"
android:textSize="7sp"
/>
<TextView
android:id="#+id/schedule_1_textView_matchno"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="10"
android:layout_weight="1.5"
android:layout_marginTop="10dp"
android:textColor="#color/Black"
android:textSize="7sp"
/>
<TextView
android:id="#+id/schedule_1_textView_time"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:layout_weight="1"
android:text="6"
android:textColor="#color/Black"
android:textSize="7sp"
/>
<TextView
android:id="#+id/schedule_1_textView_team1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:layout_weight="1"
android:text="4"
android:textSize="7sp"
android:textColor="#color/Black"
/>
<TextView
android:id="#+id/schedule_1_textView_team2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="0"
android:layout_weight="1"
android:layout_marginTop="10dp"
android:textColor="#color/Black"
android:textSize="7sp"
/>
<TextView
android:id="#+id/schedule_1_textView_venue"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="6"
android:layout_marginTop="10dp"
android:textColor="#color/Black"
android:textSize="7sp"
/>
<TextView
android:id="#+id/schedule_1_textView_blank"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="B"
android:layout_marginTop="20dp"
android:textColor="#color/Black"
android:textSize="6sp"
android:visibility="invisible"
/>
</LinearLayout>
Try this..
You forget to add android:layout_weight="1" for below two TextView Use android:singleLine="true" for all TextView
<TextView
android:id="#+id/schedule_1_textView_venue"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:singleLine="true"
android:text="6"
android:layout_marginTop="10dp"
android:textColor="#color/Black"
android:textSize="7sp"
/>
<TextView
android:id="#+id/schedule_1_textView_blank"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:singleLine="true"
android:text="B"
android:layout_marginTop="20dp"
android:textColor="#color/Black"
android:textSize="6sp"
android:visibility="invisible"
/>
you might wanna assigh android:layout_weight property to the TextViews like:
<TextView
android:id="#+id/schedule_1_textView_venue"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="6"
android:layout_marginTop="10dp"
android:textColor="#color/Black"
android:textSize="7sp" />
you will need to assign weight according to your requirement. i.e for bigger views you want to assign higher values.
[EDIT] and for the last TextView you may want to set android:layout_gravity="center|right" and android:layout_gravity="center|left" for the first for the text alignment for the rest you should use android:layout_gravity="center"
Add gravity to your TextView like:
android:gravity="center_vertical|center_horizontal"
change gravity to left, right or center as you need...
have you tried adding weight to schedule_1_textView_venue?
It's a little more work, but did you try using TableLayout? This is very useful tutorial that can help you organizing the correct order of views.
EDIT: I think i know what causes the mismatch of the TextViews. It comes from the different length of the values in your last column named VENUE. Take for example the values HYDEBARAD and DELHI - the first one is much longer than the second which makes all the TextViews on the row to go left. I am sure that if you put identical padding to the TextViews you will align them. For example: take your TextViews in MATCH column and write the following: myTextView.setPadding(40, 0, 0, 0) (padding on the left side) this will put them exactly in a straight row. Do the same with the rest TextViews with the proper padding value, take into consideration the length of the values in the other columns... It is a little bit tricky though. :)
Related
I have 2 TextView one on top of the other. When they have the same text they have the same height but when one has more text from the other he will get bigger.
<LinearLayout
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="center_vertical"
android:layout_weight="1"
android:paddingLeft="8dp"
android:paddingTop="12dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceSmall"
android:text="Math, Civics"
android:id="#+id/teaches"
android:layout_weight="1"
android:background="#A4D34A" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceSmall"
android:text="Computer Science"
android:id="#+id/learns"
android:layout_weight="1"
android:background="#D22ACE" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceSmall"
android:text="5$/hour"
android:id="#+id/rate" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="32dp"
android:layout_marginRight="8dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceSmall"
android:text="Start Chat"
android:id="#+id/textView9"
android:layout_marginRight="8dp"
android:textStyle="italic"
android:layout_centerVertical="true"
android:layout_alignParentEnd="true" />
</RelativeLayout>
</LinearLayout>
How can I make them stay in the same height no matter what?
You have a couple of options: You can provide equal weights to the two textviews
<TextView
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="1"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="1"/>
OR You can use give fixed heights to both views.
OR You can set MaxLines(Maximmum lines) attribute for the text view to be of a particular value.
Define a fixed value for yout layout_height like 24dp or something best in an dimens.xml like that:
<dimen name="textview_height">24dp</dimen>
and in your layout put both layout_height to :
#dimen/textview_height
Another option would be to set the first to set both to wrap_content and get the MeasuredHeight from both of them, then take the greater value and apply it to both TextViews
I'm trying to put an N (new) badge at the end of the Textview. But Android Studio gives me that two Textviews, hashtag_list_row_title and hashtag_list_row_new can overlap if one Textview contains some lengthy string.
In production environment, it's not likely that hashtag_list_row_title is long, but I want to prevent two Textviews from being overlapped. How can I achieve this?
I prefer the way hashtag_list_row_new has priority over hashtag_list_row_title because that's more natural way to display an N badge.
So far my code is as follows.
list_row.xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/hashtag_list_row_root"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/bg_list_row_selector" >
<RelativeLayout
android:id="#+id/hashtag_list_row_title_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="16dp"
android:layout_marginStart="16dp"
android:layout_marginRight="8dp"
android:layout_marginEnd="8dp"
android:layout_marginTop="24dp"
android:layout_toLeftOf="#+id/hashtag_list_row_post_count"
android:layout_toStartOf="#+id/hashtag_list_row_post_count">
<TextView
android:id="#+id/hashtag_list_row_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:ellipsize="end"
android:gravity="center_vertical"
android:textColor="#color/hotspot_list_row_title"
android:textSize="16sp"
android:textStyle="bold"
android:text="asdfasdfsadfsadfsfsfsafasdfsafsfasfasfasf" />
<TextView
android:id="#+id/hashtag_list_row_new"
android:layout_toRightOf="#+id/hashtag_list_row_title"
android:layout_toEndOf="#+id/hashtag_list_row_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/red"
android:textStyle="bold"
android:layout_marginTop="2dp"
android:layout_marginLeft="11dp"
android:layout_marginStart="11dp"
android:text="#string/N" />
</RelativeLayout>
<TextView
android:id="#+id/hashtag_list_row_post_count"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginEnd="20dp"
android:layout_marginRight="20dp"
android:paddingLeft="10dp"
android:paddingRight="10dp"
android:background="#drawable/btn_post_normal"
android:gravity="center"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
android:textColor="#787878"
android:textSize="12sp"
android:textStyle="bold" />
<View
android:id="#+id/hashtag_list_row_divider"
android:layout_width="match_parent"
android:layout_height="1dp"
android:layout_below="#+id/hashtag_list_row_title_layout"
android:layout_marginTop="24dp"
android:background="#color/bg_horizontal_divider" />
</RelativeLayout>
Edit
Textview on the right side should place right next to the left one, which has varying length. And I want to prevent the situation where the left one gets longer beyond certain length so that the right one is hidden, or overlapped, or whatever.
It should look as below.
| (text) N (empty space empty)|
| (more text) N (empty space) |
| (more text more more...) N |
Edit 2
I want the left TextView to be ellipsized when it's beyond the width of the row except for N badge. I want this.
I don't want this.
Edit 3
N badge should not be placed on the right side all the time. I want the badge to be placed right next to the left TextView when the length is shorter than horizontal width.
It's good.
It's no go.
Ran into the same problem.
What you want is the right side TextView to have:
android:layout_toEndOf="#+id/member_count"
The ID being the ID of the left side TextView.
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:orientation="horizontal">
<TextView
android:id="#+id/member_count"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/white"
android:textStyle="bold"
android:text="10"
android:textSize="16sp"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/white"
android:layout_toEndOf="#+id/member_count"
android:text="Members"
android:textSize="16sp"/>
</RelativeLayout>
Try something like below.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/hashtag_list_row_root"
android:background="#drawable/bg_list_row_selector"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<RelativeLayout
android:id="#+id/hashtag_list_row_title_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="16dp"
android:layout_marginStart="16dp"
android:layout_marginRight="8dp"
android:layout_marginEnd="8dp"
android:layout_marginTop="24dp"
android:layout_toLeftOf="#+id/hashtag_list_row_post_count"
android:layout_toStartOf="#+id/hashtag_list_row_post_count">
<TextView
android:singleLine="true"
android:id="#+id/hashtag_list_row_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:ellipsize="end"
android:gravity="center_vertical"
android:textColor="#color/hotspot_list_row_title"
android:textSize="16sp"
android:textStyle="bold"
android:text="asdfasdfsadfsadfsfsfsafasdfsafsfasfasfasf" />
</RelativeLayout>
<TextView
android:id="#+id/hashtag_list_row_post_count"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginEnd="20dp"
android:layout_marginRight="20dp"
android:paddingLeft="10dp"
android:paddingRight="10dp"
android:background="#drawable/btn_post_normal"
android:gravity="center"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
android:textColor="#787878"
android:textSize="12sp"
android:textStyle="bold" />
<TextView
android:layout_centerVertical="true"
android:id="#+id/hashtag_list_row_new"
android:layout_toLeftOf="#+id/hashtag_list_row_post_count"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/red"
android:textStyle="bold"
android:layout_marginTop="2dp"
android:layout_marginLeft="11dp"
android:layout_marginStart="11dp"
android:text="#string/N" />
<View
android:id="#+id/hashtag_list_row_divider"
android:layout_width="match_parent"
android:layout_height="1dp"
android:layout_below="#+id/hashtag_list_row_title_layout"
android:layout_marginTop="24dp"
android:background="#color/bg_horizontal_divider" />
</RelativeLayout>
Result will be something similar like below. I had to remove some attributes that was pointing to resources that my project didn't have, so below figure is just a mock up. The code is updated to fit you.
Hello all i need to develop layout like whats app in chatting screen like
in this i want to display time after chat textview complete.
For that i have done
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/blue" >
<TextView
android:id="#+id/tv_message_chat_item_f"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="2dp"
android:layout_marginTop="2dp"
android:gravity="left|center"
android:paddingBottom="#dimen/one_dp"
android:paddingLeft="#dimen/fifteen_dp"
android:paddingRight="#dimen/five_dp"
android:paddingTop="#dimen/one_dp"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="fgfdgdf rete tretretret rtrtrwtw fgdfr grtwerwerewr ewrwerew" />
<TextView
android:id="#+id/tv_message_time_f"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_below="#+id/tv_message_chat_item_f"
android:layout_marginBottom="2dp"
android:paddingRight="#dimen/five_dp"
android:gravity="right"
android:paddingBottom="#dimen/one_dp"
android:text="fgfdg"
android:textAppearance="?android:attr/textAppearanceSmall" />
</RelativeLayout>
But not working with big message (the time texview not set properly)
<LinearLayout
android:orientation="horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:gravity="bottom"
android:background="#drawable/blue"
android:layout_alignParentStart="true" android:weightSum="10">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="Hi"
android:layout_weight="1"
android:id="#+id/textView"
android:gravity="bottom"
android:layout_centerVertical="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
<TextView
android:id="#+id/textView4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="bottom"
android:layout_marginStart="10dp"
android:text="Small Text"
android:textAppearance="?android:attr/textAppearanceSmall" />
</LinearLayout>
assuming your textView3 is the one with the "Big message" you should first take advantage of relative layout capabilities and use android:layout_below="#id/textview2" this will prevent overlapping with textView2 instead of just aligning everything from the bottom up.
<TextView
android:id="#+id/textView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/textView2"
android:layout_centerHorizontal="true"
android:text="Small Text"
android:textAppearance="?android:attr/textAppearanceSmall" />
then after you set your TextView that will hold your 'time' you can once agian use something like
<TextView
android:id="#+id/textView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/textView2"
android:gravity="right"
android:layout_alignParentRight="true"
android:text="12:00 pm"
android:textAppearance="?android:attr/textAppearanceSmall" />
Gravity right will allow the text to be place from right to left, since displaying time usually does not take more than 6 or 7 characters it will help.
Hope it resolves your problem.
You will need to implement ImageViews using 9patches (here: link)
And a listview, which can handle CustomLayouts for ListItems (with the 9Patch ImageView).
I think you are able to implement a list view, therefore I don't go deeper here.
Greets.
Is there a way to specify that a view should lie strictly to the left of the center (or strictly to the right of the center)? I have two textviews, one for LOGIN and one for REGISTER. I have them as children of RelativeLayout. No matter what I do I can't get them to behave. The one configuration that works in the Graphical Layout of eclipse, only shows the registration button on a real device. Here it is
<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="wrap_content"
android:background="#drawable/login_bckg"
android:padding="10dip"
tools:context=".LoginActivity" >
...
<View
android:id="#+id/center_btns"
android:layout_width="1dp"
android:layout_height="20dp"
android:layout_below="#id/text_fields"
android:layout_centerHorizontal="true" />
<TextView
android:id="#+id/login_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#id/text_fields"
android:layout_marginBottom="10dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_toLeftOf="#id/center_btns"
android:background="#drawable/btn_bkg"
android:clickable="true"
android:gravity="center"
android:onClick="login"
android:padding="10dp"
android:paddingLeft="10dp"
android:paddingRight="10dp"
android:text="Login"
android:textColor="#FFFFFF"
android:textSize="16sp"
android:textStyle="bold" />
<TextView
android:id="#+id/register_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_below="#id/text_fields"
android:layout_marginBottom="10dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_toRightOf="#id/center_btns"
android:background="#drawable/btn_bkg"
android:clickable="true"
android:gravity="center"
android:onClick="register"
android:padding="10dp"
android:paddingLeft="10dp"
android:paddingRight="10dp"
android:text="Register"
android:textColor="#FFFFFF"
android:textSize="16sp"
android:textStyle="bold" />
...
</RelativeLayout>
If I set them as children of a horizontal linearLayout, how do I specify their relationship to get it to work? I already tried that and no avail.
I wish I could post this as a comment but I don't quite have the rep... Anyway, to clarify, do you want the items to be right next to each other on the same line? If so the LinearLayout should work just fine...
<LinearLayout
...android:orientation="horizontal"
android:gravity="center">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
/>
Should work just fine. If not you may try playing with weights depending on which one you want to take up more space. For weights to work you will need to see the width of both to fill_parent.
I have this layout inside of a RelativeLayout:
<LinearLayout
android:id="#+id/llWatchItemCommentButton"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TextView
android:id="#+id/myMasterCat_Item"
style="#style/DropShadowEffect"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_weight="99"
android:shadowColor="#ffffff"
android:text="Item"
android:textColor="#515b61"
android:textSize="22sp" />
<ImageView
android:id="#+id/bFollowComment"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/featured_button_selector"
android:padding="5dp"
android:src="#drawable/comment" />
</LinearLayout>
<TextView
android:id="#+id/myMastCat_Cat"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/llWatchItemCommentButton"
android:layout_alignLeft="#+id/llWatchItemCommentButton"
android:layout_marginLeft="10dp"
android:text="MasterCat"
android:textColor="#666"
android:textSize="16sp" />
Essentially, if that TextView in the Layout becomes two lines, it will overlap with the TextView positioned below theLinearLayout`.
Is there an attribute perhaps that could correct this? As in, I want the bottom TextView to be below the entire LinearLayout at all times, even if it begins to grow. Right now, the position appears fixed.
Have you tried the following:
<TextView
android:id="#+id/myMastCat_Cat"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/llWatchItemCommentButton" //add this line in
android:layout_alignBottom="#+id/llWatchItemCommentButton"
android:layout_alignLeft="#+id/llWatchItemCommentButton"
android:layout_marginLeft="10dp"
android:text="MasterCat"
android:textColor="#666"
android:textSize="16sp" />