Android Scrollview content size smaller when should be - android

I want to have a "fixed_space" at the top of screen and a "scrollview" at the bottom of the screen which should be below fixed_space. The rest of the screen is a container "rest_space".
Unfortunately my scrollview has a shorter height(by 100dp which fixed_space has) ,if content is too big/scrollable.
I tried to achieve same with ConstraintLayout and RelativeLayout, but I have got same result.
Any ideas why scrollview has 100dp shorter height, as it should be?
EDIT: Scrollview should take as much space as she needs.
<?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:orientation="vertical">
<View
android:id="#+id/fixed_space"
android:layout_width="match_parent"
android:layout_height="100dp"
android:background="#android:color/holo_red_dark" />
<View
android:id="#+id/rest_space"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#android:color/black" />
<ScrollView
android:id="#+id/scrollview"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/holo_green_dark"
android:fillViewport="true">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="START OF SCROLLVIEW \n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\nMIDDLE OF SCROLLVIEW \n\n\n\n\n\n\n\n\n\n\n\nEND OF SCROLLVIEW" />
</ScrollView>
</LinearLayout>

Try 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:orientation="vertical">
<View
android:id="#+id/fixed_space"
android:layout_width="match_parent"
android:layout_height="100dp"
android:background="#android:color/holo_red_dark" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<View
android:id="#+id/rest_space"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/scrollview"
android:background="#android:color/black" />
<ScrollView
android:id="#+id/scrollview"
android:layout_alignParentBottom="true"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/holo_green_dark"
android:fillViewport="true">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="START OF SCROLLVIEW \n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\nMIDDLE OF SCROLLVIEW \n\n\n\n\n\n\n\n\n\n\n\nEND OF SCROLLVIEW" />
</ScrollView>
</RelativeLayout>
</LinearLayout>

Ok, I think this should solve your probem:
First, I started by using RelativeLayout. I did it in order to get the fixed_space aligned to the top and the scrollview aligned to the bottom.
Then I changed the View for a LinearLayout and put a TextView within it so I could use wrap_content and this is the tricky part:
When you use ScrollView with wrap_content and a View with the weight stuff, Android can't make the calculations it needs to get the screen drawed because there is no reference. When I put the TextView with wrap_content itself that gives the reference because Android know the size of the text.
You don't have to use the TextView but you will need anything that gives Android that reference.
In this case, the scrollview is going to be stretched, not the LinearLayout. If you want the second to get strached, then I'm afraid you are going to need to set a fixed height to your scrollview.
<?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"
android:orientation="vertical">
<View
android:id="#+id/fixed_space"
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_alignParentTop="true"
android:background="#android:color/holo_red_dark" />
<LinearLayout
android:id="#+id/rest_space"
android:layout_below="#+id/fixed_space"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/black">
<TextView
android:text="Test"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
<ScrollView
android:id="#+id/scrollview"
android:layout_below="#id/rest_space"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/holo_green_dark"
android:layout_alignParentBottom="true">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="START OF SCROLLVIEW \n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\nMIDDLE OF SCROLLVIEW \n\n\n\n\n\n\n\n\n\n\n\nEND OF SCROLLVIEW" />
</ScrollView>
</RelativeLayout>

Related

Android ScrollView remove border

When I use ScrollView, no matter how I set it up, Scrollview will always have a green border, setting the background to Scorllview doesn’t work.
Below is part of my xml file
<?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:background="#color/color_setting_bg"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<ScrollView
android:id="#+id/left_sv"
android:layout_width="#dimen/px_180"
android:layout_height="match_parent"
android:overScrollMode="never"
android:background="#null"
android:scrollbars="none"
android:fadingEdge="none" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<RelativeLayout
android:id="#+id/rl_setting_quota"
android:layout_width="match_parent"
android:layout_height="#dimen/px_50"
android:gravity="center_vertical">
<ImageView
android:layout_width="#dimen/px_30"
android:layout_height="#dimen/px_30"
android:layout_marginLeft="#dimen/px_10"
android:src="#drawable/icon_szxianling" />
<TextView
android:layout_width="wrap_content"
android:layout_height="#dimen/px_30"
android:layout_marginLeft="#dimen/px_40"
android:gravity="center"
android:text="#string/str_setting_quota"
android:textSize="#dimen/px_16" />
<ImageView
android:id="#+id/iv_arr_setting_quota"
android:layout_width="#dimen/px_15"
android:layout_height="#dimen/px_15"
android:layout_alignParentRight="true"
android:layout_marginRight="#dimen/px_10"
android:src="#drawable/arrow_right" />
</RelativeLayout>
<View
android:layout_width="match_parent"
android:layout_height="#dimen/px_1"
android:background="#drawable/line_shape" />
<RelativeLayout
android:id="#+id/rl_setting_time"
android:layout_width="match_parent"
android:layout_height="#dimen/px_50"
android:gravity="center_vertical">
<ImageView
android:layout_width="#dimen/px_30"
android:layout_height="#dimen/px_30"
android:layout_marginLeft="#dimen/px_10"
android:src="#drawable/icon_shijian" />
<TextView
android:layout_width="wrap_content"
android:layout_height="#dimen/px_30"
android:layout_marginLeft="#dimen/px_40"
android:gravity="center"
android:text="#string/str_setting_time"
android:textSize="#dimen/px_16" />
<ImageView
android:id="#+id/iv_arr_setting_time"
android:layout_width="#dimen/px_15"
android:layout_height="#dimen/px_15"
android:layout_alignParentRight="true"
android:layout_marginRight="#dimen/px_10"
android:src="#drawable/arrow_right" />
</RelativeLayout>
<View
android:layout_width="match_parent"
android:layout_height="#dimen/px_1"
android:layout_marginBottom="#dimen/px_30"
android:background="#drawable/line_shape" />
</LinearLayout>
</ScrollView>
</LinearLayout>
</LinearLayout>
</LinearLayout>
The LinearLayout label is my root layout, there is a ScrollView layout inside, a LinearLayout layout is placed in the ScrollView, and then there are multiple RelativeLayout layouts in the LinearLayout layout
I have discovered the reason for this problem. This problem occurs because of the focus problem, not the problem of the Scrollview itself, because the focus is transferred to the Scrollview as soon as the interface is entered. You only need to set the following two parameters in the parent layout of the ScrollView. Can solve the problem:
android:focusable="true"
android:focusableInTouchMode="true"

Android ListView inside ScrollView not proper

I am sorry, I am new to android xml part. I am setting my listview which is inside scroll view to full screen but its frame is still small. How to resolve it? I have already set both width and height to "match_parent". Can someone help?
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.stacktips.speechtotext.MainActivity">
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent">
<ListView
android:id="#+id/list"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:listitem="#layout/row" >
</ListView>
</ScrollView>
<LinearLayout
android:id="#+id/btnSpeakContainer"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:background="#f5f5f5"
android:gravity="center_horizontal"
android:orientation="vertical"
android:padding="20dp">
<ImageButton
android:id="#+id/btnSpeak"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#null"
android:padding="16dp"
android:scaleType="fitCenter"
android:src="#mipmap/ic_microphone_2" />
<TextView
android:id="#+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/btnSpeak"
android:layout_margin="10dp"
android:text="#string/hint" />
</LinearLayout>
</RelativeLayout>
Putting the ListView inside a ScrollView means the ListView will not go to its full height. Take out the ScrollView surrounding the ListView and this should work for you :) ListView itself is scrollable.

android make view to wrap content but not larger than a specific size

I have a Relative View which has two children an scroll view and a button below it now i want to do this: i want this view to wrap it's content and does not make empty space and also not to exceed screen size.
how can i do that? can any one help?
here is my current layout file which is not working.
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ScrollView
android:id="#+id/content"
android:layout_width="match_parent"
android:layout_height="wrap_content">
....
</ScrollView>
<Button
android:id="#+id/action"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#id/content"
... />
</RelativeLayout>
RelativeLayout does not have such possibility. However LinearLayout does. Just set LinearLayout's android:orientation to vertical, set ScrollView's android:layout_weight to 1, and it should be working:
<?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:orientation="vertical">
<ScrollView
android:id="#+id/content"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
</ScrollView>
<Button
android:id="#+id/action"
android:layout_width="fill_parent"
android:layout_height="wrap_content"/>
</LinearLayout>
You should use LinearLayout and adjust both the views according to a weight.In that way it will not exceed in any resolution and will adjust acording to the size of screen.
<LinearLayout
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_height="match_parent">
<ScrollView
android:fillViewPort="true"
android:id="#+id/content"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="4"
</ScrollView>
<Button
android:id="#+id/action"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:layout_below="#id/content"
... />
</LinearLayout>
You should make action button align at the bottom and that scroll view should be above that button. In this way scroll view will always be in screen and also button will be visible.
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<Button
android:id="#+id/action"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
... />
<ScrollView
android:id="#+id/content"
android:layout_width="match_parent"
android:layout_above="#id/action"
android:layout_height="match_parent">
....
</ScrollView>
</RelativeLayout>

Two ListView in ScrollView

I have put two listview in scrollview but i have a problem, when i put item in the first listview the second listview will be scrollable. I want that the whole area will be scrollable and not scrollview, How i do? the first scrollview is listViewEventiAggiunti the second listViewEventi.
<?xml version="1.0" encoding="utf-8"?>
<ScrollView
android:layout_height="match_parent"
android:layout_width="match_parent"
xmlns:android="http://schemas.android.com/apk/res/android"
android:fillViewport="true">
<LinearLayout android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:tools="http://schemas.android.com/tools"
android:orientation="vertical"
android:id="#+id/activity_lista__eventi"
android:paddingBottom="#dimen/padBottom"
android:paddingLeft="#dimen/padLeft"
android:paddingRight="#dimen/padRight"
android:paddingTop="#dimen/padTop"
xmlns:android="http://schemas.android.com/apk/res/android"
tools:context="com.example.fra87.eudroid.activity_class.Lista_Eventi">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:orientation="vertical">
<SearchView
android:layout_width="match_parent"
android:layout_height="50dp"
android:queryHint="Evento"
android:id="#+id/cercaEvento"/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:layout_marginTop="10dp"
android:layout_marginBottom="10dp"
android:id="#+id/linearLayoutEventi">
<EditText
android:layout_width="match_parent"
android:layout_height="50dp"
android:hint="Nome Evento"
android:textSize="22dip"
android:id="#+id/editText_nome_evento_composto"/>
<ListView
android:id="#+id/listViewEventiAggiunti"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginTop="15dp" />
<View
android:layout_width="match_parent"
android:layout_height="5dp"
android:id="#+id/separatore_liste"
android:layout_marginTop="10dp"
android:layout_marginBottom="10dp"
android:background="#android:color/darker_gray"/>
<ListView
android:id="#+id/listViewEventi"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/cercaEvento"
android:layout_centerHorizontal="true"
android:layout_marginTop="15dp" />
</LinearLayout>
</LinearLayout>
</ScrollView>
I want scroll entire area, i don't want scroll on listview, when i put item in listview the area increases and i scroll entire area is possible?
Ok. Since your minimum SDK version is 16, you have 2 solution for your problem.
First is use this library:
https://github.com/PaoloRotolo/ExpandableHeightListView
This library makes you able to expand your ListViews to full height and then only your ScrollView will be scrollable.
Second solution is to use NestedScrollView instead of ScrollView and then use RecyclerView instead of ListView. Then you should only disable nestedScrolling for your RecyclerView.
Both solutions will give you your desire behavior.
You can use multiple type item for listview and simplified your layout to become like this
<?xml version="1.0" encoding="utf-8"?><?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/activity_lista__eventi"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:paddingBottom="#dimen/padBottom"
android:paddingLeft="#dimen/padLeft"
android:paddingRight="#dimen/padRight"
android:paddingTop="#dimen/padTop"
tools:context="com.example.fra87.eudroid.activity_class.Lista_Eventi"
>
<SearchView
android:id="#+id/cercaEvento"
android:layout_width="match_parent"
android:layout_height="50dp"
android:queryHint="Evento"
/>
<EditText
android:id="#+id/editText_nome_evento_composto"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_below="#+id/cercaEvento"
android:hint="Nome Evento"
android:textSize="22dip"
/>
<View
android:id="#+id/separatore_liste"
android:layout_width="match_parent"
android:layout_height="5dp"
android:layout_below="#+id/editText_nome_evento_composto"
android:layout_marginBottom="10dp"
android:layout_marginTop="10dp"
android:background="#android:color/darker_gray"
/>
<ListView
android:id="#+id/listViewEventi"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/separatore_liste"
android:layout_centerHorizontal="true"
android:layout_marginTop="15dp"
/>
</RelativeLayout>

no gravity for scrollview. how to make content inside scrollview as center

I want the content inside the scrollView as center.
<ScrollView
android:id="#+id/scroller"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:paddingTop="12dp"
android:paddingBottom="20dp"
android:scrollbarStyle="outsideOverlay"
android:layout_gravity="center" >
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="check"
android:gravity="center_vertical|center_horizontal"/>
</ScrollView>
Note: there is no android:gravity attribute for scrollvew.
any sol:-
I had the same issue and finally figured it out. This is for a vertical ScrollView.
Put your ScrollView inside a RelativeLayout and center it in the RelativeLayout. In order for this to work, your ScrollView should have
android:layout_height="wrap_content"
This is how the final code should look like:
<?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">
<ScrollView
android:id="#+id/scrollView1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_centerVertical="true" >
<LinearLayout
android:id="#+id/linearLayout1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="b1"/>
<Button
android:id="#+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="b2"/>
<Button
android:id="#+id/button3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="b3"/>
</LinearLayout>
</ScrollView>
</RelativeLayout>
How about this?
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/scrollView1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:paddingTop="12dp"
android:paddingBottom="20dp"
android:scrollbarStyle="outsideOverlay" >
<LinearLayout
android:id="#+id/linearLayout1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_gravity="center"
android:gravity="center">
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="check"
android:gravity="center_vertical|center_horizontal"/>
</LinearLayout>
</ScrollView>
I think a more elegant solution would be to use the ScrollView's android:fillViewport property. A ScrollView is a little different in how it treats it's content view (can only have one), even if you set match_parent (fill_parent) to the ScrollView it won't give that much spacing to it's content view, instead the default behavior is for the ScrollView to wrap the content regardless of what you specify for that view. What android:fillViewport does is tell the ScrollViewto stretch its content to fill the viewport (http://developer.android.com/reference/android/widget/ScrollView.html#attr_android:fillViewport). So in this case, your LinearLayout would be stretched to match the viewport and if the height goes behind the viewport then it will be scrollable which is exactly what you want!
The accepted answer won't work properly when the content extends beyond the ScrollView because it will still center the content view first causing it to cut off a portion of the view, and the ScrollView centered in another layout works but just doesn't feel right, besides I think it will also result in a lint error (useless parent or something along those lines).
Try something like this:
<ScrollView
android:id="#+id/scroller"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:paddingTop="12dp"
android:paddingBottom="20dp"
android:scrollbarStyle="outsideOverlay"
android:fillViewport="true">
<LinearLayout
android:id="#+id/content"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:gravity="center">
<Button
android:id="#+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="check" />
</LinearLayout>
</ScrollView>
Just remember that the reason it is being centered here now is because of the android:gravity on the LinearLayout since the ScrollView will stretch the LinearLayout so keep that in mind depending on what you add to the layout.
Another good read on ScrollView although not about centering but about fillViewport is http://www.curious-creature.org/2010/08/15/scrollviews-handy-trick/
Use this attribute in ScrollView
android:fillViewport="true"
Example
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scrollbarStyle="outsideOverlay"
android:fillViewport="true"
>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<!--Your Code goes here-->
</RelativeLayout>
</ScrollView>
Make sure to use Single Child in ScrollView just like in above example which is Relativelayout.
For #Patrick_Boss - what stopped the content from cutting of in my application was to change the gravity and layout_gravity to center_horizontal for the LinearLayout.
It worked for me...but not sure if it will work for you.
Modification of #Ghost's answer -
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/scrollView1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:paddingTop="12dp"
android:paddingBottom="20dp"
android:scrollbarStyle="outsideOverlay" >
<LinearLayout
android:id="#+id/linearLayout1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_gravity="center_horizontal"
android:gravity="center_horizontal">
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="check"
android:gravity="center_vertical|center_horizontal"/>
</LinearLayout>
</ScrollView>
One thing to consider is what NOT to set. Make certain your child controls, especially EditText controls, do not have the RequestFocus property set.
This may be one of the last interpreted properties on the layout and it will override gravity settings on its parents (layout or ScrollView).
using the scroll view inside the ConstraintLayout. It is worked for me
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/white">
<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" />
</ScrollView>
</androidx.constraintlayout.widget.ConstraintLayout>
Scroll view height should be wrap_content
<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"

Categories

Resources