How to Set a Maximum Height With Wrap Content in Android

Android: can height of SlidingDrawer be set with wrap_content?

The onMeasure() method of the SlidingDrawer class basically overrides the layout modes to fill_parent, this is why layout_height="wrap_content" is not working.

To get around this, you can extend SlidingDrawer with a re-implemented onMeasure() method that honors the layout_width and layout_height attributes. You can then use this custom class in your XML layout by replacing <SlidingDrawer ...> with <fully.qualified.package.ClassName ...>.

Note that since the drawer will no longer be filling the parent layout, you will have to enclose it in a LinearLayout with the gravity attribute set to the edge where the drawer should be.

Below are a class I have created for this purpose and an example layout.

WrappingSlidingDrawer class :

import android.content.Context;
import android.util.AttributeSet;
import android.view.View;
import android.widget.SlidingDrawer;


public class WrappingSlidingDrawer extends SlidingDrawer {

public WrappingSlidingDrawer(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);

int orientation = attrs.getAttributeIntValue("android", "orientation", ORIENTATION_VERTICAL);
mTopOffset = attrs.getAttributeIntValue("android", "topOffset", 0);
mVertical = (orientation == SlidingDrawer.ORIENTATION_VERTICAL);
}

public WrappingSlidingDrawer(Context context, AttributeSet attrs) {
super(context, attrs);

int orientation = attrs.getAttributeIntValue("android", "orientation", ORIENTATION_VERTICAL);
mTopOffset = attrs.getAttributeIntValue("android", "topOffset", 0);
mVertical = (orientation == SlidingDrawer.ORIENTATION_VERTICAL);
}

@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {

int widthSpecMode = MeasureSpec.getMode(widthMeasureSpec);
int widthSpecSize = MeasureSpec.getSize(widthMeasureSpec);

int heightSpecMode = MeasureSpec.getMode(heightMeasureSpec);
int heightSpecSize = MeasureSpec.getSize(heightMeasureSpec);

if (widthSpecMode == MeasureSpec.UNSPECIFIED || heightSpecMode == MeasureSpec.UNSPECIFIED) {
throw new RuntimeException("SlidingDrawer cannot have UNSPECIFIED dimensions");
}

final View handle = getHandle();
final View content = getContent();
measureChild(handle, widthMeasureSpec, heightMeasureSpec);

if (mVertical) {
int height = heightSpecSize - handle.getMeasuredHeight() - mTopOffset;
content.measure(widthMeasureSpec, MeasureSpec.makeMeasureSpec(height, heightSpecMode));
heightSpecSize = handle.getMeasuredHeight() + mTopOffset + content.getMeasuredHeight();
widthSpecSize = content.getMeasuredWidth();
if (handle.getMeasuredWidth() > widthSpecSize) widthSpecSize = handle.getMeasuredWidth();
}
else {
int width = widthSpecSize - handle.getMeasuredWidth() - mTopOffset;
getContent().measure(MeasureSpec.makeMeasureSpec(width, widthSpecMode), heightMeasureSpec);
widthSpecSize = handle.getMeasuredWidth() + mTopOffset + content.getMeasuredWidth();
heightSpecSize = content.getMeasuredHeight();
if (handle.getMeasuredHeight() > heightSpecSize) heightSpecSize = handle.getMeasuredHeight();
}

setMeasuredDimension(widthSpecSize, heightSpecSize);
}

private boolean mVertical;
private int mTopOffset;
}

Example layout (assuming WrappingSlidingDrawer is in package com.package) :

<FrameLayout android:layout_width="fill_parent"
android:layout_height="fill_parent">
... stuff you want to cover at full-size ...
<LinearLayout android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="bottom"
android:orientation="vertical">
<com.package.WrappingSlidingDrawer android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:content="@+id/content"
android:handle="@+id/handle">
... handle and content views ...
</com.package.WrappingSlidingDrawer>
</LinearLayout>
</FrameLayout>

How to set max height to scrollView?

Because you're using ConstraintLayout you need to add 2 constraints to your CardView

app:layout_constraintTop 

app:layout_constraintBotttom

And you also need to add the following lines

app:layout_constrainedHeight="true"

app:layout_constraintHeight_max="300dp" // Change this to your maximum height

It should look something like this

<androidx.cardview.widget.CardView 
android:layout_width="0dp"
android:layout_height="wrap_content"
app:cardCornerRadius="@dimen/card_radius_10"
app:layout_constrainedHeight="true"
app:layout_constraintHeight_max="300dp" // Change this to your maximum height
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintBottom_toBottomOf="parent" //Change based on your layout
app:layout_constraintTop_toTopOf="parent"> //Change based on your layout

How to make two CardView height as wrap_content in a linear layout

With ConstranitLayout, it would be easier to adjust the buttons layout on top of the image; and adjust the constraints of both cards to wrap their content.

The app:layout_constraintBottom_toBottomOf="@+id/Card_View" should be changed to:

  • either app:layout_constraintBottom_toBottomOf="parent"
  • or app:layout_constraintTop_toBottomOf="@id/Card_View"

And optionally you can adjust a minimum height constraint with app:layout_constraintHeight_min="100dp" and maximum height constraint with app:layout_constraintHeight_min="200dp".. adjust the sizing to your needs

<androidx.constraintlayout.widget.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="wrap_content"
android:layout_centerInParent="true"
android:background="@color/black"
android:orientation="vertical">

<com.google.android.material.card.MaterialCardView
android:id="@+id/Card_View"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="5dp"
android:layout_marginEnd="5dp"
android:elevation="6dp"
app:cardBackgroundColor="@color/black"
app:layout_constrainedHeight="true"
app:layout_constraintBottom_toTopOf="@id/bottom_card"
app:layout_constraintTop_toTopOf="parent"
app:shapeAppearanceOverlay="@style/RoundedCornerHome">

<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">

<com.google.android.material.imageview.ShapeableImageView
android:id="@+id/imagePostHome"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:adjustViewBounds="true"
android:contentDescription="@string/todo"
android:tag="centerCrop"
app:shapeAppearanceOverlay="@style/RoundedCornerHome" />

<include
android:id="@+id/imagepost_buttons"
layout="@layout/imagepost_buttons" />
</FrameLayout>

</com.google.android.material.card.MaterialCardView>

<com.google.android.material.card.MaterialCardView
android:id="@+id/bottom_card"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="5dp"
android:layout_marginTop="10dp"
android:layout_marginEnd="5dp"
android:layout_marginBottom="10dp"
android:elevation="6dp"
app:layout_constraintHeight_min="100dp"
app:layout_constraintHeight_max="200dp"
app:cardBackgroundColor="@color/dark_grey"
app:layout_constraintBottom_toBottomOf="parent"
app:shapeAppearanceOverlay="@style/RoundedCornerHome">

<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">

<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="top|right"
android:layout_marginTop="5dp"
android:layout_marginEnd="25dp"
android:contentDescription="@string/todo"
android:src="@drawable/ic_baseline_attach_money_24"
tools:ignore="RtlHardcoded" />

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginTop="5dp"
android:fontFamily="@font/roboto"
android:text="Ian Somerhalder"
android:textColor="@color/white"
android:textSize="20sp"
android:textStyle="bold"
tools:ignore="SmallSp" />

<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="left|center_vertical"
android:layout_marginLeft="10dp"
android:fontFamily="@font/roboto"
android:text=".............."
android:textColor="@color/white"
android:textSize="17sp"
tools:ignore="RtlHardcoded" />

</FrameLayout>


</com.google.android.material.card.MaterialCardView>


</androidx.constraintlayout.widget.ConstraintLayout>

UPDATE

but now the bottom card view is not maintaining the min and max height

Here using the min & max constraints will limit the height of the TextView to a min & max values; but it still wraps its content if its height doesn't exceed the min & max values.

You can solve this by replacing the FrameLayout with a ConstraintLayout; actually using FrameLayout here can make inner views overlap with one another:

    <androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">

<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:layout_marginEnd="25dp"
android:layout_marginRight="25dp"
android:contentDescription="@string/todo"
android:src="@drawable/ic_baseline_attach_money_24"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:ignore="RtlHardcoded" />

<TextView
android:id="@+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginTop="5dp"
android:fontFamily="@font/roboto"
android:text="Ian Somerhalder"
android:textColor="@color/white"
android:textSize="20sp"
android:textStyle="bold"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:ignore="SmallSp" />

<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="10dp"
android:layout_marginLeft="10dp"
android:fontFamily="@font/roboto"
android:text=".............."
android:textColor="@color/white"
android:textSize="17sp"
app:layout_constraintTop_toBottomOf="@+id/title"
tools:ignore="RtlHardcoded" />

</androidx.constraintlayout.widget.ConstraintLayout>



Related Topics



Leave a reply



Submit