TableRow TextView moves down on longer Text - android

I tried to make a timetable app for my school for fun by using a TableLayout with TableRow with TextView in it. The problem is that when i enter a longer text the TextView moves down.
Here is my xml:
`
<TableRow
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
<TextView
android:layout_width="0dp"
android:layout_height="60dp"
android:text="Mo"
android:background="#ffffff"
android:gravity="center"
android:layout_margin="1dp"/>
<TextView
android:layout_width="0dp"
android:layout_height="60dp"
android:gravity="center"
android:text="Tu"
android:background="#ffffff"
android:layout_margin="1dp"/>
<TextView
android:layout_width="0dp"
android:layout_height="60dp"
android:text="WeWeWeWeWeWeWeWeWeWeWeWeWeWeWeWeWeWeWeWeWeWeWeWeWeWeWeWeWeWeWeWeWeWeWeWe"
android:gravity="center"
android:background="#ffffff"
android:layout_margin="1dp"
/>
</TableRow>
</TableLayout>`
and here is a picture of what it looks like

Upd for your layout type.
This seems works fine. Change your textColor and other parameters as you like
<?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">
<TableLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TableRow
android:id="#+id/tableRow"
android:layout_width="wrap_content"
android:layout_height="60dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="60dp"
android:layout_margin="1dp"
android:background="#ffffff"
android:text="Mo"
android:textColor="#color/colorPrimaryDark" />
<TextView
android:layout_width="wrap_content"
android:layout_height="60dp"
android:layout_margin="1dp"
android:background="#ffffff"
android:text="Tu"
android:textColor="#color/colorPrimaryDark" />
<TextView
android:layout_width="match_parent"
android:layout_height="60dp"
android:layout_margin="1dp"
android:background="#ffffff"
android:gravity="center"
android:text="WeWeWeWeWeWeWeWeWeWeWeWeWeWeWeWeWeWeWeWeWeWeWeWeWeWeWeWeWeWeWeWeWeWeWeWe"
android:textColor="#color/colorPrimaryDark" />
</TableRow>
</TableLayout>
</RelativeLayout>

Related

LinearLayout TextView weight breaks with long text

When i add long text to my TextView in linear layout it takes up all the space, and other views get squeezed. I set layout_width="0" to every view but it did not help. I should also add that this layout is used in RecyclerView.
Here is my code:
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.LinearLayoutCompat
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:weightSum="100">
<TextView
android:textSize="12sp"
android:gravity="center"
android:id="#+id/lp"
android:layout_width="0dp"
android:layout_height="match_parent"
android:text="Lp"
android:layout_weight="5" />
//this TextView takes all the space if text is long, but it behaves normally if text is short
<TextView
android:textSize="12sp"
android:gravity="center"
android:id="#+id/nazwa"
android:layout_width="0dp"
android:layout_height="match_parent"
android:text="Końcówka Yankauer do odsysania pola operacyjnego CH 23 (4 otwory boczne) z kontrolą odsysania"
android:layout_weight="20"/>
<TextView
android:textSize="12sp"
android:gravity="center"
android:id="#+id/ilosc"
android:layout_width="0dp"
android:layout_height="match_parent"
android:text="#"
android:layout_weight="5" />
<TextView
android:textSize="12sp"
android:gravity="center"
android:id="#+id/jednostka"
android:layout_width="0dp"
android:layout_height="match_parent"
android:text="JM"
android:layout_weight="15" />
<TextView
android:textSize="12sp"
android:gravity="center"
android:id="#+id/cenaNetto"
android:layout_width="0dp"
android:layout_height="match_parent"
android:text="C. net."
android:layout_weight="15" />
<TextView
android:textSize="12sp"
android:gravity="center"
android:id="#+id/wartNetto"
android:layout_width="0dp"
android:layout_height="match_parent"
android:text="W.net."
android:layout_weight="15" />
<TextView
android:textSize="12sp"
android:gravity="center"
android:id="#+id/wartVAT"
android:layout_width="0dp"
android:layout_height="match_parent"
android:text="VAT"
android:layout_weight="10" />
<TextView
android:textSize="12sp"
android:gravity="center"
android:id="#+id/wartBrutto"
android:layout_width="0dp"
android:layout_height="match_parent"
android:text="W. brut."
android:layout_weight="15" />
</android.support.v7.widget.LinearLayoutCompat>
Here is a print screen of what breaks in my app link
Please try below link code as a demo I hope you will get your result.
Here is the code:
<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#ffffff"
android:shrinkColumns="*"
android:stretchColumns="*">
<TableRow
android:id="#+id/tableRow1"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:id="#+id/row_my_booking_unit_name"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center">
</TextView>
<TextView
android:id="#+id/row_my_booking_unit_quantity"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center">
</TextView>
<TextView
android:id="#+id/row_my_booking_unit_amount"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center">
</TextView>
</LinearLayout>
</TableRow>
</TableLayout>
Did you tried this in your TextView?
android:ellipsize="end"
android:maxLines="1"
If you want each textview to occupy same space then you can assign layout_weight=1 for all.

layout_weight: Text is not displayed

I was trying to make an interface that allows horizontal texts to be equally space, using layout_weight for responsiveness
So, I tried the code below
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center_vertical"
android:background="#android:color/darker_gray">
<TextView
android:gravity="center"
android:text="Guest List"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="24sp"
android:background="#android:color/holo_blue_bright"/>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/white">
<TextView
android:text="Kunal"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:textSize="24sp"/>
<TextView
android:text="Darling"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:textSize="24sp"/>
<TextView
android:text="Shocker"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:textSize="24sp"/>
</LinearLayout>
However, all the texts disappear.
So, could anyone please kindly explain to me what happened and how to fix this problem?
Try this,
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/darker_gray"
android:gravity="center_vertical"
android:orientation="vertical" >
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/holo_blue_bright"
android:gravity="center"
android:text="Guest List"
android:textSize="24sp" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/white"
android:orientation="horizontal" >
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Kunal"
android:textSize="24sp" />
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Darling"
android:textSize="24sp" />
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Shocker"
android:textSize="24sp" />
</LinearLayout>
</LinearLayout>
Using a white background color in the second LinearLayout, you may be trying to see white on white text.
I'd try to add to the TextViews something along:
android:textColor="#android:color/black"

Placing elements in layout file

I want to design a screen as below, I am trying to display the TOTAL and other data next to it.I am not getting how to display it exactly in the screen.
the layout file is
<LinearLayout android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<ListView android:id="#+id/listView"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:divider="#00000000"
android:dividerHeight="5dp"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Total"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="20dp"
android:textColor="#000000"
android:text="Comment" />
<EditText
android:id="#+id/editText2"
android:layout_width="300dp"
android:layout_height="wrap_content"
android:layout_margin="2dp"
android:ems="10"
android:hint="Comment goes here"
android:inputType="textMultiLine" />
</LinearLayout>
I want to display GT, FSP, DIS % and Discount as shown in image
You can use a TableLayout to display your GT,FSP ,DIS % and Discount TextView, and place this TableLayout in a LinearLayout (with horizontal orientation) with your Total TextView, like :
<LinearLayout android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Total"/>
<TableLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TableRow
android:id="#+id/tableRow1"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="GT :"/>
<TextView
android:id="#+id/tv_gt"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="54000"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Dis % :"/>
<TextView
android:id="#+id/tv_dis"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="29.15"/>
</TableRow>
<TableRow
android:id="#+id/tableRow2"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="FSP :"/>
<TextView
android:id="#+id/tv_fsp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="1480000"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Discount :"/>
<TextView
android:id="#+id/tv_discount"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="999999"/>
</TableRow>
</TableLayout>
</LinearLayout>
You can add this code as a separate layout and include it in main layout file or use directly in main layout.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:orientation="horizontal">
<TextView
android:text="TOTAL"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center" />
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:gravity="center"
android:text="GT : 5400000"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<TextView
android:gravity="center"
android:text="FSP : 1480000"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
<LinearLayout
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:gravity="center"
android:text="DIS% : 29.15%"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<TextView
android:gravity="center"
android:text="Discount : 9999999"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
Its looks like this:
You can update the inner TextViews to LinearLayout/RelativeLayout if you also need to show the pop-up cloud images.
To keep complexity at minimum just use the text like "GT : GT_VALUE" in strings.xml and then setText(getString(text_id).replace("GT_VALUE",value))

Textview not showing

I have a linearlayout and a textview inside another linearlayout. The linearlayout from inside is displayed, but the problem is that the last textview is not. Why?
<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" >
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:padding="10dp"
android:text="Scrie un cuvant" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center_horizontal"
android:orientation="horizontal" >
<EditText
android:id="#+id/cuvant"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:hint="#string/cuvant_hint"
android:inputType="text" />
<Button
android:id="#+id/cuvantbutton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/cuvantbutton_text" />
</LinearLayout>
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:padding="10dp"
android:text="Sau random" />
</LinearLayout>
Have a look here,
Your LinearLayout has height-attribute fill_parent. Change to wrap_content.
You are actually telling LinearLayout to capture all available space, which is causing you last textview not showing. Instead use "wrap_content" which tells to capture space required to show the available content.
<?xml version="1.0" encoding="utf-8"?>
<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" >
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:padding="10dp"
android:text="Scrie un cuvant" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:orientation="horizontal" >
<EditText
android:id="#+id/cuvant"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:hint="#string/cuvant_hint"
android:inputType="text" />
<Button
android:id="#+id/cuvantbutton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/cuvantbutton_text" />
</LinearLayout>
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:padding="10dp"
android:text="Sau random" />
</LinearLayout>
Check the layout_height of internal LinearLayout from match_parent to wrap_content
your innerLayout height is match_parent because of which your last textview was not visible
<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" >
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:padding="10dp"
android:text="Scrie un cuvant" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" <<---- Change it to wrap_Content from match_parent
android:gravity="center_horizontal"
android:orientation="horizontal" >
<EditText
android:id="#+id/cuvant"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:hint="#string/cuvant_hint"
android:inputType="text" />
<Button
android:id="#+id/cuvantbutton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/cuvantbutton_text" />
</LinearLayout>
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:padding="10dp"
android:text="Sau random" />
</LinearLayout>
The parent layout must cover the textview, to get text in it.
The layout with problem,which does not diplay text-----------
<LinearLayout
android:layout_width="80dp"
android:layout_height="80dp"
android:orientation="horizontal">
<ImageView
android:layout_width="80dp"
android:layout_height="80dp"
android:src="#drawable/Crime">
</ImageView>
<LinearLayout
android:layout_width="330dp"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:id="#+id/textView2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="God Father"
android:textSize="30dp"
android:textStyle="bold" />
<TextView
android:id="#+id/textView4"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Crime Drama"
android:textSize="30dp"
android:textStyle="bold" />
</LinearLayout>
</LinearLayout>
After changing the size of parent layout, which covers the textview.
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageView
android:layout_width="80dp"
android:layout_height="80dp"
android:src="#drawable/Crime">
</ImageView>
<LinearLayout
android:layout_width="330dp"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:id="#+id/textView2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="God Father"
android:textSize="30dp"
android:textStyle="bold" />
<TextView
android:id="#+id/textView4"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Crime Drama"
android:textSize="30dp"
android:textStyle="bold" />
</LinearLayout>

Edittext with Drawable background does not wrap it's contents

I am writing a chat application for learning Android programming in witch I will show the conversations between to users by a list. Any item of conversation list is a set of objects and a EditText with a bubble background. But when I show the conversation the EditText does not wrap it's content and the size of EditText is same in all rows of conversation.
Here is my conversation item's code:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/llmain"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:orientation="vertical"
tools:ignore="UseCompoundDrawables" >
<TextView
android:id="#+id/txtTime"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/chatdate"
android:gravity="center"
android:textAlignment="gravity"
android:textSize="8sp" />
<ScrollView
android:id="#+id/scrollView2"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<LinearLayout
android:id="#+id/llTo"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/chatme"
android:gravity="top|right"
android:paddingTop="7dp"
android:textAlignment="gravity"
android:visibility="visible" >
<ImageView
android:id="#+id/imgStatusTo"
android:layout_width="20dp"
android:layout_height="20dp"
android:layout_gravity="bottom"
android:layout_marginBottom="10dp"
android:layout_marginLeft="10dp"
android:scaleType="fitXY"
android:src="#drawable/wait_ic" />
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.82"
android:orientation="vertical" >
<ImageView
android:id="#+id/imgChatConversationToFile"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:scaleType="fitCenter"
android:src="#drawable/ic_info" />
<TextView
android:id="#+id/txtChatConversationTo"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="5dp"
android:layout_marginLeft="60dp"
android:autoLink="web"
android:background="#color/chatme"
android:drawableBottom="#color/jigari"
android:drawableLeft="#color/jigari"
android:drawableRight="#color/jigari"
android:drawableTop="#color/jigari"
android:gravity="right|top"
android:inputType="none"
android:linksClickable="true"
android:paddingLeft="20dp"
android:paddingRight="40dp"
android:paddingTop="5dp"
android:scrollHorizontally="false"
android:scrollbars="none"
android:selectAllOnFocus="true"
android:singleLine="false"
android:textDirection="rtl" />
</LinearLayout>
<ImageView
android:id="#+id/imgChatConversationTo"
android:layout_width="32dp"
android:layout_height="32dp"
android:layout_gravity="bottom"
android:layout_marginBottom="5dp"
android:background="#color/gray"
android:contentDescription="#string/user_image"
android:scaleType="fitXY"
android:src="#drawable/ic_user_image" />
</LinearLayout>
</LinearLayout>
</ScrollView>
<ScrollView
android:id="#+id/scrollView1"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<LinearLayout
android:id="#+id/llFrom"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/chatyou"
android:paddingTop="7dp"
android:visibility="visible" >
<ImageView
android:id="#+id/imgChatConversationFrom"
android:layout_width="32dp"
android:layout_height="32dp"
android:background="#color/gray"
android:contentDescription="#string/user_image"
android:scaleType="fitXY"
android:src="#drawable/ic_user_image" />
<LinearLayout
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_weight="0.82"
android:orientation="vertical" >
<ImageView
android:id="#+id/imgChatConversationFromFile"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:scaleType="fitCenter"
android:src="#drawable/ic_info" />
<TextView
android:id="#+id/txtChatConversationFrom1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="5dp"
android:layout_marginRight="60dp"
android:autoLink="web"
android:background="#color/chatyou"
android:gravity="top|right"
android:inputType="none"
android:linksClickable="true"
android:paddingLeft="45dp"
android:paddingRight="20dp"
android:paddingTop="3dp"
android:scrollHorizontally="false"
android:scrollbars="none"
android:selectAllOnFocus="true"
android:singleLine="false"
android:textAlignment="gravity" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
</ScrollView>
</LinearLayout>
My problem is on txtConversationFrom and txtConversationTo.
At the code I will hide items that not required there.
How I can force EditText to wrap text and resize to fit text size?
Correct me if I'm wrong but if you're talking about EditText you mean TextView right?
And your problem is that the text displayed in the TextViews won't linebreak if they are too large to fit in?
If yes you should probably add this:
android:inputType="textMultiLine"
to your TextViews.
And probably set the width of your LinearView which contains the txtChatConversationTo TextView to:
android:width="wrap_content"

Categories

Resources