Adding margins within a fragment - android

In my application, I am using fragments. The problem is I am not able to set margin for each item in the list inside TitlesFragment extends ListFragment. Also I have to add margin to my complete set of data shown inside DetailsFragment extends Fragment. How can this be done? Please help me out. Thanks in advance.
Please see my xml:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:background="#drawable/bg"
android:orientation="vertical" >
<ListView
android:id="#+id/list_view"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:cacheColorHint="#00000000"
android:divider="#android:color/transparent"
android:dividerHeight="10dp"
android:scrollbars="none"
android:smoothScrollbar="true" >
</ListView>

ListViews (along with Fragments, ListFragments, etc) appear to override the provided layout's root parameters (height, width), in order to fit the predefined View/Item dimensions into the parent. This also seems to happen with each of the layout's children Maximum dimensions, for instance, the TextView from AOSP's simple_list_item_1.xml
Since you are asking specifically for ListView item spacing, I would still not use dividerHeight as suggested by blackbelt, as this would change the centering of your original content (also the first item would not have the desired spacing from the top of the list, as the divider is below each item).
For ListView items, you can generally override this behavior by setting a custom layout (called by a custom adapter) with a top and bottom margin. See the following sample based simple_list_item_1.xml and note the margin modifiers at the end:
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#android:id/text1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceListItemSmall"
android:gravity="center_vertical"
android:paddingStart="?android:attr/listPreferredItemPaddingStart"
android:paddingEnd="?android:attr/listPreferredItemPaddingEnd"
android:minHeight="?android:attr/listPreferredItemHeightSmall"
android:layout_marginTop="20dp"
android:layout_marginBottom="20dp"
/>
(you might need to provide inline values for non-public references to "?android:attr")
You would then have to call a custom adapter for your list (such as ArrayAdapter) and supply it with your custom list item XML.

You have to set the divider and the dividerHeight properties in your layout.xml file.
For instance
<ListView
android:id="#android:id/list"
android:divider="#android:color/transparent"
android:dividerHeight="5dip" />
in this way you will get all elements of the ListFragment spaced by 5 dip

Related

Remove left space between ListView border and Items

Can somebody tell me how can I remove the space between the listview border and the items inside the listview?
Remove margins from your xml listview layout.
If I understand your question properly, you are not looking for removing space between listview border and items (The red sign on your image says that! you want to remove space between two elements inside 1 item). If that is true, then you have to go to the custom layout file you created to set as a row for the listview. It looks like you have 2 TextViews there ("Go" and "Bro1, Bro2......"). There you have to play with the Margin-Up and Margin-Bottom of these 2 textviews.
android:layout_marginBottom="1dp"
android:layout_marginUp="1dp"
If you mean the space around the listview then either check the margins of the listview or paddings of the parent layout of the listview.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="0dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:padding="0dp">
<ListView
android:id="#android:id/list"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="0dp" />
</LinearLayout>
</RelativeLayout>

Edit Text and Text View not visible when ListView is set in Android

here my xml layout of my Android app (where I show all of my contacts)
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TextView
android:id="#+id/android:empty"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="5dip"
android:layout_marginTop="5dip"
android:text="Scegli il contatto:"
/>
<EditText
android:id="#+id/editTextSend"
android:layout_width="fill_parent"
android:layout_height="wrap_content"/>
<ListView
android:id="#+id/android:list"
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
</ListView>
</LinearLayout>
I fill ListView using a custom Adapter.
But textView and Edit Text are not visibile. I want to show in particular edit text where users can write initial letters of his contacts name)
Suggestions to get them visible?
I fill ListView ... But textView and Edit Text are not visibile.
If you can only see a ListView then it appears you're using a ListActivity and forgot to call setContentView(). So you aren't actually using your layout... you only see ListActivity's default ListView.
That said, your XML code will work, but here are some quick notes:
As I stated in my comment, the TextView might be hidden depending on what type of Activity or Fragment you are using:
A ListActivity will automatically bind the #+id/android:empty and #+id/android:list Views, so the "empty" TextView is only shown when the ListView is empty.
An Activity won't recognize #+id/android:empty on its own. All the Views should be visible.
fill_parent is deprecated, simply use match_parent
Setting a ListView's height to wrap_content forces the Adapter to draw the ListView multiple times... with your layout I recommend using match_parent.
I'd say it is visible pretty fine with your layout. But anyway, I'd make listview declared that way:
<ListView
android:id="#+id/android:list"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1" >
so it will take all the remaining free space

ListView scrollbarStyle with margin/padding

Hopefully a simple one.
v4.0.3
I have a ListView and want to leave a margin of 10dip right and left.
The content is easy of course, but I want the divider line to have a 10dip margin right and left too.
If I add android:PaddingRight or android:layout_marginRight to the ListView or the LinearLayout which contains the ListView then this works of course, but the List scrollbar which appears down the right hand side as you scroll the list also moves in by the padding/margin distance.
I want the scrollbar indicator to remain.
I've tried all the android:scrollbarStylesettings.
Can do easily
<ListView
android:id="#+id/lvDonorDetails"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:divider="#drawable/list_divider"
android:dividerHeight="1dp"
android:paddingLeft="10dp"
android:paddingRight="10dp"
android:scrollbarStyle="outsideInset"/>
Or
<ListView
android:id="#+id/lvDonorDetails"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:dividerHeight="1dp"
android:padding="10dp"
android:scrollbarStyle="outsideInset"/>
You may create new scrollbar thumb drawable what do you want about scroll drawable margin and padding.
Use these attr
android:scrollbarThumbHorizontal="#drawable/your_drawable"
android:scrollbarThumbVertical="#drawable/your_drawable"
I had the same problem of scrolling the list view. putting inside a scroll view is limiting the list view to load only one row when we want to load the list dynamically,but at last got the solution :
include
android:scrollbarAlwaysDrawVerticalTrack= "true"
and
android:fadeScrollbars="false"
properties inside the ListView Tag.
To have an equal margins (around and between) ListView items without having the scrollbar overlaying the ListView items, you can use the following code:
<ListView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/listView"
android:layout_gravity="center_horizontal|top"
android:dividerHeight="10dp"
android:divider="#android:color/transparent"
android:padding="10dp"
android:scrollbarStyle="outsideOverlay"/>

linearlayout doesn't show all childs

I have problem in this layout that : it doesn't show any child after the listView
and the listview is filling this sight ; it scrolls but didn't show the any other child
I have tried to user ScrollView but it make issues with expandlist
this is layout xml code:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#drawable/select_bg"
android:orientation="vertical" >
<TextView
android:id="#+id/Header"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#drawable/header_bg"
android:gravity="center"
android:paddingRight="50dip"
android:paddingTop="5dip"
android:text="#string/select"
android:textColor="#60240a"
android:textSize="18dip"
android:textStyle="bold" >
</TextView>
<ListView
android:id="#+id/listView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:cacheColorHint="#android:color/transparent"
android:divider="#drawable/line_divider"
android:dividerHeight="3dip"
android:listSelector="#android:color/transparent" >
</ListView>
<ImageView
android:layout_width="fill_parent"
android:layout_height="3dip"
android:src="#drawable/line_divider" />
<ExpandableListView
android:id="#+id/expandableList"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:cacheColorHint="#android:color/transparent"
android:childDivider="#drawable/line_divider"
android:divider="#drawable/line_divider"
android:dividerHeight="2dip"
android:listSelector="#android:color/transparent"
android:textColor="#60240a" >
</ExpandableListView>
</LinearLayout>
When you are using ListView in the layout you have to add this property android:layout_weight for the listview. Without this property being set, you cannot get all views.
Since your layout is linear any views that exceeds the limit of the screen are not displayed in the screen. Yes scrollview makes issues with list or expandable listview as the scrollview itself is scrollable it will consume the scrolls of listview and expandablelist. To resolve this you have to re order or change your layouts to make your rest of the views visible
Give the first ListView some constant height. Like
<ListView
android:id="#+id/listView"
android:layout_width="match_parent"
android:layout_height="300dip"
....
/>
LinearLayout will not scroll when its content increases. And you cannot use a ScrollView as parent for ListView.
Set all layout_height - attributes from direct childs of your root layout to fill_parent.
Than give every of these layouts a attribute layout_weight.
The value of layout_weight is an integer according to how many space they've been granted in the view.
For example two views: one with weight 2 and one with weight 1: The weight 1 is twice the size of weight 2.
Just play a little with the weight attribute to find out for yourself.
You have given height of listview as wrap_content so it will occupy the all the space in screen so u give the height of listview fixed and same thing applied to expandable list also give fix height to that also.
Hope u get it All The best

How to set space between listView Items in Android

I tried to use marginBottom on the listView to make space between listView Item, but still the items are attached together.
Is it even possible? If yes, is there a specific way to do it?
My code is below
<LinearLayout
android:id="#+id/alarm_occurences"
android:layout_width="fill_parent"
android:orientation="vertical"
android:layout_height="fill_parent"
android:background="#EEEEFF"
xmlns:android="http://schemas.android.com/apk/res/android">
<ListView
android:id="#+id/occurences"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
/>
</LinearLayout>
My custom List item:
<com.android.alarm.listItems.AlarmListItem
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#drawable/alarm_item_background"
android:layout_marginBottom="10dp"
>
<CheckedTextView
android:id="#android:id/text1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:checkMark="?android:attr/listChoiceIndicatorMultiple"
android:textSize="20sp"
android:textStyle="bold"
android:typeface="serif"
android:padding="10dp"
/>
</com.android.alarm.listItems.AlarmListItem>
How can I make spacing between list items in this case?
#Asahi pretty much hit the nail on the head, but I just wanted to add a bit of XML for anyone maybe floating in here later via google:
<ListView android:id="#+id/MyListView"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:divider="#android:color/transparent"
android:dividerHeight="10.0sp"/>
For some reason, values such as "10", "10.0", and "10sp" all are rejected by Android for the dividerHeight value. It wants a floating point number and a unit, such as "10.0sp". As #Goofyahead notes, you can also use display-independent pixels for this value (ie, "10dp").
Perhaps divider or dividerHeight property of the ListView can solve your problem.
Although the solution by Nik Reiman DOES work, I found it not to be an optimal solution for what I wanted to do. Using the divider to set the margins had the problem that the divider will no longer be visible so you can not use it to show a clear boundary between your items. Also, it does not add more "clickable area" to each item thus if you want to make your items clickable and your items are thin, it will be very hard for anyone to click on an item as the height added by the divider is not part of an item.
Fortunately I found a better solution that allows you to both show dividers and allows you to adjust the height of each item using not margins but padding. Here is an example:
ListView
<ListView
android:id="#+id/listView"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
/>
ListItem
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="10dp"
android:paddingTop="10dp" >
<TextView
android:id="#+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:text="Item"
android:textAppearance="?android:attr/textAppearanceSmall" />
</RelativeLayout>
You should wrap your ListView item (say your_listview_item) in some other layout e.g LinearLayout and add margin to your_listview_item:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<your_listview_item
android:id="#+id/list_item"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="5dp"
android:layout_marginBottom="5dp"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
...
...
/>
</LinearLayout>
This way you can also add space, if needed, on the right and left of the ListView item.
My solution to add more space but keep the horizontal line was to add divider.xml in the res/drawable folder and define line shape inside:
divider.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="line" >
<stroke
android:width="1px"
android:color="#color/nice_blue" />
</shape>
then in my list I reference my divider as follows:
<ListView
android:id="#+id/listViewScheduledReminders"
android:layout_width="match_parent"
android:layout_height="0dip"
android:layout_marginBottom="#dimen/mediumMargin"
android:layout_weight="1"
android:divider="#drawable/divider"
android:dividerHeight="16.0dp"
android:padding="#dimen/smallMargin" >
</ListView>
notice the android:dividerHeight="16.0dp" by increasing and decreasing this height I am basically adding more padding on top and bottom of the divider line.
I used this page for reference: http://developer.android.com/guide/topics/resources/drawable-resource.html#stroke-element
For my application, i have done this way
<ListView
android:id="#+id/staff_jobassigned_listview"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:divider="#null"
android:dividerHeight="10dp">
</ListView>
just set the divider to null and providing height to the divider did for me.
Example :
android:divider="#null"
or
android:divider="#android:color/transparent"
and this is result
If you want to show a divider with margins and without stretching it - use InsetDrawable (size must be in a format, about which said #Nik Reiman):
ListView:
<ListView
android:id="#+id/listView"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:cacheColorHint="#00000000"
android:divider="#drawable/separator_line"
android:dividerHeight="10.0px"/>
#drawable/separator_line:
<?xml version="1.0" encoding="utf-8"?>
<inset xmlns:android="http://schemas.android.com/apk/res/android"
android:insetLeft="5.0px"
android:insetRight="5.0px"
android:insetTop="8.0px"
android:insetBottom="8.0px">
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<gradient
android:startColor="#color/colorStart"
android:centerColor="#color/colorCenter"
android:endColor="#color/colorEnd"
android:type="linear"
android:angle="0">
</gradient>
</shape>
</inset>
You can use:
android:divider="#null"
android:dividerHeight="3dp"
example:
<ListView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/listView" android:layout_gravity="center_horizontal"
android:dividerHeight="3dp"
android:divider="#null" android:clickable="false"/>
I realize that an answer was already been selected, but I just wanted to share what ended up working for me when I ran into this issue.
I had a listView where each entry in the listView was defined by its own layout, similar to what Sammy posted in his question. I tried the suggested approach of changing the divider height, but that did not end up looking all too pretty, even with an invisible divider. After some experimentation, I simply added an android:paddingBottom="5dip" to the last TextView layout element in the XML file that defines individual listView entries.
This ended up giving me exactly what I was trying to achieve via the use of android:layout_marginBottom. I found this solution to produce a more aesthetically pleasing result than trying to increase the divider height.
Instead of giving margin, you should give padding:
<ListView
android:id="#+id/listView1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:divider="#android:color/green"
android:dividerHeight="4dp"
android:layout_alignParentTop="true"
android:padding="5dp" >
</ListView>
OR
<ListView
android:id="#+id/listView1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:paddingTop="2dp"
android:divider="#android:color/green"
android:dividerHeight="4dp"
android:paddingLeft="1dp"
android:paddingRight="1dp"
android:paddingBottom="2dp"
android:paddingStart="0dp"
android:paddingEnd="0dp" >
</ListView>
Simplest solution with OP's existing code (list items already have got padding) is to add following code:
listView.setDivider(new ColorDrawable(Color.TRANSPARENT)); //hide the divider
listView.setClipToPadding(false); // list items won't clip, so padding stays
This SO answer helped me.
Note: You may face a bug of the list item recycling too soon on older platforms, as has been asked here.
you just need to make background transparent of list divider and make height according to your needed gap.
<ListView
android:id="#+id/custom_list"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:divider="#00ffffff"
android:dividerHeight="20dp"/>
<ListView
android:clipToPadding="false"
android:paddingTop="10dp"
android:paddingBottom="10dp"
android:dividerHeight="10dp"
android:divider="#null"
android:layout_width="match_parent"
android:layout_height="match_parent">
</ListView>
and set paddingTop, paddingBottom and dividerHeight to the same value to get equal spacing between all elements and space at the top and bottom of the list.
I set clipToPadding to false to let the views be drawn in this padded area.
I set divider to #null to remove the lines between list elements.
Also one more way to increase the spacing between the list items is that you add an empty view to your adapter code by providing the layout_height attribute with the spacing you require. For e.g. in order to increase the bottom spacing between your list items add this dummy view(empty view) to the end of your list items.
<View
android:layout_width="match_parent"
android:layout_height="15dp"/>
So this will provide a bottom spacing of 15 dp between list view items. You can directly add this if the parent layout is LinearLayout and orientation is vertical or take appropriate steps for other layout. Hope this helps :-)
This will help you add the divider height.
getListView().setDividerHeight(10)
If you want to add a custom view, you can add a small view in the listView item layout itself.
I found a not-so-good solution for this in case you are using a HorizontalListView, since dividers don't seem to work with it, but I think it'll work either way for the more common ListView.
Just adding:
<View
android:layout_marginBottom="xx dp/sp"/>
in the bottomest View of the Layout you inflate in the adapter class will create spacing between items
In order to give spacing between views inside a listView please use padding on your inflate views.
You can use android:paddingBottom="(number)dp" && android:paddingTop="(number)dp" on your view or views you're inflate inside your listview.
The divider solution is just a fix, because some day, when you'll want to use a divider color (right now it's transparent) you will see that the divider line is been stretched.
A lot of these solutions work. However, if all you want is to be able to set the margin between items the simplest method I have come up with is to wrap your item - in your case the CheckedTextView - in a LinearLayout and put your margin formatting for the item in that, not the root-layout. Be sure to give this wrapping layout an id and create it along with your CheckedTextView in your adapter.
That's it. In effect, you are instantiating the margin at the item level for the ListView. Because the ListView does not know about any item layout - only your adapter does. This basically inflates the part of the item layout that was being ignored before.
Maybe you can try to add android:layout_marginTop = "15dp" and android:layout_marginBottom = "15dp" in the outermost Layout

Categories

Resources