I'm creating one table layout with text view and spinner.
My textview content is too large, so it's wrapped up in my layout. Whenever the textview having wrapped, the same row spinner also increased the height.
My code is,
<TableRow
android:id="#+id/trConfigPeriodStop"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:weightSum="1" >
<TextView
android:id="#+id/tvConfigPeriodStop"
android:text="Periodic reporting interval while moving"
android:layout_weight="0.5"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:textColor="#color/gpsblue"
android:layout_marginLeft="5dp" />
<Spinner
android:id="#+id/spnConfigPeriodStop"
android:layout_weight="0.5"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:entries="#array/periodstop_arrays"
android:prompt="#string/periodstop_prompt"
/>
</TableRow>
Suppose I'm changing the layout height in wrap_content in spinner, that time my text view text also hide from view.
How to solve this issue?
Please do the needful.
Thanks in advance.
Try setting layout height as wrap_content for both Spinner and TextView.
Try this :
<TableRow xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/trConfigPeriodStop"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:textColor="#color/gpsblue"
android:weightSum="1" >
<TextView
android:id="#+id/tvConfigPeriodStop"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_marginLeft="5dp"
android:layout_weight="0.5"
android:text="Periodic reporting interval while moving" />
<Spinner
android:id="#+id/spnConfigPeriodStop"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_weight="0.5"
android:entries="#array/periodstop_arrays"
android:prompt="#string/periodstop_prompt" />
</TableRow>
i guess it is because tablerow has android:layout_height="wrap_content" and inner textview has android:layout_height="fill_parent", so the height of the tablerow will fit to the height of the spinner, that is the only child with fixed and independent height while rendering.
you will solve it if you change TextView's height also to android:layout_height="wrap_content"
Related
Following is my .xml file
<?xml version="1.0" encoding="utf-8"?>
<TableRow xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/tableRow1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:gravity="center_vertical" >
...
<TextView
android:id="#+id/tvAlternateRoad"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="#dimen/fancy_dashboard_max_speed_circle_strock_size"
android:gravity="start"
android:text="Via A11"
android:lines="1"
android:textColor="#808080"
android:textSize="#dimen/fancy_dashboard_lable_size" />
</TableRow>
I am calling the above .xml file in my main view .xml as following,
<RelativeLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.85"
android:gravity="end"
android:orientation="horizontal" >
<TableLayout
android:id="#+id/layAlternateRoute"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_margin="#dimen/fancy_dashboard_max_speed_circle_strock_size"
android:background="#drawable/bg_round_rect_alternate_route" />
</RelativeLayout>
http://i.stack.imgur.com/a0KRs.png
I am displaying a view on the screen which has above TableRow element. I am setting this Textview tvAlternateRoad's text value at run time. Sometimes when Text is large then it is moving outside the view. I tried to truncate it using android:ellipsize="end" from some S.O. posts but it seems it is not working now a days.
Can somebody help me on this?
Give paddingRight to text view. Also, text view has width wrap content and no relation with any other view. So your text view width can exceed the rounded corner background image as per text length. So either give some maxWidth value or relate it to some other views.
Edit
I just made this xml:
<?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="match_parent"
android:orientation="vertical" >
<TextView
android:id="#+id/textview_Statu"
style="#style/text_view_login_style"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/more_txt3_margin_t"
android:background="#android:color/white"
android:ellipsize="end"
android:singleLine="true"
android:text="1234567890qwertyuiopasdfghjklzxcvbnm"
android:textColor="#color/blue_end" />
</LinearLayout>
In graphical view, It looks like this
Its working fine.
I have noticed that TextView will do different things with respect to wrapping and truncating depending on the container it's in. Try having the TableRow cell be, for instance, a FrameLayout. Then put your TextView inside the FrameLayout and see what happens.
Just use:
android:singleLine="true" and android:ellipsize="end"
and set a fixed width for your textview like "match_parent" or something in dp like "180dp" etc.
singleLine="true" needs your textview to have a fixed width which is not provided by "wrap_content".
A textview will only show ellipses at the end of its view's bounds and since you have set "wrap_content" your textview does not have any fixed bounds.
try this
tablelayout should be
<TableLayout
android:id="#+id/tbl"
android:layout_height="wrap_content"
android:layout_width="match_parent"
>
the remaining part should be
<TableRow
android:layout_height="wrap_content"
android:layout_width="match_parent"
>
<TextView
android:id="#+id/tvAlternateRoad"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:ellipsize="end"
android:maxLines="1"
android:minLines="1"
android:layout_marginRight="#dimen/fancy_dashboard_max_speed_circle_strock_size"
android:gravity="start"
android:text="Via A11"
android:layout_weight="1"
android:textColor="#808080"
android:textSize="#dimen/fancy_dashboard_lable_size" />
Ok, after long effort I have solve the issue my self.
Logic:
fetch the screen size programmatically
int screen_width = context.getResources().getDisplayMetrics().widthPixels;
then I used 42% of the screen_width as maxwidth of textView
((TextView)alternate.findViewById(R.id.tvAlternateRoad)).setMaxWidth((int)(screen_width*0.42));
I have also set below values in xml
android:ellipsize="marquee"
android:maxLines="1"
I'm working on an app where my xml looks a bit like this:
<TableRow
android:layout_width="match_parent"
android:layout_height="fill_parent">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/receiver_name"
android:layout_weight="1" />
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="3"
android:maxLength="30"
android:maxLines="1" />
</TableRow>
What I want, is that no matter what device you have, the TextView should take up 1/4th of the width, and the EditText should take up 3/4ths of the width.
As it is now, the code works - until you start typing. The EditText gets wider and wider as you type more and more into it. How do I make it so that my EditText stays the same width that is assigned to it by the layout_weight parameters?
you should use LinearLayout like that :
<LinearLayout
android:layout_width="match_parent"
android:layout_height="fill_parent">
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="#string/receiver_name"
android:layout_weight="1" />
<EditText
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="3"
android:maxLength="30"
android:maxLines="1" />
</LinearLayout>
hope that can help you =)
Just like Janoub said you could use the LinearLayout and weights value.
http://developer.android.com/guide/topics/ui/layout/linear.html
But you can also use table layout with 4 columns so your edittext catches 3 columns and the textview 1.
http://www.compiletimeerror.com/2013/07/android-tablelayout-example.html
Does anybody know why my table row height increases when I remove the background property of containing EditText?
<TableLayout
android:id="#+id/tableLayout1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:stretchColumns="1,3" >
<TableRow
android:id="#+id/tr3a"
android:padding="2.5dp"
android:background="#color/col1"
android:gravity="center_vertical"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1" >
<TextView
android:id="#+id/lab_bookname"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/bookname" />
<EditText
android:id="#+id/bookname"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_span="3"
android:textSize="14sp"
android:background="#color/white" // FOR VIEW 1, I REMOVE THIS LINE, NO OTHER CHANGE
android:hint="#string/definputtext2" />
</TableRow>
Height changes because by setting a custom background you are replacing the EditText default background, which might not be just a color resource.
Check these similar questions:
Problem with EditText background (android)
EditText dimensions change if I use color as a background?
Here's the layout (below). I'm trying to reposition the location of the checkbox; move it to the right of the view. android:gravity and android:layout_gravity seem to have no effect. Any explanation? This LinearLayout is a child of a Relative Layout.
<LinearLayout
android:id="#+id/deviceLinear"
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:layout_below="#id/view1" >
<ImageView
android:contentDescription="#string/devices_icon"
android:id="#+id/devices_img"
android:layout_width="0dip"
android:layout_height="match_parent"
android:layout_weight="0.15"
android:layout_gravity="center"
android:src="#drawable/hardware_phone" />
<TextView
android:id="#+id/devices"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="0.43"
android:text="#string/devices"
android:textSize="20sp" />
<CheckBox
android:id="#+id/check_devices"
android:button="#drawable/custom_checkbox"
android:layout_width="0dip"
android:layout_height="fill_parent"
android:layout_weight="0.42"
android:onClick="onCheckboxClicked" />
</LinearLayout>
I assume that you want the CheckBox to be on the right side of the LinearLayout. Since you have given it a layout_weight it will always take up some fixed percentage of the width regardless of its size as you can see by that blue bounding box.
Try wrapping the checkbox in another LinearLayout that has android:orientation='horizontal'. Give the 0.42 weight to the wrapping LinearLayout and then set the LinearLayout's android:gravity to be right. That should keep your spacing while moving the checkbox to the far right.
Something like this:
<LinearLayout
android:orientation="horizontal"
android:layout_width="0dp"
android:layout_weight="0.42"
android:layout_height="wrap_content"
android:gravity="right" />
<CheckBox
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
You might also want to consider a RelativeLayout which enables you to position Views based on where other views are.
You are giving layout_weight="0.42" to your checkbox, that means that it will be measured with a width based on the LinearLayout's width. By this approach you will never manage to put it on the right.
The best way to achieve your goal is to use a RelativeLayout. Here is my list item layout with a checkbox on the right. Sorry about the merge tag but it is merged inside a RelativeLayout with
android:layout_width="match_parent"
android:layout_height="wrap_content"
attributes
<?xml version="1.0" encoding="utf-8"?>
<merge xmlns:android="http://schemas.android.com/apk/res/android">
<ImageView android:id="#+id/imgChannelIcon"
android:layout_alignParentLeft="true"
style="?muListItemImage60x60" />
<CheckBox android:id="#+id/chkIsChecked"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_alignTop="#+id/imgChannelIcon"
android:layout_alignParentRight="true"
android:layout_alignBottom="#+id/imgChannelIcon"
android:layout_marginLeft="#dimen/list_item_checkbox_margin_left"
android:layout_marginRight="#dimen/list_item_checkbox_margin_right"
android:layout_marginTop="#dimen/list_item_checkbox_margin_top"
android:layout_marginBottom="#dimen/list_item_checkbox_margin_bottom"
android:focusable="false"
android:focusableInTouchMode="false" />
<TextView android:id="#+id/lblChannelTitle"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_toRightOf="#+id/imgChannelIcon"
android:layout_alignTop="#+id/imgChannelIcon"
android:layout_toLeftOf="#+id/chkIsChecked"
android:layout_alignWithParentIfMissing="true"
android:includeFontPadding="false"
android:textStyle="bold"
android:text="#string/channel_item_dummy_title"
style="?muListItemTextBig" />
<TextView android:id="#+id/lblChannelSubtitle"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_toRightOf="#+id/imgChannelIcon"
android:layout_below="#+id/lblChannelTitle"
android:layout_toLeftOf="#+id/chkIsChecked"
android:layout_alignWithParentIfMissing="true"
android:includeFontPadding="false"
android:textStyle="normal"
android:text="#string/channel_item_dummy_subtitle"
style="?muListItemTextNormal" />
<TextView android:id="#+id/lblChannelCategory"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_toRightOf="#+id/imgChannelIcon"
android:layout_below="#+id/lblChannelSubtitle"
android:layout_alignBottom="#+id/imgChannelIcon"
android:layout_toLeftOf="#+id/chkIsChecked"
android:layout_alignWithParentIfMissing="true"
android:includeFontPadding="false"
android:paddingLeft="3dp"
android:gravity="center_vertical|left"
android:textStyle="italic"
android:text="#string/channel_item_dummy_category"
style="?muListItemTextNormal_Inverse" />
<TextView android:id="#+id/lblChannelUpdate"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_below="#+id/imgChannelIcon"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:includeFontPadding="false"
android:paddingTop="3dp"
android:paddingBottom="3dp"
android:textStyle="italic"
android:text="#string/channel_item_dummy_update"
style="?muListItemTextTiny" />
</merge>
As you can see I first place an image with layout_alignParentLeft="true" then the checkbox with layout_alignParentRight="true" and finally I arrange the other components based on those two. From your image I can see that you can use your devices_img as the left component (but you will have to give it a fixed height and maybe some margins in order to became the Layout's height) and your check box as your right.
Keep in mind that in a RelativeLayout with wrap_content as height you cannot use the AlignParentBottom attribute.
Hope this helps...
i have defined weightsum for one 1 tablerow and layout_weight. this is what i am doing
<TableRow
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:weightSum="1" >
<TextView
android:id="#+id/add"
android:layout_width="fill_parent"
android:layout_height="45dp"
android:layout_weight="0.2"
android:text="#string/restaurant_add"
android:textStyle="bold" />
<TextView
android:id="#+id/Restaurant_add"
android:layout_width="fill_parent"
android:layout_height="45dp"
android:layout_weight="0.8"
android:clickable="true" />
</TableRow>
i am filling the data to Restaurant_add dynamically.. but when i fill the data to Restauant_add, even though i have set the layout_weight to 0.8, it is overriding the data present in android:text="#string/restaurant_add".
what is the mistake i am doing?
Thanks:)
Can you try to set android:layout_width="0dp" to your two TextView ?
Also, your TextView's id Restaurant_add is the same as your string #string/restaurant_add. Make sure that you modify the layout and not your string !
Set both your android:layout_widths to "0dp".