So I am developing a screen where there are some images and buttons on top and Below that is a list view which shows a list of some activity.
The design is something like this :-
Now on smaller screen the ListView height becomes very small as the screen space is taken up by the above icons and images.
So how can i increase the height of the Linearlayout or ListView so that user can scroll to the see the rest of the ListView.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
.... Other Layouts .....
<ListView
android:id="#+id/listArea"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:paddingLeft="#dimen/list_padding"
android:paddingRight="#dimen/list_padding" />
</LinearLayout>
Edit: Tried using the top view as a header to the List but since I want an EmptyView too, this is creating a problem as it replaces the whole header + listview
From what I read about that issue, you should specify the Views on top as header of the list, and the'll scroll properly.
Afaik this only works if the list is non-empty, as the empty view replaces the whole list including headers.
You can use the weightSum and layout_weight attributes to control how much of the parent's available space a child view will take up. To use these, a parent layout, for example, your LinearLayout, gets the android:weightSum attribute. Each child layout gets the android:layout_weight attribute, where the sum of all child weights is the weightSum of the parent. In addition, each child should have their layout_height or layout_width set to 0dp, whichever is going to be decided by the weight.
Here's an example based on your diagram. Let's say you want the two top views to take up 1/4 of the screen each, and the ListView to take up the bottom half. Add android:weightSum="4" to your LinearLayout, android:layout_weight="1" to the two child layouts that you represent with ...Other Layouts..., and android:layout_weight="2" to the ListView. Code might look something like this:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:weightSum="4">
<ImageView
android:layout_weight="1"
android:layout_height="0dp"
...some other attributes.../>
<LinearLayout
android:layout_weight="1"
android:layout_height="0dp"
android:orientation="horizontal"
...some other attributes...>
...some children of the LinearLayout...
</LinearLayout>
<ListView
android:id="#+id/listArea"
android:layout_width="match_parent"
android:layout_height="0dp"
android:paddingLeft="#dimen/list_padding"
android:paddingRight="#dimen/list_padding"
android:layout_weight="2"/>
</LinearLayout>
Related
My XML file has a LinearLayout containing two ListView with android:height="wrap_content". However, when one of the ListView has too much contents, it pushes another ListView and eat up its space. What can I do to make it stops pushing at certain height? I've tried adding layout-weight or maxHeight but it doesn't help.
If you want the same amount for both ListViews equally divided, just put them in a LinearLayout.
LinearLayout will have property weightSum=2 while both ListViews will have, depending on the LinearLayout orientation property:
If vertical -> both ListViews will have android:height="0dp" and layout-weight=1
If horizontal -> both ListViews will have android:width="0dp" and layout-weight=1
I solved it by doing it programmatically. It seems XML doesn't give much control for dynamic height. I added onLayoutChangedListener to both ListView to detect height change and add height control logic in the listener.
Try this :
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/green_bg_duplicate"
android:gravity="center"
android:orientation="vertical"
android:weightSum="2">
<RecyclerView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:weightSum="1" />
<RecyclerView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:weightSum="1" />
</LinearLayout>
My linear layout having two list views, when i add items in second list view, its not expanding. its getting scrolled automatically,
i have used match_parent in my linear layout, even though the second list view (getting scrolled instead of expanding) or the linear layout is not expanding.
Can anyone please help me to expand the list view or the linear layout.
problem in linear layout or the second list view?
but the first list view expanding properly.
fragment_one.xml
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:layout_weight="1"
android:descendantFocusability="blocksDescendants"
android:padding="10dip" >
<ListView
android:id="#+id/list_nation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dip"
android:background="#B29090"
android:nestedScrollingEnabled="true">
</ListView>
<ListView
android:id="#+id/list_regional"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dip"
android:background="#4A9C67"
android:focusable="false"
android:nestedScrollingEnabled="true">
</ListView>
</LinearLayout>
When you add multiple scrolls in a single screen it always shows problems. Because they conflict with each other.
There are two solution for your problem.
If you want to keep your each listview to take half screen then add "weightsum = 100" in your main linear layout and set weight of both listviews to "50".
If you want your first list to scroll till end and at the end of first you want the second one to start scrolling, then calculate the height of your lists on run time and assign the calculated height to your listviews. Check this: Android: How to measure total height of ListView
I have this layout:
All views fill the entire space horizontally, and they're inside a LinearLayout oriented vertically. The blue parts have a fixed height (they have the wrap_content property).
The red part is a ListView. How can I make it fill that center space if there are not enough elements in the list and at the same time preventing it to push the last two elements down if it has more elements?
So far it doesn't push down the two views under it (with the layout_weight="1" property), but if it doesn't have enough elements, it shrinks and makes those two elements go up, leaving an ugly white space under them.
This is what happens:
This is what I expect:
Notice that even though the ListView is smaller, the two last views don't go up.
So far I've tried:
Giving all views a weight (ugly display but sort of works).
Giving each view a size (different results on different devices).
Giving the last view the android:gravity="bottom" property, but the view still goes up.
What may work
I've been messing around and I think a RelativeLayout may work, with a property like layout_alignBottom that instead of aligning to the end of the given view, it aligned to the start of it.
SOLUTION
The solution was to use a RelativeLayout and set the list's layout_above and layout_below properties to that of the elements I want to align it to.
<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"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
tools:context="com.stackoverflow.app.MainActivity">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/hello_world" />
<ListView
android:id="#android:id/list"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:minHeight="48dp"
android:text="#string/hello_world" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:minHeight="48dp"
android:text="#string/hello_world" />
</LinearLayout>
Here's a couple of options that may work for you. Let me know how it goes.
Option 1:
Set the containing vertical orientated linear layout to fill_parent / match_parent (they are the same). Then set the gravity or layout gravity of the bottom 2 views to bottom.
Option 2:
Contain the list view in a linear layout with a fixed height. Set the list view to wrap_content.
EDIT
You could use relative layouts for this, this link here seems to do what you need
http://www.javacodegeeks.com/2013/10/android-fixed-header-and-footer-with-scrollable-content-layout-example.html
How about wrapping your list view inside the a layout and give the layout the fixed height.
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="300dp" >
<ListView
android:id="#+id/listView1"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
</ListView>
</RelativeLayout>
I want to use two child layout (one linear layout and one relative layout) inside a parent layout (relative layout) in such a way that both of the child layout will take exactly half of the screen and items inside of each child layout will not cause one child layout to get more width than another one!
It is pretty easy, use parameter layout_weight in children of LinearLayout, something like this:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="match_parent">
</RelativeLayout>
<RelativeLayout
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="match_parent">
</RelativeLayout>
</LinearLayout>
If I understand correctly from your illustration, the red box is a RelativeLayout, whereas the green boxes are a LinearLayout and a RelativeLayout.
A simple solution would be to center an empty View inside the RelativeLayout and align the two child Views against it:
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_toLeftOf="#+id/v_center" />
<View
android:id="#+id/v_center"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_centerInParent="true" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_toRightOf="#+id/v_center" />
</RelativeLayout>
A nice little bonus here is that you can provide some spacing between the two by specifying the View's dimensions.
Beware, however, that RelativeLayouts aren't very efficient, and nesting them is an especially bad idea. I suggest using the hierarchy viewer tool to inspect the layout timings to make sure it's relatively fast, and to try to avoid nesting the layouts in this fashion.
Right now I have views with layout_weight inside another view that also has the same attribute, which causes the outer view to be calculated exponentially. I'm considering nesting another set of views with weights inside of the inner view, but that would cause the outermost view to be calculated more times than I would like. I'm just splitting the areas up evenly (each view within a group all have the same weight), but I want everything to scale properly regardless of what size or DPI the screen is. Is there any other way to efficiently split views within another view?
DeeV's answer to this question does a good job of it:
Swap your top LinearLayout with a RelativeLayout and align the two children to an >invisible View in the center like so:
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/top"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:id="#+id/center_point"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_centerInParent="true"/>
<LinearLayout
android:id="#+id/left_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentLeft="true"
android:layout_alignRight="#+id/center_point>
</Linearlayout>
<LinearLayout
android:id="#+id/right_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentRight="true"
android:layout_alignLeft="#+id/center_point>
</Linearlayout>
</RelativeLayout>