android listView minimize a gap between text and subtext - android

minimize the gap that I have between two TextViews (main text and subtext) that are in a linear layout and vertical. I tried to pad the subtext to the top, change the hight of the subtext and change the top margin but the gap remains, and I just get a row with an unnecessary hight. My XML is attached
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:padding="10dp">
<ImageView
android:id="#+id/imgIcon"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:scaleType="fitStart"
android:layout_marginTop="5dp"
android:layout_marginRight= "10dp"
android:gravity="center_vertical" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<TextView
android:id="#+id/txtTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:textColor="#000000"
android:textSize="20sp"
/>
<TextView
android:id="#+id/subString"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
</LinearLayout>
</LinearLayout>
this is a picture of what it should look like
but what I actually have is a big gap between IMDB and account

Your screenshot isn't showing up, but one thing you can try that's worked for me before is to set the bottom margin of your title and top margin of your subString to negative; i.e.
<TextView
android:id="#+id/txtTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginBottom="-10dp"
android:textColor="#000000"
android:textSize="20sp" />

Related

Android Layout : Height of Linear layout not enough

I am trying to design a layout in android which looks like following:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/linear"
android:layout_height="match_parent"
android:layout_width="match_parent" >
<LinearLayout
android:id="#+id/LinearLayout_bt"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:background="#drawable/sec_bluetooth_listview_background"
android:paddingTop="#*android:dimen/tw_preference_item_padding_top"
android:paddingBottom="#*android:dimen/tw_preference_item_padding_bottom"
android:orientation="vertical" >
<TextView
android:id="#+id/main_text"
android:textAppearance="?android:attr/textAppearanceListItem"
android:textColor="?android:attr/textColorPrimary"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:gravity="center"
android:singleLine="false"
android:text="#string/sec_bluetooth_no_devices_found"
android:ellipsize="none" />
<TextView
android:id="#+id/secondary_text"
style="#style/BluetoothNoItemHelpText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:gravity="start"
android:singleLine="false"
android:lineSpacingExtra="4sp"
android:ellipsize="none" />
</LinearLayout>
</LinearLayout>
But the problem is that it is not showing top padding but only bottom padding is working i.e. textview is showing in layout without top padding . I guess there is some problem in height of linear layout but I have set it to wrap-content. Is there any problem in my layout?
Try change your padding values for explicite dp. I changed it in your code and it works fine for me.
<LinearLayout
android:id="#+id/LinearLayout_bt"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:background="#color/textLight"
android:paddingTop="30dp"
android:paddingBottom="30dp"
android:orientation="vertical">
with top padding
and without

How to align a nested LinearLayout to top

I have a RelativeLayout within a LinearLayout and for some reason I can not get rid off the padding between the text and divider line of the first row.
How is it possible to align the Text / LinearLayout to the top?
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/file_row_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:gravity="top"
android:baselineAligned="false">
<ImageView
android:id="#+id/file_row_thumb"
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_weight="0"
android:paddingLeft="10dp"
android:paddingRight="10dp"
android:scaleType="fitStart" />
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="vertical">
<TextView
android:id="#+id/file_row_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="16dp" />
<TextView
android:id="#+id/file_row_desc"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="12dp" />
</LinearLayout>
<ImageButton
android:scaleType="fitStart"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_weight="0"
android:background="?android:selectableItemBackground"
android:onClick="showFilePopup"
android:src="#drawable/ic_more_vert" />
Studio preview shows dotted line. Is it responsible for the padding?
Add these 2 lines to your TextView:
android:height="16dp"
android:gravity="bottom|clip_vertical"
That will push the text to the top of it's view. If you want to have it actually touching the view above, you can reduce height.
Here are a couple of screenshots:
1st with height=16
And an exaggerated one with height=14
And here's a link to give you other various XML attributes for TextView
developer.android.com/reference/android/widget/TextView.html

How can I align a TextView to the far left and ImageView to the far right in an Actionbar Spinner?

I am trying to layout an actionbar spinner dropdown list. I have a textview and an imageview in each row. I want the textview to align to the far left of the dropdown (with the paddingLeft) and I want the imageview to align to the far right of the dropdown. The text in the textviews varies in length, so the icons end up being aligned to the immediate right of the textviews. This layout provides a two line item on the actionbar with the spinner title and selected item name.
Here is my current layout:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:orientation="vertical" >
<TextView
android:id="#+id/spinner_name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="14sp" />
<LinearLayout
android:id="#+id/item_row"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="-5dp"
android:orientation="horizontal" >
<TextView
android:id="#+id/item_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingLeft="5dp"
android:layout_weight="1"
android:gravity="left"
android:textSize="18sp" />
<ImageView
android:id="#+id/icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="right"
android:contentDescription="icon" />
</LinearLayout>
</LinearLayout>
I've tried a relative layout like below, with similar results (see screen shot). The bluetooth icon is a stand in for the yet to be created icon (same size):
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:orientation="vertical" >
<TextView
android:id="#+id/spinner_name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="14sp" />
<RelativeLayout
android:id="#+id/item_row"
android:layout_width="wrap_content"
android:layout_height="match_parent" >
<TextView
android:id="#+id/item_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:textSize="18sp" />
<ImageView
android:id="#+id/icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_toRightOf="#+id/item_name"
android:contentDescription="icon" />
</RelativeLayout>
Use a RelativeLayout instead of a LinearLayout, and use the alignParentLeft/Right attributes on your children to place them correctly.

ListView displaying problems

I have a listview that consists three columns. The first one is an ImageView, the second and third one are textviews (see code blow).
I want the list to be aligned like this:
the icon and the date should always been shown completely !!
the text in the middle should show as much chars as possible
the date should always be on the right of the right side
With the XML below it looks ok on my Nexus 4. But on the asus tablet the date should be more on the right and the coloumn in the middle should show more text (screenshot 1). On the AVD (screenshot 2) the coloumn in the middle should be smaller and the date should be shown completely.
Can anyone tell me how to change the XML? Thanks!
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:padding="5dp" >
<ImageView
android:id="#+id/logo"
android:layout_width="50px"
android:layout_height="50px"
android:layout_marginLeft="5px"
android:layout_marginRight="20px"
android:layout_marginTop="5px"
android:src="#drawable/social_chat"
android:layout_weight="0"
>
</ImageView>
<TextView
android:id="#+id/label"
android:layout_width="0px"
android:layout_height="fill_parent"
android:layout_marginTop="0px"
android:text="#+id/label"
android:textAppearance="?android:attr/textAppearanceLarge"
android:layout_weight="50"
android:maxLines="1"
android:singleLine="true"
>
</TextView>
<TextView
android:id="#+id/last_changed"
android:layout_width="0px"
android:layout_height="fill_parent"
android:layout_marginTop="15px"
android:layout_marginLeft="5px"
android:text="#+id/last_changed"
android:textAppearance="?android:attr/textAppearanceSmall"
android:layout_weight="50"
android:maxLines="1"
android:singleLine="true"
>
</TextView>
Off the top of my head your layout would look something like this.-
<?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:padding="5dp" >
<ImageView
android:id="#+id/logo"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_marginLeft="5dp"
android:layout_marginRight="20dp"
android:layout_marginTop="5dp"
android:src="#drawable/social_chat" />
<TextView
android:id="#+id/label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#+id/label"
android:textAppearance="?android:attr/textAppearanceLarge"
android:layout_weight="1"
android:singleLine="true" />
<TextView
android:id="#+id/last_changed"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="15dp"
android:layout_marginLeft="5dp"
android:text="#+id/last_changed"
android:textAppearance="?android:attr/textAppearanceSmall"
android:singleLine="true" />
</LinearLayout>
The key here is to use wrap_content for the views that just need to keep their size, and set a weight for the middle view, which you want to fill the rest of the row.
Some useful tips.-
fill_parent is deprecated, use match_parent instead
When a view has no children, you can just close it with />
singleLine="true" is enough to have a singleLined TextView
You'll usually want to use dp units instead of px
This should do your job. I have put the imageview on the parents left, the date on the parents right and the label to the rightof image and to the left of date.It should work fine for you. Margins , padding please put yourself
<?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" >
<ImageView
android:id="#+id/logo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:src="#drawable/social_chat" />
<TextView
android:id="#+id/last_changed"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:singleLine="true" />
<TextView
android:id="#+id/label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge"
android:layout_toLeftOf="#id/last_changed"
android:layout_toRightOf="#id/logo"
android:singleLine="true" />
</RelativeLayout>

Why is there extra padding on the bottom of my row?

I have the following layout. This defines a row in my ListView. I noticed that the text is not centered in the row. There seems to be extra bottom padding. How can I make the text appear in the center, vertically, so there is no padding?
<?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="fill_parent" android:background="#drawable/stocks_gradient">
<TextView
android:id="#+id/nameText"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:text="Symbol" android:textStyle="bold" android:textSize="24sp" android:layout_width="100dp" android:textColor="#4871A8" android:paddingLeft="5dp"/>
<TextView
android:id="#+id/priceText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#+id/nameText"
android:gravity="right"
android:text="100" android:textStyle="bold" android:textSize="24sp" android:textColor="#4871A8"/>
<TextView
android:id="#+id/changeText"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_toRightOf="#+id/priceText"
android:gravity="right"
android:textSize="18sp" android:text="3.07(+1.08%)" android:padding="7dip"/>
</RelativeLayout>
Did you try setting the layout_gravity to center_vertical?
Also, you may have a reason for doing so, but the layout you show would be much simpler as a horizontal LinearLayout. There is no need for a RelativeLayout here.

Categories

Resources