RelativeLayout inside ScrollView only puts widgets into the screen box - android

Is it possible to use long lists of widgets inside RelativeLayout, which in turn is wrapped into ScrollView.
<ScrollView
android:id="#+id/scrollView1"
android:layout_width="match_parent"
android:layout_height="800dp"
android:fillViewport="true" >
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="800dp"
>
<TextView
android:id="#+id/screen_size_label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginLeft="50dp"
android:layout_marginTop="30dp"
android:text="#string/screen_size" />
<TextView
android:id="#+id/screen_size_label2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/screen_size_label"
android:layout_below="#+id/screen_size_label"
android:text="#string/screen_size_label" />
<TextView
android:id="#+id/screen_size_label3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/screen_size_label"
android:layout_below="#+id/screen_size_label2"
android:text="#string/screen_size_label" />
// each following child uses android:layout_below="#+id/previous"
When I paste considerable amount of widgets so that the bottom of the screen is achieved the next don't get placed under the previous ones, as I expected, but instead they try to fit in the screen-box resulting in mess. What I need instead is to place them one under another - so that those that don't fit into screen-box become accessible through scrolling.
It works fine when I use LinearLayout instead of RellativeLayout, however I'd like to get use of RelativeLayout if it's possible.
Thanks.

Change the height of Scrollview and RelativeLayout to "fill_parent"

You define scrollview's height and relativelayout's height to same, then its' no need to scroll. So you change scrollview's height to fill_parent, and relativelayout's height to wrap_content.

What if you change the height of the Scrollview and RelativeLayout ..
<ScrollView
android:id="#+id/scrollView1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true" >
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
>

Related

Scrollview doesn't scroll after resizing it's child using animation

I have a LinearLayout inside a ScrollView. At some point I collapse and expand the LinearLayout. After that the scrollview does scroll. Any ideas?
<ScrollView
android:id="#+id/scrollView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fillViewport="false">
<LinearLayout
android:id="#+id/detailsView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:visibility="visible"
>
........
</LinearLayout>
</ScrollView>
Expand and collapse is done using ValueAnimator over LayoutParams (height) of the LinearLayout.
Update: I think important is that it breaks down after animated expansion/collapse. Until that it works fine.
Update 2: For expanding again, I measured the expected height as follows:
int expectedHeight = detailsView.measure(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT);
and animate expansion to that height. This measured the height to 2000+ instead of expected 800 something. Thus the sizes were equal and scrollview didn't scroll, although it didn't show the full hierarchy.
As a quick-fix I save the current height before collapsing and use it as the target height on expanding. The question is, can this be done automatically without dirty-height saving?
your scrollview is android:layout_height="wrap_content" just make it match_parent. I'm not sure but you can remove android:fillViewport too
<ScrollView
android:id="#+id/scrollView"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<LinearLayout
android:id="#+id/detailsView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:visibility="visible"
>
........
</LinearLayout>
</ScrollView>

What am I misunderstanding about aligning views at the bottom?

I tried to align my linearlayout at the bottom of my entire layout which is relative, and found the solution here that does it: How to align views at the bottom of the screen?
But why wouldn't this work also?
<RelativeLayout 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"
tools:context="com.sandbox.activities.ListActivity">
<ListView
android:id="#+id/my_listview"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<LinearLayout
android:id="#+id/search_footer"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/my_listview"
android:orientation="horizontal"
android:layout_alignParentBottom="true">
<EditText
android:id="#+id/my_edittext"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:hint="Enter Search Term" />
<Button
android:id="#+id/find_button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Find"
android:onClick="findThings"/>
</LinearLayout>
If the listview turns out to be short, like 1 row, "search_footer" is just underneath it, and there is a huge gap below it.
1) "search_footer" is told to align at the bottom of the parent, which is the relativelayout. Since the relativelayout's height is match_parent, and it's the root layout, this means the whole height of the screen, so why wouldn't "search_footer" be at the bottom of the screen no matter the size of the listview?
2) Also, if I change the search_footer's height to match_parent, I expected a really tall button, but it remained unchanged-why?
Add to ListView this attribute
android:layout_above="#id/search_footer"
and remove
android:layout_below="#id/my_listview"
attribute from LinearLayout.
You specified that search_footer align to bottom of parent but also to be below the listview, so in the case that the list is short the search footer just stretches in the space between the listview and the bottom of the screen. you want to specify the footer to be aligned to the bottom of the parent and the listview to be above it:
<ListView
android:id="#+id/my_listview"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="#+id/search_footer"
/>
<LinearLayout
android:id="#+id/search_footer"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_alignParentBottom="true">
When you change the height of the search_footer the buttons doe't change because they are set to android:layout_height="wrap_content". Your layout would normally change when you do this however in this case it didn't change either, due to the same reason as above

Custom Button Class not resizing based on layout_weight android

I have a CircularMeter class which is derived from Button. The problem is that it is not resizing even if the weight given is 0.5 (ie. half the vertical screen).
<LinearLayout
android:id="#+id/WidgetDataLayout"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_alignParentTop="true"
android:layout_weight="0.5"
android:orientation="vertical"
android:layout_gravity="center_horizontal">
<com.test.CircularMeter
android:id="#+id/cm1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center_horizontal" />
</LinearLayout>
Any Ideas ?
You can take help from this example to make your circularmeter fill half of the vertical screen
eg.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:weightSum="1">
<LinearLayout
android:id="#+id/linearLayout"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_gravity="center_horizontal"
android:layout_weight="0.5"
android:background="#123456"
android:orientation="vertical" >
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#123456"
android:text="#string/hello_world" />
</LinearLayout>
</LinearLayout>
There's no layout_weight in CircularMeter.
It's parent LinearLayout has both android:layout_alignParentTop="true" and android:layout_weight="0.5" which is not correct since layout_alignParentTop is a layout attribute for a RelativeLayout parent while android:layout_weightis an attribute for a LinearLayout parent. The layout XML does not show what is the parent layout actually is. android:layout_height="0dp" would make the layout invisible unless there really is a vertical LinearLayout as a parent.
Also note that layout_weight="0.5" won't make the view size half the screen. After doing first pass layout for a linear layout, the weight mechanism just distributes any remaining space in proportion of element weights. By default an element's weight is 0. So if you have just one element with non-zero weight, it will get all remaining space in its linear layout parent.

Equal button height for RelativeLayout (while still filling up all space)

I have an Android application that goes about like this:
<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">
<RelativeLayout
android:id="#+id/toplayout"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.90" >
<Button
android:id="#+id/button_1_of_10"
android:layout_width="70dip"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:text="#string/text_0x1701" />
<Button
android:id="#+id/button_2_of_10"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignRight="#+id/button_1_of_10"
android:layout_below="#+id/button_1_of_10"/>
<!--Another 8 buttons-->
<RelativeLayout
android:id="#+id/contentpane"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_toRightOf="#+id/button_1_of_10" >
</RelativeLayout>
</RelativeLayout>
<RelativeLayout
android:id="#+id/actionbuttonslayout"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.10">
</RelativeLayout>
</LinearLayout>
I need the 10 buttons to fill up the entire height from the top to the footer (the 0.1 weighted RelativeLayout), while all the buttons keep an equal height. However, I want to know whether there is a kind of equivalent to the layout_weight from LinearLayout, but for RelativeLayouts, as it's not performant to have nested weights in LinearLayouts. I'm not really looking for other solutions, because I still have some thing to try, but I want to know whether or not this is possible?
My question, just to be clear, is: Is it possible to have an amount of Buttons with an equal height in a RelativeLayout and at the same time fill up all the available space?
To use weight you need to use a LinearLayout, just make a linear layout with the buttons take the space you want and then on each button inside have android:layout_height="0dp" and also a android:layout_weight="1"
You don't need to sum all the weights to 1, just think of items with the same weight have the same size

Adding view to bottom of layout inside a scrollview

So my layout looks basically like this:
<ScrollView>
<RelativeLayout>
<BunchOfViews/>
<ImageView android:layout_alignParentBottom="true"/>
</RelativeLayout>
</ScrollView>
I have the ScrollView so all of the layout always is visible no matter the height of the screen. The problem is that on a very high screen, I still want my ImageView to be at the bottom. However, a child of a ScrollView don't seem to have a defined bottom. The View is placed at the top of the layout. How can I solve this problem in a neat way?
I ran into the same issue. I never could find a very pleasing solution, but here is how I did it. Maybe someone else has a better way, I hate adding layouts that don't do anything.
My hack was to add a dummy linearlayout at the bottom of the scrollview that has fill_parent to take up all the room and force the scrollview to fill the screen. Then add whatever component I want to that linearlayout.
Here is one of my layouts that does this:
<ScrollView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:fillViewport="true" >
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginTop="15px" >
<!-- bunch of components here -->
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_below="#+id/spinner"
android:layout_marginTop="5px"
android:gravity="center_horizontal|bottom"
android:paddingTop="2px" >
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingLeft="20px"
android:paddingRight="20px"
android:text="Delete" />
</LinearLayout>
</RelativeLayout>
</ScrollView>
I had the same issue and found this page:
http://www.curious-creature.org/2010/08/15/scrollviews-handy-trick/
Basically, you set the ScrollView's android:fillViewport to true, which will allow the child view to expand to the same height as the ScrollView itself, filling out the space. You then just need to have one of the child controls' layout_height set to fill_parent and layout_weight to 1, causing that control to "spring" to fill the empty space.
Note that if the contents of the ScrollView are already tall enough to fill the ScrollView, the android:fillViewport has no effect, so the setting only kicks in when needed.
My final XML looks like similar to this:
<ScrollView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:fillViewport="true">
<LinearLayout
android:orientation="vertical"
android:layout_height="wrap_content">
<LinearLayout
android:layout_height="fill_parent"
android:layout_weight="1">
<!-- this expands to fill the empty space if needed -->
</LinearLayout>
<!-- this sits at the bottom of the ScrollView,
getting pushed out of view if the ScrollView's
content is tall enough -->
<ImageView
android:layout_height="wrap_content"
android:src="#drawable/footer_image">
</ImageView>
</LinearLayout>
</ScrollView>
it seems that the linearlayout isn't necessary, all that is important is the fillViewPort.
you could just use
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottomParent="true">
now that you have specified the relativelayout to be at least the size of the screen.
its work for me perfectly android:fillViewport="true"
Joel Malone's answer Adding view to bottom of layout inside a scrollview does that trick. My solution is almost the same, except that I use Space widget to do the work of filling the rest height inside the parent layout. Like this:
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true"
>
<LinearLayout
android:orientation="vertical"
android:layout_height="wrap_content"
>
<android.support.v4.widget.Space
android:layout_height="match_parent"
android:layout_weight="1"
/>
<ImageView
android:layout_height="wrap_content"
android:src="#drawable/footer_image"
/>
</LinearLayout>
</ScrollView>
Attention:
fill_parent in the other answers is noted as deprecated for a long time;
Compare to an empty LinearLayout to fill the rest of parent layout, I think Space is much more appropriate(it's designed to do that job.)
Finally, don't forget that important attribute at the beginning of ScrollView: android:fillViewport="true". They together make this trick.
just put this attribute android:fillViewport="true" to your ScrolView
and you will got what you need
On your view that you want to be at the bottom use android:gravity="bottom"
From: http://code.google.com/p/k9mail/source/browse/k9mail/trunk/res/layout/account_setup_basics.xml?r=1314
This should help you:
<RelativeLayout
android:layout_marginTop="-45dip"
android:padding="0dip"
android:layout_alignParentBottom="true"
android:gravity="bottom|right"
android:background="#android:drawable/bottom_bar"
android:layout_height="fill_parent"
android:layout_width="fill_parent">
<Button
android:id="#+id/manual_setup"
android:text="#string/account_setup_basics_manual_setup_action"
android:minWidth="#dimen/button_minWidth"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_marginBottom="-4dip"
android:layout_alignParentLeft="true"
android:layout_centerVertical="false"
/>
<Button
android:id="#+id/next"
android:text="#string/next_action"
android:minWidth="#dimen/button_minWidth"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:drawableRight="#drawable/button_indicator_next"
android:layout_marginBottom="-4dip"
android:layout_alignParentRight="true"
android:layout_centerVertical="false"
/>
</RelativeLayout>
ScrollView view = new ScrollView( this );
ScrollView.LayoutParams lps = new FrameLayout.LayoutParams( FILL_PARENT, FILL_PARENT, Gravity.CENTER );
LinearLayout layout = new LinearLayout( this );
// what ever you want in the Layout
view.addView( layout, lps );
I tried alot to align the Scroll View to bottom of the screen but thats not possible according to this link.
https://newbedev.com/how-do-i-align-views-at-the-bottom-of-the-screen
The way i found was to create a view with 1dp height and aa id (lets say android:id="#+id/bottomView") at the bottom of your XML page.
now just add these attributes to your scroll view..
<ScrollView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:scrollbars="vertical"
android:fillViewport="true"
android:layout_alignBottom="#+id/bottomView"
>
Here is how you can use a ConstraintLayout to align the image view at the bottom:
<?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"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/content_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:id="#+id/text_view"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="Text 1"
app:layout_constraintBottom_toTopOf="#+id/space_view"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="parent" />
<Space
android:id="#+id/space_view"
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintBottom_toTopOf="#+id/image_view"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/text_view" />
<ImageView
android:id="#+id/image_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="..."
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/space_view" />
</androidx.constraintlayout.widget.ConstraintLayout>
</ScrollView>

Categories

Resources