I have no idea how this can happen, but I have a ConstraintLayout with a CardView inside. Inside said CardView is a LinearLayout. That LinearLayout overlaps the parent on the end. Check the screenshot for more info. If I remove the android:layout_margin from the cardView, the inner layout looks good again, but adding margin to start seems to just push the entire layout to and over the end of the parent. It doesnt matter what sort of layout is used inside the CardView. The issue affects them all.
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:animateLayoutChanges="true"
android:background="#color/colorWhite">
..
<androidx.cardview.widget.CardView
android:id="#+id/wakeuptimer_status_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="#dimen/md_keylines"
app:layout_constraintTop_toTopOf="parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
.....
You need to change the Linearlayout height to match-parent instead of wrap_content. With wrap_content you aren't restricting the size of the Linearlayout view to the size of the CardView.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
Related
I have the following structure for a fragment:
<androidx.constraintlayout.widget.ConstraintLayout
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" >
<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toTopOf="#+id/credential_save_button">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
..................
</LinearLayout>
</ScrollView>
<TextView
android:id="#+id/credential_save_button"
android:background="#android:color/transparent"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingTop="10dp"
android:paddingBottom="10dp"
android:textColor="#color/white"
android:textSize="#dimen/textSize"
android:text="#string/save_initialize"
android:drawableEnd="#drawable/button_right_arrow_blue"
tools:ignore="UseCompatTextViewDrawableXml"
app:layout_constraintBottom_toBottomOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
My expectation is that the save button would be locked to the bottom of the fragment, taking up as much height as it needs to, then the rest of the fragment would be filled with the scrollview and its fields.
Instead the scroll view exceeds the bounds of the Fragment, overlapping the save button and other elements on the page. It seems to always exceed the bounds by about half an element at the top and bottom (would guesstimate it as 20-30dp), no matter how many elements I add to it. If it has few elements in it such that it does not need to scroll, then everything appears correct and no elements are exceeding the bounds of the Fragment.
Changing it to a nested scroll view or adding the fill fillViewport attribute to it does not change anything.
Try setting
android:layout_height="0dp"
for the ScrollView to get it to expand from the top of the layout to the top of the TextView.
Also, don't specify match_parent for any child of ConstraintLayout. Always use 0dp and the appropriate constraints.
I have wrapped an activity in an scroll view like following.
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true"
>
<include layout="#layout/content_form" />
</ScrollView>
I have around 15 fields in the content_form layout, the issues is that the last item in content_form layout is attached with bottom.
I need to add a margin below the scroll view, i have tried giving margin to scrollviewand the last item of content_form field, but nothing is working.
I need to know how to add margin at the bottom of page when using scroll view.
If you want the scrolling margin to be within the content, it would be best to add it to content_form. You should be able to accomplish this by either adding paddingBottom to your parent container in that layout, or layout_marginBottom on your last view aligned to the parent bottom.
This make padding under the last item in scroll view. may be good for you
<androidx.core.widget.NestedScrollView
android:layout_width="match_parent"
android:paddingBottom="80dp"
android:clipToPadding="false"
android:layout_height="match_parent">
You can either use Space or View for the purpose like
<Space
android:layout_width="100dp"
android:layout_height="match_parent"/>
Or,
<View
android:layout_width="100dp"
android:layout_height="match_parent"
android:layout_weight="1"/>
Here, you need to give padding, not margin.
Try giving padding to the ScrollView.
I've had issues with ScrollView being ill-behaved when it's direct childview is not a LinearLayout. So please try LinearLayout as direct child of your scrollView and place <include> layout inside LinearLayout.
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
... your layouts go here ...
</LinearLayout>
</ScrollView>
Does anyone know how to have a floating Cardview like this?
http://chairnerd.seatgeek.com/images/autocomplete_checkout.gif
The background image should be able to change programmatically and the cardviews should be scrollable. And the position of the first Cardview should be somewhere below the image. Thanks in advance!
I figured it out myself and I will post my solution here in case anyone run into the same situation.
Here how the layout file should look like:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:focusableInTouchMode="true"
android:background="#color/bgGrey">
<ImageView
android:layout_width="match_parent"
android:layout_height="125dp"
app:srcCompat="#drawable/soccer"
android:id="#+id/imageView"
android:scaleType="centerCrop"/>
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_marginTop="120dp">
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="6dp">
EDIT: Within the LinearLayout, something like a place holder should be added. Otherwise a part of the content at the end would not be shown. So I used a textview to do so.
<TextView
android:layout_width="match_parent"
android:layout_height="120dp" />
Note: The height here should match the marginTop in the LinearLayout
Yes it is a cardView directly on a ScrollView, or a ListView simply with the item's layout with background transparency.
The scrollview/listview is placed on a FrameLayout or RelativeLayout. Either there is a padding/margin on top, or a "stub" first element which is transparent".
Bellow (declared first in the parent layout) the scrollview/listview you can place an image or any other static component whatsoever.
And above you can place other floating components (like the Check-out button on your example)
Is there any way to put my FrameLayout between 1.1 and 1.3.
I tried to use layout_below and layout_above for it, but it doesn't work together.
1.RelativeLayout
1.1RelativeLayout (strict_size)
1.2FrameLayout (match_parent)
1.3RelativeLayout(strict_size)
I would use a LinearLayout. Assuming you are talking about heights:
<LinearLayout
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="20dp">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="20dp">
</LinearLayout>
When using layout_weight like that, LinearLayout will first lay out views with fixed dimensions, and then assign all the remaining space to the layout_weight="1" view.
I want to use two child layout (one linear layout and one relative layout) inside a parent layout (relative layout) in such a way that both of the child layout will take exactly half of the screen and items inside of each child layout will not cause one child layout to get more width than another one!
It is pretty easy, use parameter layout_weight in children of LinearLayout, something like this:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="match_parent">
</RelativeLayout>
<RelativeLayout
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="match_parent">
</RelativeLayout>
</LinearLayout>
If I understand correctly from your illustration, the red box is a RelativeLayout, whereas the green boxes are a LinearLayout and a RelativeLayout.
A simple solution would be to center an empty View inside the RelativeLayout and align the two child Views against it:
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_toLeftOf="#+id/v_center" />
<View
android:id="#+id/v_center"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_centerInParent="true" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_toRightOf="#+id/v_center" />
</RelativeLayout>
A nice little bonus here is that you can provide some spacing between the two by specifying the View's dimensions.
Beware, however, that RelativeLayouts aren't very efficient, and nesting them is an especially bad idea. I suggest using the hierarchy viewer tool to inspect the layout timings to make sure it's relatively fast, and to try to avoid nesting the layouts in this fashion.