Android ConstraintLayout set height based on screen size - android

Following is my xml layout. Trying to set height of ConstraintLayout based on screen width unable to do that it is not working. How to set height of ConstraintLayout based on screen size.
<?xml version="1.0" encoding="utf-8"?>
<androidx.cardview.widget.CardView 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:layout_marginTop="16dp"
android:background="#color/accent_secondary"
app:cardBackgroundColor="#color/accent_secondary"
app:cardCornerRadius="10dp"
app:cardElevation="2dp"
app:cardUseCompatPadding="true">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintDimensionRatio="1:0.35">
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.cardview.widget.CardView>

Related

Is there any way to make ConstraintLayout take 75% of the width screen?

First attempt
<?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="0dp"
android:layout_height="match_parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintWidth_percent="0.75">
...
</androidx.constraintlayout.widget.ConstraintLayout>
Second attempt
<?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">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="0dp"
android:layout_height="match_parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintWidth_percent="0.75">
...
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
As you can see in the first attempt the attributes have no effect, In the second attempt it is working as I want, But is there any way to make ConstraintLayout take 75% of the width screen without creating 2 of ConstraintLayout?
I can do it programmatically but I want to do it inside XML
You can try it with a androidx.constraintlayout.widget.Guideline. Set the Guideline to 75% of the parent view and fill it with the constraint layout (match parent).

How to Set Recycler View Height Dynamically Using wrap_content?

I have a fragment containing a recycler view which is populated using data fetched from a server. This fragment is inside a FragmentContainerView within the activity. I want the height of the recyclerView to be dynamic. Essentially using wrap_content as the height parameter, but when I do that the recyclerView has a height of 0 and doesn't show up at all.
Why doesn't wrap_content dynamically adjust the height for my fragmentContainerView height?
Fragment
<?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">
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/calendarRecyclerView"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
Activity
<?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=".activities.DashboardActivity">
<androidx.fragment.app.FragmentContainerView
android:id="#+id/fragmentContainerView"
android:name="com.yambo.yates.fragments.WorkoutCalendarFragment"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:layout="#layout/workout_calendar_fragment" />
</androidx.constraintlayout.widget.ConstraintLayout>
RecyclerViews already dynamically adjust height based on contents. So as long as your XML is at least wrap_content it should display everything. Are you sure your data is valid?
Also, if your fragment only contains the RecyclerView you can remove the parent ConstraintLayout and change your XML to:
<androidx.recyclerview.widget.RecyclerView
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/calendarRecyclerView"
android:layout_width="match_parent"
android:layout_height="match_parent" />

Android CardView shadow gets cut off

Shadows seem to cut off on some of my CardView usages.
Any idea why? looks like removing the padding on the parent resolves the issue, but I do want the padding. And I don't want to use margin on the inner card, because there are other views aligned and I prefer having the padding set on the parent to apply to all children
Any solutions?
layout
<?xml version="1.0" encoding="utf-8"?>
<androidx.cardview.widget.CardView
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:layout_marginTop="#dimen/standard_spacing"
android:layout_marginLeft="#dimen/standard_spacing"
android:layout_marginRight="#dimen/standard_spacing"
android:layout_marginBottom="#dimen/smaller_spacing"
app:cardCornerRadius="#dimen/standard_card_corner_radius"
app:cardElevation="10dp">
<androidx.appcompat.widget.LinearLayoutCompat
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:padding="#dimen/standard_spacing">
<androidx.cardview.widget.CardView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:cardBackgroundColor="#color/light_gray_background"
android:minHeight="40dp"
app:cardElevation="5dp"
app:cardCornerRadius="#dimen/standard_card_corner_radius" >
</androidx.cardview.widget.CardView>
</androidx.appcompat.widget.LinearLayoutCompat>
</androidx.cardview.widget.CardView>
add
android:clipToPadding="false"
to LinearLayout

Listview size adapt on items

I have an issue with the design of a listview.
I would like to reduce the list when there are a few items but if I put wrap content it's on the middle of the screen.
How can I do ?
My list view :
<ListView
android:id="#+id/listView_location"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_below="#id/searchView_location"
android:layout_marginBottom="8dp"
app:layout_constrainedHeight="true"
app:layout_constraintBottom_toTopOf="#+id/searchView_location"
app:layout_constraintEnd_toEndOf="#+id/searchView_location"
app:layout_constraintStart_toStartOf="#+id/searchView_location"
app:layout_constraintTop_toTopOf="parent"/>
Constraint layout
<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:id="#+id/root_layout_search"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:focusableInTouchMode="true">
Change your ListView height
android:layout_height="wrap_content"
Remove top constraint
app:layout_constraintTop_toTopOf="parent"
Change its parent height to wrap_content i.e contraintlayout
<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:id="#+id/root_layout_search"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:focusableInTouchMode="true">

How to centre a parent ViewGroup?

I have a parent ConstraintLayout in my fragment.xml:
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="400dp"
android:maxHeight="400dp"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:background="#color/colorPopupBackground"
android:fadeScrollbars="false"
android:id="#+id/profile_layout"
android:elevation="1dp">
as you can see i've set a maxHeight and constrained it on every side - so you would think it should centre vertically on the screen. However the ConstraintLayout sits on the top vertically.
Any idea?
Just remove bottom constraint because when you set both side constraint and set custom width then it will be center of both constraint, SO update your code like bellow
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="400dp"
android:maxHeight="400dp"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:background="#color/colorPopupBackground"
android:fadeScrollbars="false"
android:id="#+id/profile_layout"
android:elevation="1dp">

Categories

Resources