I have a layout requirement like below,
Textview
TextView
ListView
Edit Text
Button
Since listview cannot fit in landscape, I want to have list view onwards (ie. listview, edittext and button) to be a scroll view.
I know listview cannot be used inside a scrollview, but is there a way to do that ?
Any working example will be appreciated.
99% of android developers think we should not use ListView inside a ScrollView because both are scrollbale views and only parent can be scrollable, so it wraps the ListView.
Its 100% correct. But we have to use tricks to avoid this and to achieve our requirements.
I found one trick in web, which is setting the height of ListView based on the list items. Just check the link below, you will get an example code to calculate the height of ListView to fit inside a ScollView.
Android ListView height calculation to fit in ScrollView
The problem with this code is the list view will be filled entire screen if more children are available.
You have to use below template to achieve solution to your requirement.
<ScrollView >
<LinearLayout vertical>
<TextView />
<TextView />
<ListView />
<EditText />
<Button />
</LinearLayout>
</ScrollView>
I saw one video on youtube, Android ListView inside a ScrollView which is showing we can limit the height of listview, can be scrollable and used inside a ScrollView. I don't know how the programmer achieved that.
I am also thinking to produce same result by avoiding above example code. I hope it may help you temporarily. Please let me know if you got solution.
The better solution for this kind of layout is that You should use relative layout and fix ur EditText and Button at the bottom of ur screen like i have in my list view(see the image below) so that you wont need to add ScrollView in ur layout.
Just do this
<ScrollView>
<LinearLayout>
<ListView>
</LinearLayout>
</ScrollView>
Then add your
EditText
Button
Sort of a round about way to do what you want to do without a scroll view.
Write a custom adapter for your ListView
Assume you have an array of n elements that you want to populate the ListView with and then the EditText and the Button. So number of elements will be n+2
In the getView for the position n+1 return a view which has an EditText box instead of the normal list item
For the n+2 position return a Button.
Don't try to wrap around a ListView with a ScrollView, you will need up with lot of issues.
Note: I have not tested this, not even sure if it will work. Do let me know if it works. :)
Related
the xml file:
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:id="#+id/singleProp"
android:scrollbarAlwaysDrawVerticalTrack="true"
android:visibility="gone">
<ImageView
android:layout_width="200dp"
android:layout_height="200dp"
android:id="#+id/propertyImg"/>
<ListView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/propertyData"
android:layout_below="#id/propertyImg">
</ListView>
</RelativeLayout>
With the above codes, the image will be fixed at top-center position. With CSS terms in html, the style of that image view is style="position:fixed" but what I want is style="position:relative".
For example,
I hope the picture can illustrate the idea.
May I know how I should modify my codes?
Let me elaborate a bit more on mark.zhai`s answer, since it's the only one that I find to be the proper approach.
First of all I wanna point out that you should think about implementing your list with a RecyclerView instead of ListView (right now it's generally favoured to use a RecyclerView; ListView is getting kinda deprecated)...
If you want to be sure that your ImageView works nicely (scroll-wise) with your list (without too much "side-work" on scroll integration), you should implement it as a first item of your list. If you stick with your ListView you can use the header function of it and add your ImageView with ListView's method addHeaderView. If you decide to move to a RecyclerView (which I think you should), you can accomplish that in a bit more difficult manner (more on that for example here).
why don't u make the imageview an item of the listview
For this you need to create a custom listview which having the first item as a image view and later having all your list items. Probably you can control this in your adapter getview method by the use of position(int)
For example if Position is equal to '0' show only image view and if position is not equal to '0' show your rest elements by using Visibility
Note: here their might be a chance of performance issues as it is loading the unnecessary views every time
To achieve this, you need to scrolling the complete layout. In general case, when you fling on a list view, only the item within the list view moves.
Check this link.
I'm not entirely sure what you're asking, as I don't know a lot about CSS, but you can check out this link which describes aligning elements within a Relative Layout.
You might want to try adding alignParentLeft or alignParentRight.
Remember margins are external to the object and padding is internal. For example to move the image 20dp from the left you would:
<ImageView
android:layout_alignParentLeft="true"
android:layout_marginLeft="20dp"
android:layout_width="200dp"
android:layout_height="200dp"
android:id="#+id/propertyImg"/>
Here are some useful links about mastering Relative Layouts:
Relative Layout Params
Moving Elements Around in a Relative Layout Tutorial
Another RelativeLayout Example
Margins and Padding
Why don't you use layout_below to take your layout below whatever you want, and use layout_gravity to set it's gravity. You can check these Link to get you better understand, it will help you in these problem.
I have LinearLayout compoment which contains ListView and ImageView.
According to the documentation layout area should be scrollable if element's height is bigger than LinearLayout's area.
But scroll is not available.
I can scroll only when listview contains a lot of elements. But in this case ImageView component is not visible at all.
Using ScrollView is not allowed because ListView has his own Scroll element.
Could you please advice what should I do?
Here is part of my xml file:
<LinearLayout android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_below="#id/top_header"
android:layout_above="#id/bottom_menu"
android:layout_weight="1"
android:id="#+id/sub_content_view">
<ListView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/eventsListView"/>
<ImageView
android:layout_width="fill_parent"
android:layout_height="260dp"
android:id="#+id/empty_area"
android:adjustViewBounds="true"
android:background="#drawable/empty_area"
android:contentDescription="#string/contentDescription"/>
</LinearLayout>
If you ListView is not empty, you may register the ImageView as list footer, it then scrolls with the ListView. However, footers are not displayed if the list is empty, so you'd have to add the ImageView to the empty view as well.
First 2 comments than a possible solution
(1) ListView won't be scrollable when there's nothing in it. Instead it will display an empty view which you can set either programaticlly or with XML (usualy a text view that says something to the extent of "your list is empty").
(2) Your ImageView is set for a fixed height while your ListView is set to wrap_content. As a result, when your ListView contains enough elements that is is larger than the area of the screen it will push your ImageView out of view. As I have yet to see a LinearLayout or RelativeLayout suddnely become scrollable if there's more stuff on the screen than there is space (I just tried to make it happen) I'm not surprised by what you're describing.
You're right that using a ScrollView with a ListView as a child is disfavored. What I would try is - instead of putting both the ListView and ImageView in the same LinearLayout - separate the two. I don't know the rest of your XML but if you moved the ImageView out of that layout element you should be able to position it below the part containing the ListView such that - regardless of the size of the list - the ImageView will remain in the same place.
The suggestion above to use a footer may work, however, a footer is pinned to the bottom of the list. That means, if your list is really long, there will be a point at which the footer is not visible unless you scroll down far enough that it is exposed. If you want the image to remain visible all the time, e.g. have the list scroll behind the image, then you need to use a different approach.
im trying to insert 6 gridviews with 6 imageview above each of them ! the problem im facing is that i cant scroll my page to see all my girdviews the first gridview seems fine as it wraps all its contents and set the height to it the second gridview shows only first row and make it scrollable but i can't see my other gridviews i want a layout like
--ImageView--
--GridView1--
--ImageView--
--GridView2--
--ImageView--
--GridView3--
and so on
<LinearLayout>
<ImageView />
<GridView />
--
--
<GridView6 />
</LinearLayout>
i have tried using scrollview and all but couldn't get the results !
Thanks
Hee is how you can do this. Check the answer here. It is an expandable height GridView, which you will want to import / create in your project. What that basically means is that as more items are added to the GridView, it will just expand its height, as opposed to keeping its height set and using scrolling. This is exactly what you want.
Once you have the ExpandableHeightGridView in your project, go to your XML layout where you want the GridView to be. You can then do something like this (paraphrasing):
<ScrollView ...>
<RelativeLayout ...>
<com.example.ExpandableHeightGridView ... />
<other view items />
</RelativeLayout>
</ScrollView>
Then, in your activity where you set the GridView's adapter, you want to make sure you set it to expand. So:
ExpandableHeightGridView gridView = (ExpandableHeightGridView) findViewById(R.id.myId);
gridView.setAdapter(yourAdapter);
gridView.setExpanded(true);
The reason you want this expandable GridView is because, the fact that a standard GridView doesn't expand is what causes it to scroll. It sticks to a certain height, and then as more items fill it past its view bounds, it becomes scrollable. Now, with this, your GridView will always expand its height to fit the content within it, thus never allowing it to enter its scrolling mode. This enables you to use it inside of the ScrollView and use other view elements above or below it within the ScrollView, and have them all scroll.
This should give you the result you're looking for. Let me know if you have any questions.
I have a listView that expands upwards instead of downwards.
I have another listView on another page that works just fine and populates itself from the top -> bot.
Why does my listView start from the bottom instead of the top?
My XML
`
<ListView
android:id="#+id/list_view_showRegister"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_above="#+id/showRegister"
android:layout_alignParentLeft="true"
android:layout_marginTop="50dp"
android:clickable="false" >
</ListView>`
Your ListView is still actually populating from the top downwards. Just not from the top of the page.
You have set the layout_height="wrap_content" and the layout_above="#+id/showRegister". With the height being wrap_content, the view will only be as large as it's contents. Then, due to the fact you have used layout_above, it will be directly above another view.
The listview is not filling from the bottom, it is filling from the top (of the listview) - but the listview itself is only starting from halfway up the screen. Anything above the listview is not actually part of the listview, but empty space instead.
The solution is to either set the layout_height="match_parent", or remove the layout_above tag.
I know this is an old question but I hope this helps anyone else who may have found this issue via google.
Have a look a these links. Is it possible to make a ListView populate from the bottom?. populating from bottom.
Add new items to top of list view on Android?. Add new item at the top of list.
See for android:stackFromBottom attribute.
I want to put tow listviews in one scrollview on android platfrom to make both of them scrolling synchronized. For instance, when I drag the left listview up and down, the right side one would be scrolled as the same. I have tried to extend the scrollview for overriding methods but haven't get it work. Any advice will be appreciated.
If your two listview does not take many memory and has same height, try put them in single scrollview and let scrollview do scroll.
layout would be look like this:
<scrollview layout_width:fill_parent layout_height:wrap_content>
<linearlayout orientation:horizontal layout_height:wrap_content layout_width:fill_parent>
<listview layout_height:wrap_content layout_width:wrap_content layout_weight:1/>
<listview layout_height:wrap_content layout_width:wrap_content layout_weight:1/>
</linearlayout>
</scrollview>
In this case, you should set height of listview manually. you can find a solution here.
But if you use this solution, listview can't optimize memory usage, so listview can take much memory as item count increase.