I am very new in Android development I have designed the xml below
I started with creating a ConstraintView inside of that I created a ConstraintView with some fixed height and ScrollView.
I am facing problem to set the height of Scrollview. How to set ScrollView should start just below to ConstraintView
<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=".activity.MainActivity">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/CL1"
android:layout_width="match_parent"
android:layout_height="260dp"
android:background="#color/color_primary"
app:layout_constraintBottom_toTopOf="#+id/scrollView3"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintVertical_bias="0.0">
</androidx.constraintlayout.widget.ConstraintLayout>
<ScrollView
android:id="#+id/scrollView3"
android:layout_width="match_parent"
android:layout_height="550dp"
android:background="#color/color_primary_dark"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
android:fillViewport="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="vertical">
</LinearLayout>
</ScrollView>
</androidx.constraintlayout.widget.ConstraintLayout>
I am not sure what is your end layout goal here, but you can simply set a top to bottom constraint on your ScrollView like you have done on your RecyclerView. So just add the following in your ScrollView XML
app:layout_constraintTop_toBottomOf="#+id/CL1"
So your XML becomes
<ScrollView
android:id="#+id/scrollView3"
android:layout_width="match_parent"
android:layout_height="550dp"
app:layout_constraintTop_toBottomOf="#+id/CL1"
android:background="#color/color_primary_dark"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
android:fillViewport="true">
Related
My layout looks like this:
<androidx.core.widget.NestedScrollView
android:id="#+id/scrollView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fillViewport="true"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/main_part"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<RelativeLayout
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintStart_toStartOf="parent"
android:id="#+id/main_content_container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<androidx.viewpager2.widget.ViewPager2
android:id="#+id/featured_vp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:overScrollMode="never" />
<androidx.fragment.app.FragmentContainerView
android:id="#+id/view_pager_nav_fragment"
android:layout_below="#id/featured_vp"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:minHeight="50dp" />
</RelativeLayout>
<AnotherContent>...</AnotherContent>
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.core.widget.NestedScrollView>
Question is: which way is easiest to make RelativeLayout that holds my front content to fit scrollview?
I've try to achieve that programmaticly by change LayoutParanms of RelativeLayout but this way viewpager get all space inside layout, it kills my FragmentContainerView despite its min_heigt is 50dp.
I've placed a FrameLayout inside ConstraintLayout and I think it's constrained properly. But in the app, it's not positioned properly. FrameLayout is replaced by appropriate fragment at runtime.
<?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=".ui.chapters.ChapterActivity">
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar_chapter"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
app:title="Chapters"
app:titleTextColor="#color/White" />
<FrameLayout
android:id="#+id/chapter_fragment_container_frameLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:minHeight="500dp"
app:layout_constraintBottom_toTopOf="#+id/bottom_navigation"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.388"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/toolbar_chapter"
app:layout_constraintVertical_bias="1.0" />
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/bottom_navigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:background="#color/colorPrimary"
app:itemIconTint="#color/White"
app:itemTextColor="#color/Wheat"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:menu="#menu/chapter_bottom_menu">
</com.google.android.material.bottomnavigation.BottomNavigationView>
</androidx.constraintlayout.widget.ConstraintLayout>
Here's what is shown in IDE:
But this is what I get in device:
FrameLayout should be placed in-between toolbar & the bottom navigation bar, it should be done by LinearLayout/Relative one, haven't tried though.. but what's wrong with this.
Change this FrameLayout part as below:
<FrameLayout
android:id="#+id/chapter_fragment_container_frameLayout"
android:layout_width="0dp"
android:layout_height="0dp"
android:minHeight="500dp"
app:layout_constraintBottom_toTopOf="#+id/bottom_navigation"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.388"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/toolbar_chapter"
app:layout_constraintVertical_bias="1.0" />
The reason why it is happening is because of match_constraint. If you have defined constraint for top, bottom, start, and end you should define 0dp for height and width to View.
Change framelayout's android:layout_height property from "match_parent" to "wrap_content"
Change FrameLayout height to 0dp,
<FrameLayout
android:id="#+id/chapter_fragment_container_frameLayout"
android:layout_width="match_parent"
android:layout_height="0dp"
android:minHeight="500dp"
app:layout_constraintBottom_toTopOf="#+id/bottom_navigation"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.388"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/toolbar_chapter"
app:layout_constraintVertical_bias="1.0" />
I have a Recycler View in a Constraint Layout that shows data from a database. I want the max height to be 500dp, but the problem is that when it exceeds that size, it cuts a portion from the bottom of the view.
I don't know what would be the problem.
Here is the xml of the RecyclerView:
<?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="fill_parent"
android:layout_height="wrap_content"
android:maxHeight="500dp"
tools:context=".histDialog">
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/recyclerView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#color/colorPrimary"
android:padding="3dp"
app:layout_constrainedHeight="true"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
The recyclerview appears in an activity styled as a dialog.
I've tried every possible thing i could think of but i can't get it to work.
I found the solution. This is the XML now:
<?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="wrap_content"
android:layout_height="wrap_content"
tools:context=".histDialog">
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/recyclerView"
android:layout_width="match_parent"
android:layout_height="0dp"
android:background="#color/colorPrimary"
android:clipToPadding="true"
android:padding="3dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintHeight_default="wrap"
app:layout_constraintHeight_max="500dp"
app:layout_constraintHeight_min="50dp"/>
</androidx.constraintlayout.widget.ConstraintLayout>
The important part is:
android:layout_height="0dp"
app:layout_constraintHeight_default="wrap"
app:layout_constraintHeight_max="500dp"
app:layout_constraintHeight_min="50dp"
for the RecyclerView. Took me long enough to realise it was this simple. Hope this can help others too.
The layout for my Fragment is a ConstraintLayout with both width and height set to match_parent.
Inside it is another ConstraintLayout used to make a fixed dimension ratio area.
It works perfectly in ConstraintLayout-2.0.0-alpha3, but after I change to alpha4, the outer ConstrainLayout doesn't match parent. It is around 70% original size aligning top-left, I don't know why.
The fragment is attached to a FrameLayout, the size of the FrameLayout is right.
Here is my layout.
<?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=".KeyboardFragment">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="0dp"
android:layout_height="0dp"
android:background="#drawable/game_keyboard_bg"
app:layout_constraintDimensionRatio="1.6129"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent">
<Space
android:id="#+id/corner_tl"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintDimensionRatio="1:1"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintHeight_percent="0.01"/>
<Space
android:id="#+id/corner_br"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintDimensionRatio="1:1"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintHeight_percent="0.01"/>
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/recycler_view"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintDimensionRatio="2:1"
app:layout_constraintTop_toBottomOf="#+id/corner_tl"
app:layout_constraintBottom_toTopOf="#+id/corner_br"
app:layout_constraintStart_toEndOf="#+id/corner_tl"
app:layout_constraintEnd_toStartOf="#+id/corner_br" />
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
try 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"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.constraint.ConstraintLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
</android.support.constraint.ConstraintLayout>
</android.support.constraint.ConstraintLayout>
I have two layouts inside a constraint layout.
One is reserved for the actual screens, and the other is reserved for the bottom toolbar
the problem is the actual screen is flowing under the toolbar and i want them to be next to each other.
What do I need to change in this layout ?
<?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"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/mainScreen"
android:layout_width="match_parent"
android:layout_height="match_parent">
<FrameLayout
android:id="#+id/mainFrame"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintBottom_toTopOf="#+id/bottom_navigation"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:background="#ff00ff00" />
<android.support.design.widget.BottomNavigationView
android:id="#+id/bottom_navigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/green"
app:itemIconTint="#color/colorPrimary"
app:itemTextColor="#color/colorPrimaryDark"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:menu="#menu/bottom_navigation_menu" />
</android.support.constraint.ConstraintLayout>
You forget to add where should be place navigation bottom view, try this.
<FrameLayout
android:id="#+id/mainFrame"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintBottom_toTopOf="#+id/bottom_navigation"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:background="#ff00ff00" />
<android.support.design.widget.BottomNavigationView
android:id="#+id/bottom_navigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/green"
app:itemIconTint="#color/colorPrimary"
app:itemTextColor="#color/colorPrimaryDark"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toBottomOf="#+id/mainFrame"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:menu="#menu/bottom_navigation_menu" />
I realise this is a bit old and probably solved, but thought it was worth answering for those who stumble across it...
The problem here is that the FrameLayout is set to wrap_parent which means it will only grow as large as it needs to in order to display its content.
You can use a contraint weight to have it grow as large as it can, 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"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/mainScreen"
android:layout_width="match_parent"
android:layout_height="match_parent">
<FrameLayout
android:id="#+id/mainFrame"
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintVertical_weight="1"
app:layout_constraintBottom_toTopOf="#+id/bottom_navigation"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:background="#ff00ff00" />
<android.support.design.widget.BottomNavigationView
android:id="#+id/bottom_navigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/steel"
app:itemIconTint="#color/colorPrimary"
app:itemTextColor="#color/colorPrimaryDark"
app:layout_constraintTop_toBottomOf="#+id/mainFrame"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:menu="#menu/menu_main_drawer" />
with the important part being android:layout_height="0dp" and app:layout_constraintVertical_weight="1", and also adding the suggestion posted by Hemant.
All you need to do is set the height of the frame layout to 0dp -> Constraint layout takes it at match_constraint.