Develop Reference

How to make scrollable Items within a scrollable listview?

I have small database which populates data into a listview which uses other layout as provided below to show the data.
What happens is if the 1st field's text is more than two lines, the text starts hiding. So I thought i would make that listview's each row scrollable. Though it shows a scroll bar but nothing happens.
This is the layout which is used by listview
<?xml version="1.0" encoding="utf-8"?>
<ScrollView
android:layout_height="75dp"
android:layout_width="match_parent"
xmlns:android="http://schemas.android.com/apk/res/android">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="75dp"
xmlns:android="http://schemas.android.com/apk/res/android">
<TextView
android:id="#+id/desc_d"
android:layout_width="165dp"
android:layout_height="match_parent"
android:layout_alignParentStart="true"
android:text="Description"
android:gravity="center"
android:textAppearance="#android:style/TextAppearance.Large"/>
<TextView
android:id="#+id/cate_d"
android:layout_width="70dp"
android:layout_height="match_parent"
android:gravity="center"
android:layout_toEndOf="#id/desc_d"
android:text="others"
android:textAppearance="#android:style/TextAppearance.Large" />
<TextView
android:id="#+id/date_d"
android:layout_width="70dp"
android:layout_height="match_parent"
android:gravity="center"
android:layout_toEndOf="#id/cate_d"
android:text="16/11/2017"
android:textAppearance="#android:style/TextAppearance.Large" />
<TextView
android:id="#+id/amt_d"
android:layout_width="80dp"
android:layout_height="match_parent"
android:gravity="center"
android:layout_toEndOf="#id/date_d"
android:text="100000"
android:textAppearance="#android:style/TextAppearance.Large" />
</RelativeLayout>
</ScrollView>
My MainActivity layout has a listview which is also scrollable and uses above layout.
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:descendantFocusability="beforeDescendants"
android:focusableInTouchMode="true"
android:keepScreenOn="false"
android:scrollbarAlwaysDrawHorizontalTrack="false"
android:scrollbarAlwaysDrawVerticalTrack="false"
tools:context="apps.harry.expensedata.MainActivity">
<Button
android:id="#+id/add_expense_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="24dp"
android:layout_marginTop="24dp"
android:onClick="addExpenseClick"
android:text="#string/button_1"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<Button
android:id="#+id/view_expense_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="24dp"
android:onClick="viewClick"
android:text="#string/button_2"
app:layout_constraintStart_toEndOf="#+id/add_expense_btn"
app:layout_constraintTop_toTopOf="parent" />
<RelativeLayout
android:id="#+id/relativeLayout"
android:layout_width="match_parent"
android:layout_height="406dp"
android:layout_marginTop="84dp"
app:layout_constraintTop_toTopOf="parent"
tools:layout_editor_absoluteX="0dp">
<ListView
android:id="#+id/list_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
tools:layout_editor_absoluteX="8dp"
tools:layout_editor_absoluteY="248dp" />
</RelativeLayout>
</android.support.constraint.ConstraintLayout>
</ScrollView>
Here's the screen shot of the APP
As you can see there's a scroll bar available for each row in that layout, but nothing happens when I scroll.Please suggest me how this could be achieved.

This is not a solution suggestion for your scrolling problem, but due to user experience you should consider to not habe scrollable list items inside a scrollable list.
See Material Guidelines for this. Here is a little excerpt.
List tiles may contain up to three lines of text, and text length may vary between tiles in the same list. To display more than three lines of text, use a card.
Place the most distinguishing content on the left of the tile and the least distinguishing content on the right.
Specifications:
The majority of space on a list tile should be dedicated to the primary action
Place the most distinguishing content towards the left of the tile
In tiles with multi-line content, place the most distinguishing content in the first line
Place supplemental actions on the right side

Try using maxLines and minLines as attributes for the TextView to accommodate all the data.

Make scrollView Height="wrap_content" instead of fixed size. maybe useful

Google defined in their guidelines do not use scrollview inside of scrollview and it is more then simply guidelines it doesnt work properly. and you see that case. Tbe solution is set to your listitem height as wrap_content and the best practices is as was mentioned above do not use listitems with more than 2-3 lines of text. take a look into materisl design guide to see the dimensions of list items

I would suggest you to can change your custom list item height to wrap_content and then you don't need scrolling.
<?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:gravity="center"
android:orientation="horizontal"
android:padding="10dp">
<TextView
android:id="#+id/decription"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:hint="decription" />
<TextView
android:id="#+id/whatFor"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:hint="whatFor" />
<TextView
android:id="#+id/date"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:hint="date" />
<TextView
android:id="#+id/amount"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:hint="amount" />
</LinearLayout>
Your output will be like below image.
I hope your issue will be resolved and if you still have any query then please ask.

Is it possible to make the first view in ScrollView match dimensions to screen?

I was able to this somehow using RecyclerView. When I create a view for a specific item in my RecyclerView, the recyclerview item layout is matched to parent.
I am wondering if this is also possible using ScrollView?
Here's what I did so far:
ScrollView xml:
<ScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/scrollview_homescreen"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<LinearLayout
android:id="#+id/linearlayout_homescreen"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<include layout="#layout/listitem_comic_menu"/>
<LinearLayout
android:id="#+id/linearlayout_comic_listings"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
</LinearLayout>
</LinearLayout>
</ScrollView>
Content:
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/relativelayout_homescreen"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/imageview_menu_bg"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="fitXY"
android:adjustViewBounds="true" />
<ImageView
android:id="#+id/imageview_menu_title_bg"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="#drawable/starwars_webtoon_home_1_logo"
android:scaleType="fitXY"
android:adjustViewBounds="true" />
<Button
android:id="#+id/button_start_reading"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_above="#+id/button_menu"
android:layout_marginBottom="18dp"
android:text="#string/button_start_reading"
android:gravity="start"
android:drawableRight="#drawable/ic_keyboard_arrow_right_black_24dp"
android:drawableEnd="#drawable/ic_keyboard_arrow_right_black_24dp"
android:background="#drawable/button_bg"
android:textSize="18sp"
android:layout_marginStart="12dp"
android:layout_marginLeft="12dp"
android:layout_marginEnd="12dp"
android:layout_marginRight="12dp" />
<Button
android:id="#id/button_menu"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_alignParentBottom="true"
android:layout_marginBottom="28dp"
android:text="#string/button_menu"
android:textSize="18sp"
android:textColor="#FFFFFF"
android:drawableLeft="#drawable/ic_menu_white_24dp"
android:drawableStart="#drawable/ic_menu_white_24dp"
android:background="?android:attr/selectableItemBackground" />
</RelativeLayout>
So what am I trying to do? Basically this is for comic listing. The first item should be the homescreen, a couple of button here and there and the entire application logo. The next item should show the listings (I have 40 items of the same width and height) and a footer.
I need my homescreen to match the parent which is the screen. So when I scroll the topmost part, the first item (the first view, which is the homescreen) fills the entire devices screen.
I was able to to do this on RecyclerView and looks nice. I have encountered some of problems that plague me which I have to fix extensively to the point that I am hacking through the system and I realize RecyclerView is not really the best layout for this kind of case. I am currently deciding whether to switch to ScrollView and dynamically/statically add the comic items. But, the homescreen, which is the first View is not matching the screen device.
I would just like to ask if this possible at all to do in ScrollView?
Thanks!

Use weight attribute:
<LinearLayout
android:id="#+id/linearlayout_homescreen"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="vertical">
<include layout="#layout/listitem_comic_menu"/>
<LinearLayout
android:id="#+id/linearlayout_comic_listings"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
</LinearLayout>
</LinearLayout>

Android ListView with CardView: Last Card not fully displayed when scrolling

I have created a ListView to which I've added CardView.
As you can see in the image, when I start scrolling, the last Card in the ListView is not completely displayed. It scrolls up but it does not come above Android's navigation bar at the bottom. I've been testing on a HTC One M8.
Here is the ListView:
<?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="fill_parent"
android:orientation="vertical">
<ListView
android:id="#+id/wanna_list"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:divider="#null"/>
</LinearLayout>
And here is the CardView that I inflate and set into the adapter of the listview:
<?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="wrap_content" >
<android.support.v7.widget.CardView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="200dp"
android:id="#+id/cv"
android:foreground="?android:attr/selectableItemBackground"
android:clickable="true"
card_view:cardCornerRadius="6dp"
card_view:cardUseCompatPadding="true"
card_view:cardElevation="2dp">
<!-- compat padding is required if using AppCompat -->
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="16dp" >
<ImageView
android:layout_width="100dp"
android:layout_height="100dp"
android:id="#+id/thumbnail"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginRight="16dp"
android:src="#drawable/india"
android:scaleType="centerCrop" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/firstLine"
android:layout_toRightOf="#+id/thumbnail"
android:layout_alignParentTop="false"
android:textSize="20sp"
android:text="Tennis with Peter"
android:layout_alignTop="#+id/thumbnail" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/secondLine"
android:layout_below="#+id/firstLine"
android:text="10 Oct at 7pm"
android:layout_alignLeft="#+id/firstLine" />
<Button
android:layout_width="180dp"
android:layout_height="wrap_content"
android:text="YES"
android:id="#+id/button3"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_alignLeft="#+id/thumbnail" />
<Button
android:layout_width="60dp"
android:layout_height="wrap_content"
android:text="NO"
android:id="#+id/button4"
android:layout_toRightOf="#+id/button3"
android:layout_alignBottom="#+id/button3"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="false" />
</RelativeLayout>
</android.support.v7.widget.CardView>
</LinearLayout>
I have also tried my card view layout without wrapping it in a LinearLayout and it still does not work.
Is there a setting in the layout xml that will take care of this?
Thanks in advance.

android:layout_marginBotton=" "
add margin bottom should try once.

So adding a margin to the bottom of listView worked, as below:
<ListView
android:id="#+id/wanna_list"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:divider="#null"
android:layout_marginBottom="80dp" />
Am surprised this is the only way to get it to work though. I would have assumed the Android framework took care of these things.

Is the ListView in a Fragment ? As far as I know, this is possible when you have used a Toolbar such as :
<android.support.v7.widget.Toolbar
...
app:layout_scrollFlags="scroll"
...
>
</android.support.v7.widget.Toolbar>
then change the attribute to:
app:layout_scrollFlags="enterAlwaysCollapsed"
Adding margin at the bottom of ListView is sort of a hack. I have given a probable cause for this. If this is the case, then you won't need to add the margin in ListView. There is always a reason behind the UI behavior. I hope this helps.

One of two Android ListView filling too much space

I would like to obtain this layout for an Android app for mobile phones:
Icon - Object1
List with entries related to Object1
Icon - Object2
List with entries related to Object2
So far I have used the following layout tree (edited graphically with the editor in Android Studio):
Root-LinearLayout
Vertical LinearLayout
Horizontal LinearLayout with icon and text
ListView
Vertical LinearLayout
Horizontal LinearLayout with icon and text
ListView
May be this is not the best way to organize such layout (may be I should use lists with header, but suggestions very welcome), however it can be a good case for understanding deeper how ListView works.
This is the graphical layout generated:
the blue row corresponds to the first LinearLayout. As you can see from the second screenshot that follows, the second list goes all the way down to Hell, bringing me with her. Is there any way to make the lists respect the wrap_content+ weight behaviour?
The XML code follows. I have tried several combos (both reasonable and unreasonable) of layout:weights but none works. I also tried to set the min-width of the first LinearLayout (the hidden one), but nothing changes.
Could you please help me?
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent"
android:weightSum="2">
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1">
<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:minHeight="50dp">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/imageView15"
android:src="#drawable/abc_ic_menu_share_mtrl_alpha" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Object1"
android:id="#+id/textView24"
android:textSize="26dp"
android:paddingLeft="10dp" />
</LinearLayout>
</LinearLayout>
<ListView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/listView2"
android:layout_weight="1" />
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1">
<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/imageView16"
android:src="#drawable/abc_ic_commit_search_api_mtrl_alpha" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Object2"
android:id="#+id/textView25"
android:textSize="26dp"
android:paddingLeft="10dp" />
</LinearLayout>
<ListView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/listView"
android:layout_weight="1" />
</LinearLayout>

It should work if you put your ListViews inside of the child LinearLayouts which hold the LinearLayout that has the TextView and ImageView. You also should be using "0dp" for the height when using weight with a vertical layout.
Something like this, I believe, should work
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent"
android:weightSum="2">
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1">
<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:gravity="center_vertical"
android:minHeight="50dp"
android:layout_weight=".2">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/imageView15"
android:src="#drawable/abc_ic_menu_share_mtrl_alpha" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Object1"
android:id="#+id/textView24"
android:textSize="26dp"
android:paddingLeft="10dp" />
</LinearLayout>
<ListView
android:layout_width="wrap_content"
android:layout_height="0dp"
android:id="#+id/listView2"
android:layout_weight=".8" />
</LinearLayout>
Note the other changes: I gave the inner-LinearLayout an arbitrary weight of ".2" then the ListView a weight of ".8". And, of course, set the height to "0dp". You may need to play with those weights a bit but I think doing something like that for both first child LinearLayouts should get you close.
That may get your current layout to work but using headers and/or an ExpandableListView may be a better option.

why listview items are disabled initially?

I have the following as the layout of each item in a ListView:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:orientation="horizontal"
android:layout_height="match_parent" >
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView" />
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button" />
</LinearLayout>
But each time I'm getting this:
As you can see, both buttons as well as TextViews are disabled (take a look at their appearance). Please note that each individual item in ListView takes action when I click them (I've defined OnItemClickListener()); the only problem (so far) is the appearance of buttons and textviews. Here's main_layout.xml:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_height="match_parent" >
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_weight="1"
android:layout_height="0dp"
android:hint="Text empty"
android:text="TextView" />
<ListView
android:id="#+id/listView1"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="9" >
</ListView>
</LinearLayout>

It's working fine only. The screen is disabled because when the emulator opens, you should use it. If you kept it in idle, it will hide these controls. when you click anywhere inside the screen of the emulator. It will take control.