How to readjust Constraint Layout - android

In my app, I have a custom layout that use Constraint Layout to display two views as follow.
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.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"
android:orientation="vertical">
<android.support.constraint.Guideline
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/guideline2"
android:orientation="horizontal"
tools:layout_editor_absoluteY="444dp"
tools:layout_editor_absoluteX="0dp"
app:layout_constraintGuide_percent="0.5"/>
<CategorySelectionLayout
android:id="#+id/categoryList"
android:layout_width="0dp"
android:layout_height="0dp"
android:orientation="horizontal"
android:gravity="center_vertical"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="#+id/guideline2"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintRight_toRightOf="parent" />
<CategoryNavigationLayout
android:id="#+id/navigation"
android:layout_width="0dp"
android:layout_height="0dp"
android:orientation="horizontal"
android:gravity="center_vertical"
android:paddingLeft="#dimen/one_grid"
tools:layout_manager="android.support.v7.widget.LinearLayoutManager"
tools:listitem="#layout/order_selection_item"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintHorizontal_bias="1.0"
app:layout_constraintBottom_toTopOf="#+id/guideline2" />
</android.support.constraint.ConstraintLayout>
Now imagine when there's nothing to display inside categoryList, I'd like to hide it(View.GONE) then resize the constraint layout to only use the space required for navigation layout.
I have tried to set visibility inside custom view.
this.visibility = View.GONE
this.parent.requestLayout()
The view is now hidden but parent did not adjust the size accordingly.
So how do I force this ConstraintLayout to readjust it's size?

The problem you encounter is simply that your second view is constrained by the guideline -- as is the first view. The guideline itself is constrained to the container.
What that means is that it doesn't matter that you mark your first view as GONE -- yes, it will disappear, but this will not impact the layout at all:
the guideline is constrained to the parent, so it doesn't care
the view that is visible is constrained to the parent and the guideline,
so doesn't care either.
So it's perfectly normal that nothing changes other than the view disappearing.
To do what you want, you could instead do something like that:
final View viewA = findViewById(R.id.viewA);
final View guideline = findViewById(R.id.guideline);
Button button = (Button) findViewById(R.id.button);
button.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
ConstraintLayout.LayoutParams params = (ConstraintLayout.LayoutParams) guideline.getLayoutParams();
if (viewA.getVisibility() == View.GONE) {
viewA.setVisibility(View.VISIBLE);
params.guidePercent = 0.5f;
} else {
viewA.setVisibility(View.GONE);
params.guidePercent = 0;
}
guideline.setLayoutParams(params);
}
});
This will change the position of the guideline, which will make the layout react.
I'm pasting the XML just to be exhaustive, but it's pretty much what you had:
<android.support.constraint.Guideline
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/guideline"
android:orientation="horizontal"
tools:layout_editor_absoluteY="303dp"
tools:layout_editor_absoluteX="0dp"
app:layout_constraintGuide_percent="0.50248754" />
<View
android:id="#+id/viewA"
android:layout_width="0dp"
android:layout_height="0dp"
android:background="#color/colorAccent"
android:text="Button"
app:layout_constraintBottom_toTopOf="#+id/guideline"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<View
android:id="#+id/viewB"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginTop="8dp"
android:background="#color/colorPrimary"
android:text="Button"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="#+id/guideline" />
<Button
android:id="#+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="16dp"
android:layout_marginEnd="24dp"
android:layout_marginRight="24dp"
android:text="Toggle"
app:layout_constraintBottom_toBottomOf="#+id/viewB"
app:layout_constraintRight_toRightOf="#+id/viewB" />

Related

How to animate all elements that are constrained to a ConstraintLayout?

I have a ConstraintLyout(parent layout) that is inside another ConstraintLayout(child layout). Also, I have different elements like a CardView, an ImageView and a View that are constrained to some parts of the child ConstraintLyout. What I want is to animate this ConstraintLayout(child layout) and all the elements that are constrained to it such us the the CardView the ImageView and the View.
This is the xml:
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/layoutparent"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/layoutchild"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toBottomOf="#id/guideline"
>
</androidx.constraintlayout.widget.ConstraintLayout>
<androidx.constraintlayout.widget.Guideline
android:id="#+id/guideline"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_percent="0.3" />
<androidx.cardview.widget.CardView
android:id="#+id/card"
android:layout_width="0dp"
android:layout_height="0dp"
app:cardBackgroundColor="#color/yellow"
app:cardCornerRadius="10dp"
app:cardElevation="1dp"
app:layout_constraintBottom_toBottomOf="#id/layoutparent"
app:layout_constraintEnd_toEndOf="#id/layoutparent"
app:layout_constraintStart_toStartOf="#id/layoutparent"
app:layout_constraintTop_toTopOf="#id/layoutparent" />
<ImageView
android:id="#+id/imageView"
android:layout_width="0dp"
android:layout_height="0dp"
android:background="#drawable/back"
android:scaleType="fitXY"
app:layout_constraintTop_toTopOf="layoutchild"
app:layout_constraintEnd_toStartOf="view"
app:layout_constraintStart_toStartOf="layoutchild"
app:layout_constraintTop_toTopOf="layouthild"
/>
<View
android:id="#+id/view"
android:layout_width="0dp"
android:layout_height="0dp"
android:background="#color/vbg"
android:elevation="1dp"
app:layout_constraintBottom_toBottomOf="#id/layoutchild"
app:layout_constraintEnd_toEndOf="#id/layoutchild"
app:layout_constraintStart_toEndOf="#id/imageView"
app:layout_constraintTop_toTopOf="#id/layoutchild" />
</androidx.constraintlayout.widget.ConstraintLayout>
I have tried using startAnimation of the child constraint layout, bit it hasn't worked:
ConstraintLayout childlayout = findViewById(R.id.layoutchild);
Animation slide_up = AnimationUtils.loadAnimation(getApplicationContext(),
R.anim.slide_up);
childlayout.startAnimation(slide_up);

Bug: Barrier connected with "percent height" in ConstraintLayout is inside a ScrollView

I have a ScrollView which has a ConstraintLayout.
Inside the ConstraintLayout I want to position a View to the bottom of a Barrier.
The Barrier itself has constraints: a Guideline(it can be also a view with height half of parent) which is half of the ConstraintLayout and a TextView.
The issue here is that the ConstraintLayout will expand even more (adds more scrollable area) because of the half of screen percentage calculation.
<?xml version="1.0" encoding="utf-8"?>
<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="match_parent"
tools:context=".MainActivity">
<ScrollView
android:id="#+id/scrollView"
android:layout_width="100dp"
android:layout_height="200dp"
android:background="#39537A4B"
android:fillViewport="true"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<View
android:id="#+id/topHalf"
android:layout_width="10dp"
android:layout_height="0dp"
android:background="#99B146B8"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHeight_percent="0.5"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.0" />
<View
android:id="#+id/bottomHalf"
android:layout_width="10dp"
android:layout_height="0dp"
android:background="#99B89F46"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHeight_percent="0.5"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="1.0" />
<TextView
android:id="#+id/text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Do smth \n\n\n\n\n\n\nasdasda"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<androidx.constraintlayout.widget.Guideline
android:id="#+id/guideline"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_percent="0.5" />
<androidx.constraintlayout.widget.Barrier
android:id="#+id/barrier"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:barrierDirection="bottom"
app:constraint_referenced_ids="guideline, text" />
<View
android:id="#+id/view"
android:layout_width="60dp"
android:layout_height="40dp"
android:background="#651F7878"
app:layout_constraintStart_toStartOf="#id/barrier"
app:layout_constraintTop_toBottomOf="#id/barrier" />
</androidx.constraintlayout.widget.ConstraintLayout>
</ScrollView>
</androidx.constraintlayout.widget.ConstraintLayout>
Try changing the Barrier constraints to:
app:constraint_referenced_ids="text"
And you understand that Barrier brakes the calculations.
I know how to solve this layout issue from java, I want a solution from xml. It can be this is a bug on ConstraintLayout
This behavior is odd and is definitely related to the barrier and a wrap_content ConstraintLayout Here is a simplified layout that showcases the behavior.
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/holo_blue_light"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<View
android:id="#+id/redBox"
android:layout_width="100dp"
android:layout_height="100dp"
android:background="#android:color/holo_red_light"
android:textAppearance="#style/TextAppearance.AppCompat.Body2"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<androidx.constraintlayout.widget.Guideline
android:id="#+id/guideline"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_percent=".5" />
<androidx.constraintlayout.widget.Barrier
android:id="#+id/barrier"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:barrierDirection="bottom"
app:constraint_referenced_ids="redBox,guideline"/>
</androidx.constraintlayout.widget.ConstraintLayout>
With the above layout, the following is what is displayed. Although the ConstraintLayout is wrap_content, it expands to twice the height of the red box.
If we remove the red box or the guideline from the barrier, the layout behaves:
The height of the ConstraintLayout can be varied by changing the location of the guideline. Here it is with the guideline set at 30%:
The expected behavior, IMO, is that the ConstraintLayout would size itself based upon the heights of its child views, here just the red box, and the guideline would be set accordingly. That is clearly not what is happening.
Maybe someone can figure out an XML work-around using the simplified layout. I didn't see a similar issue reported from a cursory search, so it may be worth reporting.
(Using ConstraintLayout version 2.1.0)

Android WebView overlaps with other views

I have a simple web view in between image and button. For some reason, if I put a long text, the web view is overlapping with the logo and the button. It works for a short text. I used constraint layout. It seems that the web view is expanding beyond the parent view.
Please see the pictures.
Below is my layout code:
<?xml version="1.0" encoding="utf-8"?> <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">
<ImageView
android:id="#+id/iv_logo"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/card_big_margin"
android:src="#drawable/login_cashnetusa_color"
android:tint="#color/white"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:ignore="ContentDescription" />
<androidx.cardview.widget.CardView
android:id="#+id/cv_splash_screen"
style="#style/CardTheme"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="#dimen/card_normal_outer_margin"
android:layout_marginTop="#dimen/card_normal_outer_margin"
android:layout_marginRight="#dimen/card_normal_outer_margin"
android:layout_marginBottom="#dimen/card_normal_outer_margin"
app:layout_constraintBottom_toTopOf="#id/btn_cta"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#id/iv_logo">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="#+id/tv_header"
style="#style/CardContent.CustomBlack.Bold"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="#dimen/card_normal_margin"
android:text="#string/dummy_full_name"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<WebView
android:id="#+id/wv_update_text"
style="#style/CardContent.White"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:padding="#dimen/card_normal_margin"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#id/tv_header" />
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.cardview.widget.CardView>
<Button
android:id="#+id/btn_cta"
style="#style/Button.OrangeGradient"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginLeft="#dimen/card_normal_margin"
android:layout_marginRight="#dimen/card_normal_margin"
android:layout_marginBottom="#dimen/card_item_normal_margin"
android:textSize="16sp"
app:layout_constraintBottom_toTopOf="#id/tv_skip"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
tools:text="#string/dummy_btn_ok" />
<TextView
android:id="#+id/tv_skip"
style="#style/CardContent.White"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="#dimen/card_normal_margin"
android:text="#string/skip"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
The problem lies in here:
<androidx.cardview.widget.CardView
android:id="#+id/cv_splash_screen"
style="#style/CardTheme"
android:layout_width="match_parent"
<-- change layout:height from wrap_content to some specific height let it be 300-400dp -->
android:layout_height="wrap_content"
android:layout_marginLeft="#dimen/card_normal_outer_margin"
android:layout_marginTop="#dimen/card_normal_outer_margin"
android:layout_marginRight="#dimen/card_normal_outer_margin"
android:layout_marginBottom="#dimen/card_normal_outer_margin"
app:layout_constraintBottom_toTopOf="#id/btn_cta"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#id/iv_logo">
or the second option is you can use minHeight and maxHeight in your cardview or it's child layout which is Constraint layout to prevent it from expanding on full screen
and if you have long texts to read use ScrollView inside cardview.
As you have set the height of your CardView to wrapContent it will expand to the content that is put in it, what you can do is set app:layout_constrainedHeight="true" that will prevent it from expanding beyond its bounds.
Note that you do have to set up the view bound chaining properly for this to work, ie set app:layout_constraintTop_toX and app:layout_constraintBottom_toX on all the views in the 'chain' from the top of the view through to the bottom.
so in your code:
<androidx.cardview.widget.CardView
android:id="#+id/cv_splash_screen"
style="#style/CardTheme"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="#dimen/card_normal_outer_margin"
android:layout_marginTop="#dimen/card_normal_outer_margin"
android:layout_marginRight="#dimen/card_normal_outer_margin"
android:layout_marginBottom="#dimen/card_normal_outer_margin"
<!-- add this line --> app:layout_constrainedHeight="true"
app:layout_constraintBottom_toTopOf="#id/btn_cta"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#id/iv_logo">

Make top of view to be before end of other view ConstraintLayout

I want to achieve A UI where I have Two views VIEW1, VIEW2 with these constraints
VIEW1 has height of wrap_content
VIEW2 should it's top to be before end of VIEW1 with 10dp for example.
Final UI i want with Code
Another solution by using
a view with fixed height that equal to how many dp VIEW2 should start before end of VIEW1.
full code(also has same ending corners to bottom) ::
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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">
<TextView
android:id="#+id/mainContent"
android:layout_width="match_parent"
android:layout_height="0dp"
android:background="#color/faded_orange"
android:text="TextView"
android:translationY="0dp"
android:textAlignment="center"
app:layout_constraintTop_toTopOf="#id/space"
app:layout_constraintBottom_toBottomOf="#id/space2"
app:layout_constraintStart_toStartOf="#id/space" />
<Space
android:id="#+id/space"
android:layout_width="match_parent"
android:layout_height="20dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintBottom_toBottomOf="#id/topLayout"
/>
<Space
android:id="#+id/space2"
android:layout_width="match_parent"
android:layout_height="20dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="#id/bottomLayout"
/>
<TextView
android:id="#+id/topLayout"
android:layout_width="0dp"
android:layout_height="#dimen/_100sdp"
android:background="#drawable/header_bg"
android:text="TextView"
android:textAlignment="center"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/bottomLayout"
android:layout_width="0dp"
android:layout_height="#dimen/_100sdp"
android:background="#drawable/bg_bottom_view"
android:text="TextView"
android:textAlignment="center"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintBottom_toBottomOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
As you know, setting layout_marginTop="-10dp" will not work too.
You can try setting translationY="-10dp" to VIEW2 then it will work.
You can do something like this.
A Top View ( View 1 ) with constraints of top, start and end of parent.
A Bottom ( View 2 ) with constraints topToBottomOf = View 1.
Add a rounded rectangle ( View 3 ) with topToBottomOf = View 1 and height = 10dp or whatever the overlap height you want to have.
As I understand you want view same as you added UI Image. This UI can be achieved using Guideline.
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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">
<TextView
android:id="#+id/textview9"
android:layout_width="0dp"
android:layout_height="#dimen/_100sdp"
android:background="#color/bg_counter"
android:text="textview"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<androidx.constraintlayout.widget.Guideline
android:id="#+id/guideline"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_percent="0.13" />
<TextView
android:id="#+id/textview10"
android:layout_width="#dimen/_80sdp"
android:layout_height="0dp"
android:background="#color/colorAccent"
android:text="textview"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/guideline" />
</androidx.constraintlayout.widget.ConstraintLayout>

Android: BottomSheetDialog does not expand completely with ConstraintLayout

I am using ConstraintLayout for my layout. I am creating a BottomSheetDialog and setting the layout to it which uses the ConstraintLayout at top.
Note: If i use LinearLayout everything works fine and BottomSheetDialog takes proper height but when i am using
ConstraintLayout, it shows only one option.
Please find the screenshot below when i am using ConstraintLayout:
My xml file:
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout 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:orientation="vertical"
android:background="#color/white">
<TextView
android:id="#+id/tv_other_methods"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/ripple"
android:gravity="center_horizontal"
android:padding="#dimen/dp_12"
android:text="#string/from_other_methods"
android:textColor="#color/blue"
android:textSize="#dimen/sp_17" />
<View
android:id="#+id/view_other_methods"
android:layout_width="match_parent"
android:layout_height="#dimen/dip_1"
android:background="#color/light_grey"
app:layout_constraintBottom_toBottomOf="#id/tv_other_methods" />
<TextView
android:id="#+id/tv_FromChinaUnionPay"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/ripple"
android:gravity="center_horizontal"
android:padding="#dimen/dp_12"
android:text="#string/from_china_union_pay"
android:textColor="#color/blue"
android:textSize="#dimen/sp_17"
app:layout_constraintBottom_toBottomOf="#id/view_other_methods"
app:layout_constraintTop_toTopOf="#id/view_FromChinaUnionPay" />
<View
android:id="#+id/view_FromChinaUnionPay"
android:layout_width="match_parent"
android:layout_height="#dimen/dip_1"
android:background="#color/light_grey"
app:layout_constraintBottom_toBottomOf="#id/tv_FromChinaUnionPay" />
<TextView
android:id="#+id/tv_Cancel"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/ripple"
android:gravity="center_horizontal"
android:padding="#dimen/dp_12"
android:text="#string/cancel"
android:textColor="#color/blue"
android:textSize="#dimen/sp_17"
app:layout_constraintTop_toBottomOf="#+id/view_FromChinaUnionPay" />
</android.support.constraint.ConstraintLayout>
My java code for BottomSheetDialog:
final BottomSheetDialog bottomSheetDialog = new BottomSheetDialog(mContext);
bottomSheetDialog.setContentView(R.layout.dialog_web_view_options);
// dialog.setCancelable(false);
final Window window = bottomSheetDialog.getWindow();
assert window != null;
window.setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT));
window.setLayout(ActionBar.LayoutParams.MATCH_PARENT, ActionBar.LayoutParams.WRAP_CONTENT);
window.setSoftInputMode(WindowManager.LayoutParams.SOFT_INPUT_ADJUST_RESIZE);
window.setSoftInputMode(WindowManager.LayoutParams.SOFT_INPUT_STATE_HIDDEN);
window.getDecorView().setPadding(20, 0, 20, 0);
bottomSheetDialog.setOnShowListener(new DialogInterface.OnShowListener() {
#Override
public void onShow(DialogInterface dialog) {
FrameLayout bottomSheet = bottomSheetDialog.findViewById(android.support.design.R.id.design_bottom_sheet);
BottomSheetBehavior behavior = BottomSheetBehavior.from(bottomSheet);
behavior.setSkipCollapsed(true);
behavior.setState(BottomSheetBehavior.STATE_EXPANDED);
}
});
In my layout if i replaceConstraintLayout with LinearLayout then it works fine and takes full height. Please let me know if i am doing something wrong.
I have tried these solutions but nothing worked:
Set state of BottomSheetDialogFragment to expanded
BottomSheetDialogFragment - How to set expanded height (or min top offset)
Android BottomSheetDialogFragment does not expand completely
Any help will be appreciated. Thanks!
You haven't constrained all the views - the first TextView has no constraints whatsoever . The constraints you added aren't properly specified to correctly display the views in vertical order. I suggest creating a vertical chain of all the views with the parent ConstraintLayout's layout_height set to wrap_content. The XML should look something like this:
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout 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="wrap_content"
android:background="#color/white">
<TextView
android:id="#+id/tv_other_methods"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="#drawable/ripple"
android:gravity="center_horizontal"
android:padding="#dimen/dp_12"
android:text="#string/from_other_methods"
android:textColor="#color/blue"
android:textSize="#dimen/sp_17"
app:layout_constraintBottom_toTopmOf="#id/view_other_methods"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<View
android:id="#+id/view_other_methods"
android:layout_width="0dp"
android:layout_height="#dimen/dip_1"
android:background="#color/light_grey"
app:layout_constraintBottom_toTopOf="#id/tv_FromChinaUnionPay"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/tv_other_methods" />
<TextView
android:id="#+id/tv_FromChinaUnionPay"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="#drawable/ripple"
android:gravity="center_horizontal"
android:padding="#dimen/dp_12"
android:text="#string/from_china_union_pay"
android:textColor="#color/blue"
android:textSize="#dimen/sp_17"
app:layout_constraintBottom_toTopOf="#id/view_FromChinaUnionPay"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/view_other_methods" />
<View
android:id="#+id/view_FromChinaUnionPay"
android:layout_width="0dp"
android:layout_height="#dimen/dip_1"
android:background="#color/light_grey"
app:layout_constraintBottom_toTopOf="#id/tv_Cancel"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/tv_FromChinaUnionPay" />
<TextView
android:id="#+id/tv_Cancel"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="#drawable/ripple"
android:gravity="center_horizontal"
android:padding="#dimen/dp_12"
android:text="#string/cancel"
android:textColor="#color/blue"
android:textSize="#dimen/sp_17"
app:layout_constraintTop_toBottomOf="#+id/view_FromChinaUnionPay"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintBottom_toBottomOf="parent"/>
</android.support.constraint.ConstraintLayout>
As a side note, it is not advised to use match_parent for any views inside a ConstraintLayout as the documentation suggests:
Important: MATCH_PARENT is not recommended for widgets contained in a ConstraintLayout. Similar behavior can be defined by using MATCH_CONSTRAINT with the corresponding left/right or top/bottom constraints being set to "parent".

Categories

Resources