What is the right way to have a scrollable bottom view?
<ScrollView 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:fillViewport="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/white"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
style="#style/wrnTextP1"
android:text="Ok , batatas "/>
<android.support.v4.widget.Space
android:layout_height="0dp"
android:layout_width="match_parent"
android:layout_weight="1" />
<Button
style="#style/FullWidthButton"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:text="Chega por hoje!" />
</LinearLayout>
at the preview its looke fine, but when I run it on the emulator the view(in this case: the button) its not at bottom at all.
I think you are misunderstanding how ScrollView is meant to be used. The LinearLayout child of your ScrollView has a match_parent height... if your ScrollView is the same height as the screen, and the LinearLayout is the same height as the ScrollView, then there's nothing to scroll (all the content is the size of the screen).
The direct child of a ScrollView should either have a fixed height (like 2000dp) or use wrap_content.
If you use a fixed height, then the rest of your code "works"; you can have a Space element that uses layout_weight to push the last view down to the bottom of your LinearLayout. However, if you're using wrap_content, this is impossible (since there's no "extra" space for the layout_weight to consume).
Instead, you could consider putting the "bottom" view outside of the ScrollView. Something like this:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<ScrollView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
...
</ScrollView>
<Button
style="#style/FullWidthButton"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Chega por hoje!" />
</LinearLayout>
Related
When I set MATCH_PARENT for View + layout_weight the elements of the view behave strangely. Please can you explain why this is so. For example, here is the code on which to experiment. I can't understand the pattern. The less put the weight of the item, so it is more, however, it is unclear how many times.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"
android:weightSum="5"
tools:context=".MainActivity">
<LinearLayout
android:layout_weight="1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#FF0"
android:orientation="horizontal">
</LinearLayout>
<LinearLayout
android:layout_weight="1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#F00"
android:orientation="horizontal">
</LinearLayout>
<LinearLayout
android:layout_weight="1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#F0F"
android:orientation="horizontal">
</LinearLayout>
<LinearLayout
android:layout_weight="1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#0FF"
android:orientation="horizontal">
</LinearLayout>
<LinearLayout
android:layout_weight="1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#00F"
android:orientation="horizontal">
</LinearLayout>
</LinearLayout>
Testing for Yellow layout: set layout_weight= 0.5 > large?? how much bigger? Did the elements shrink in size or were they thrown out of the parent?
<LinearLayout
android:layout_weight="0.5"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#F00"
android:orientation="horizontal">
</LinearLayout>
Update, PS: I know how the layout will work with WRAP_CONTENT (or 0dp). If you set MATCH_PARENT + layout_weight, then we have a fixed element size regardless of the content, when WRAP_CONTENT does not guarantee a fixed size from the content (and if the content size is increased, the element will be stretched). I am only interested in the pattern MATCH_PARENT + layout_weight, because it guarantees the block size when the content size is exceeded.
The less put the weight of the item, so it is more...
The reason is because you are assigning android:layout_width as match_parent to all LinearLayout. To get android:layout_weight worked, you should set android:layout_width as 0.
First of all, give android:weightSum to the parent of the layouts.
Secondly, if you have layouts placed horizontally next to each other then set android:layout_width="0dp" for each element.
Similarly, for vertically aligned elements, give android:layout_height="0dp".
I can't make a ScrollView properly scrolling. It always cut off the content on the bottom, as if it were a normal LinearLayout.
My code:
<?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="fill_parent"
android:layout_height="match_parent"
android:fillViewport="true"
tools:context="com.android.dadiperpus.MainActivity">
I put LinearLayout inside ScrollView
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/logo_stan"
android:orientation="vertical"
android:weightSum="10">
Then I put RelativeLayout inside LinearLayout
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="2">
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center_horizontal|center_vertical"
android:text="CONTOH BRO"
android:textSize="32sp" />
</RelativeLayout>
Here I use Gridlayout
<GridLayout
android:id="#+id/mainGrid"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="8"
android:alignmentMode="alignMargins"
android:columnCount="2"
android:columnOrderPreserved="false"
android:padding="14dp"
android:rowCount="3">
Then I put couple of this code inside GridLayout
<android.support.v7.widget.CardView
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_columnWeight="1"
android:layout_marginBottom="16dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:layout_rowWeight="1"
app:cardCornerRadius="8dp"
app:cardElevation="8dp">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal|center_vertical"
android:layout_margin="16dp"
android:orientation="vertical">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:src="#drawable/logo_stan" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Pengantar Kepabeanan"
android:textAlignment="center"
android:textColor="#android:color/black"
android:textSize="18sp"
android:textStyle="bold" />
</LinearLayout>
</android.support.v7.widget.CardView>
I already tried to wrap ScrollView inside LinearLayout and it didn't change anything at all.
I put LinearLayout inside ScrollView
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/logo_stan"
android:orientation="vertical"
android:weightSum="10">
This linearlayout needs to use wrap_content for its height. By using match_parent, you're saying you want the linearlayout to only be as tall as the scrollview that's hosting it... which means it will cut off all the "scrollable" content. By using wrap_content (or some fixed height that's larger than the scrollview) you will have more content in the linearlayout than is visible on one screen, and then scrolling will work as expected.
On removing weightsum from Linear Layout, layout_weight from Relative Layout and Grid Layout , your scrollview will scroll (only in case if content is more than screen size). Give height to all these layouts ( Relative Layout and Grid Layout) wrap_content instead of 0dp.
Actually what happen in your code is : You have given Linear Layout's height match_parent (equal to screen size) and weightsum 10. And Then you give Relative Layout layout_weight = 2 and grid layout's layout_weight = 8 which means relative layout is taking 2 parts of screen and grid layout is taking 8 parts of screen. In this case, your content will never grow more than scree size and grid layout try to fit in screen due to which, your content get cut off at bottom.
Hope, It will help you.
Thanks
I have a LinearLayout, the direct child of a ScrollView, with two children. The first child can be almost any height (it's an Image), but the second child will have content that is much larger than the height of the viewport. I tried using layout_weight to achieve this, but that only resulted in the image being set to something like 1dp and the second child taking the rest, because the weights are only assigned to the remaining space.
How do I force the image to take up at least 40% of the screen space?
<ScrollView
android:id="#+id/scroll_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:orientation="vertical">
<ImageView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="2"
android:src="#drawable/my_image" />
<LinearLayout
android:id="#+id/prediction_container"
android:layout_width="match_parent"
android:layout_height="0dp"
android:background="#android:color/white"
android:orientation="vertical"
android:layout_weight="1">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="[really long text]" />
</LinearLayout>
</LinearLayout>
</ScrollView>
You're missing android:adjustViewBounds="true" on your ImageView
Change your ImageView code to something like this
<ImageView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="4"
android:src="#drawable/my_image"
android:adjustViewBounds="true"
/>
So I have a two "sections" to my screen. I have the top section which is a ScrollView and a bottom section which is random text. The random text at the bottom will always be changing sizes, so sometimes it can take 40dp, sometimes 20dp, etc.
My question is, is there a way to make the bottom part dynamic (without loss of text) and make the top scrollview adapt to the new size and restricts its own size to "fill the remaining space" based on what portion the bottom part is using?
Like this:
As you can see, the scroll view just fills the remaining space available.
I'm searching for a solution using XML only
Need HELP!
You can try this.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/bottomTextView">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="500dp"
android:background="#android:color/holo_red_dark"
android:text="Test" />
</LinearLayout>
</ScrollView>
<TextView
android:id="#+id/bottomTextView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:background="#android:color/darker_gray"/>
Or
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<ScrollView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="500dp"
android:background="#android:color/holo_red_dark"
android:text="Test" />
</LinearLayout>
</ScrollView>
<TextView
android:id="#+id/bottomTextView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/darker_gray"/>
Wrap both Views in a vertical LinearLayout;
The view which is at the top: height = "0dp", weight = 1
And the view which is in the bottom: height = "wrap_content"
I am trying to create a HorizontalScrollView which will be exactly 3 times the screen width. I have tried the following code, but the scrollview will not scroll. How can I set it so that the 3 LinearLayouts inside the main LinearLayout are each the width of the screen?
<HorizontalScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true">
<!-- the container for all the pages -->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="100dp"
android:background="#000000"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="100dp"
android:background="#FF0000"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="100dp"
android:background="#FF0000"/>
</LinearLayout>
Note that if I give the LinearLayouts a specific width, the scrollview does scroll, but I need each LinearLayout to have the width of the screen.
You will need to use wrap_content on your top LinearLayout, and set the width of the child LinearLayouts programmatically.