In my coordinator layout I included another layout which causes AppBarLayout to move to the top and positioned under the status bar,in other words the toolbar height is the half size of it's real height, why is this happening? And also the title of the toolbar is not positioning properly.
<android.support.design.widget.CoordinatorLayout
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:id="#+id/ma_main">
<android.support.design.widget.AppBarLayout
android:id="#+id/ma_appbar_layout"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize">
<android.support.v7.widget.Toolbar
android:id="#+id/ma_toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:popupTheme="#style/AppTheme.popup"/>
</android.support.design.widget.AppBarLayout>
<include layout="#layout/main_activity_recycler"/>
<android.support.design.widget.FloatingActionButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/ma_fab"
app:layout_anchor="#id/ma_recycler_layout"
app:layout_anchorGravity="bottom|end"
android:layout_margin="15dp"
app:fabSize="normal"
android:src="#drawable/pencil"
android:elevation="8dp" />
</android.support.design.widget.CoordinatorLayout>
and included layout
<LinearLayout 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:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:showIn="#layout/activity_main"
android:id="#+id/ma_recycler_layout">
<android.support.v7.widget.RecyclerView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/ma_recyclerView"
android:visibility="invisible">
</android.support.v7.widget.RecyclerView>
<ProgressBar
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginTop="2dp"
android:padding="5dp"
android:id="#+id/ma_progressbar"
android:visibility="visible"
android:indeterminate="true"
/></LinearLayout>
make some changes in xml like below ..
<RelativeLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.design.widget.AppBarLayout
android:id="#+id/ma_appbar_layout"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize">
<android.support.v7.widget.Toolbar
android:id="#+id/ma_toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:popupTheme="#style/AppTheme.popup" />
</android.support.design.widget.AppBarLayout>
</RelativeLayout>
<include layout="#layout/rl" />
<android.support.design.widget.FloatingActionButton
android:id="#+id/ma_fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="15dp"
android:elevation="8dp"
android:src="#drawable/pencil"
app:fabSize="normal"
app:layout_anchor="#id/ma_recycler_layout"
app:layout_anchorGravity="bottom|end" />
</android.support.design.widget.CoordinatorLayout>
then after recyler view layout like below ..
<RelativeLayout 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:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
android:id="#+id/ma_recycler_layout">
<android.support.v7.widget.RecyclerView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/ma_recyclerView"
android:visibility="invisible">
</android.support.v7.widget.RecyclerView>
<ProgressBar
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="2dp"
android:padding="5dp"
android:id="#+id/ma_progressbar"
android:visibility="visible"
android:indeterminate="true"
android:layout_centerInParent="true"
/></RelativeLayout>
Related
I am trying to implement a recyclerview below a appbarlayout, so that the recyclerview collapses together with the appbar. It works so far but unfortunately the recyclerview does not scroll anymore.
Could somebody please help me? I searched for some examples on stackoverflow but unfortunatly I can`t get it to work.
Here is the related xml:
<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout 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:fitsSystemWindows="true">
<com.google.android.material.appbar.AppBarLayout
android:id="#+id/appBar"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
android:theme="#style/ToolbarTheme"
app:layout_scrollFlags="scroll|snap|enterAlways" >
<Spinner
android:id="#+id/spinner_nav"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:dropDownVerticalOffset="#dimen/dropDownVerticalOffset"
android:visibility="gone"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Initializing.."
android:layout_gravity="start"
android:id="#+id/toolbar_title"
style="#style/ToolBarTitle"/>
</androidx.appcompat.widget.Toolbar>
<ProgressBar
android:id="#+id/progressBar"
style="?android:attr/progressBarStyleHorizontal"
android:theme="#style/WhiteAccent"
android:layout_width="match_parent"
android:layout_height="2dp"
android:indeterminate="true"
android:visibility="gone" />
<androidx.recyclerview.widget.RecyclerView
app:layout_behavior="#string/appbar_scrolling_view_behavior"
android:id="#+id/recycler_view"
android:scrollbars="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#191512"
android:visibility="gone" />
</com.google.android.material.appbar.AppBarLayout>
<RelativeLayout
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#191512"
android:orientation="vertical">
<ImageView
android:id="#+id/image"
android:layout_width="350dp"
android:layout_height="160dp"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:scaleType="fitCenter"
android:src="#drawable/background" />
</RelativeLayout>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
Can you please try the code below?
You put the RecyclerView inside the AppBarLayout, and below is put it out of AppBarLayout.
<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout 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:fitsSystemWindows="true">
<com.google.android.material.appbar.AppBarLayout
android:id="#+id/appBar"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
android:theme="#style/ToolbarTheme"
app:layout_scrollFlags="scroll|snap|enterAlways" >
<Spinner
android:id="#+id/spinner_nav"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:dropDownVerticalOffset="#dimen/dropDownVerticalOffset"
android:visibility="gone"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Initializing.."
android:layout_gravity="start"
android:id="#+id/toolbar_title"
style="#style/ToolBarTitle"/>
</androidx.appcompat.widget.Toolbar>
<ProgressBar
android:id="#+id/progressBar"
style="?android:attr/progressBarStyleHorizontal"
android:theme="#style/WhiteAccent"
android:layout_width="match_parent"
android:layout_height="2dp"
android:indeterminate="true"
android:visibility="gone" />
</com.google.android.material.appbar.AppBarLayout>
<!-- put it out of AppBarLayout -->
<androidx.recyclerview.widget.RecyclerView
app:layout_behavior="#string/appbar_scrolling_view_behavior"
android:id="#+id/recycler_view"
android:scrollbars="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#191512"
/>
<RelativeLayout
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#191512"
android:orientation="vertical">
<ImageView
android:id="#+id/image"
android:layout_width="350dp"
android:layout_height="160dp"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:scaleType="fitCenter"
android:src="#drawable/background" />
</RelativeLayout>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
I have an android app in which I am trying to create the below layout -
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/drawer_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<android.support.design.widget.CoordinatorLayout
android:id="#+id/cl_root_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clipChildren="false">
<LinearLayout
android:id="#+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:background="#color/tab_primary_background"
android:layout_height="wrap_content"
app:elevation="5dp">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
style="#style/Toolbar"
app:subtitleTextColor="#color/white"
app:title="#string/app_name"
app:titleTextAppearance="#style/Toolbar.TitleText"
app:titleTextColor="#color/white" />
</android.support.design.widget.AppBarLayout>
<ScrollView
android:layout_width="match_parent"
android:layout_weight="1"
android:fillViewport="true"
android:layout_height="0dp">
<LinearLayout
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="match_parent"
android:orientation="vertical"
android:paddingStart="15dp"
android:paddingEnd="15dp"
android:paddingLeft="15dp"
android:paddingRight="15dp"
android:layout_marginTop="15dp"
android:layout_height="wrap_content">
<ImageView
android:layout_width="60dp"
android:src="#drawable/teacher_onboarding_step2"
android:layout_height="60dp"
android:layout_gravity="center"
android:textAlignment="center"
android:contentDescription="#string/take_test" />
<TextView
android:layout_width="match_parent"
android:id="#+id/tat_title_placeholder"
style="#style/TextAppearance.Text.Light"
android:textSize="14sp"
android:textAlignment="center"
android:padding="15dp"
android:text="#string/tat_title_placeholder"
android:layout_height="wrap_content" />
<com.mindorks.placeholderview.PlaceHolderView
android:layout_width="match_parent"
android:id="#+id/fixed_test_placeholder"
android:layout_height="wrap_content" />
</LinearLayout>
<android.support.design.widget.TabLayout
android:layout_width="match_parent"
android:id="#+id/tat_tab_layout"
app:tabIndicatorColor="#color/white"
app:tabSelectedTextColor="#color/white"
app:tabBackground="#color/tab_primary_background"
android:layout_height="wrap_content" />
<android.support.v4.view.ViewPager
android:id="#+id/tat_viewpager"
android:layout_width="match_parent"
android:layout_weight="1"
android:layout_height="0dp" />
</LinearLayout>
</ScrollView>
</LinearLayout>
</android.support.design.widget.CoordinatorLayout>
<android.support.design.widget.NavigationView
android:id="#+id/navigation_view"
style="#style/Widget.Design.NavigationView"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
android:background="#color/white"
app:headerLayout="#layout/drawer_header"
app:itemBackground="#color/white"
app:itemIconTint="#color/black_effective"
app:itemTextColor="#color/black_effective"
app:menu="#menu/drawer">
<TextView
android:id="#+id/tv_app_version"
style="#style/TextStyle.Title.Sub"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:padding="5dp" />
</android.support.design.widget.NavigationView>
</android.support.v4.widget.DrawerLayout>
So, in this layout as you can see I want to add a TabLayout and a ViewPager below some views. Now the problem I am facing is my ViewPager is restricted to the available space at the bottom of the screen so, only the viewpager is scrollable and not the full activity layout. Which leaves very little space at the bottom to see the viewpager contents.
So, I want to make the whole layout below the appbar scrollable from the top so that the fragments inside viewpager are easily and conveniently visible.
------------Update---------
I tried using the Nested Scroll View, setFillViewPort, and the collapsing layout as suggested but still getting the same result.
Updated layout xml with Collapsing ToolbarLayout -
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/drawer_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<android.support.design.widget.CoordinatorLayout
android:id="#+id/cl_root_view"
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.urtutors.students.mvp.utils.MyNestedScrollView
android:layout_width="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_height="wrap_content">
<com.urtutors.students.mvp.utils.WrapContentHeightViewPager
android:id="#+id/tat_viewpager"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
</com.urtutors.students.mvp.utils.MyNestedScrollView>
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:background="#color/tab_primary_background"
android:layout_height="wrap_content"
app:elevation="5dp">
<android.support.design.widget.CollapsingToolbarLayout
android:layout_width="match_parent"
android:fitsSystemWindows="true"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:orientation="vertical"
android:paddingStart="15dp"
app:layout_collapseMode="parallax"
android:paddingEnd="15dp"
android:paddingLeft="15dp"
android:paddingRight="15dp"
android:layout_marginTop="15dp"
android:layout_height="wrap_content">
<ImageView
android:layout_width="60dp"
android:src="#drawable/teacher_onboarding_step2"
android:layout_height="60dp"
android:layout_gravity="center"
android:textAlignment="center"
android:contentDescription="#string/take_test" />
<TextView
android:layout_width="match_parent"
android:id="#+id/tat_title_placeholder"
style="#style/TextAppearance.Text.Light"
android:textSize="14sp"
android:textAlignment="center"
android:padding="15dp"
android:text="#string/tat_title_placeholder"
android:layout_height="wrap_content" />
<com.mindorks.placeholderview.PlaceHolderView
android:layout_width="match_parent"
android:id="#+id/fixed_test_placeholder"
android:layout_height="wrap_content" />
</LinearLayout>
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
style="#style/Toolbar"
app:layout_collapseMode="pin"
app:subtitleTextColor="#color/white"
app:title="#string/app_name"
app:titleTextAppearance="#style/Toolbar.TitleText"
app:titleTextColor="#color/white" />
</android.support.design.widget.CollapsingToolbarLayout>
<android.support.design.widget.TabLayout
android:layout_width="match_parent"
android:id="#+id/tat_tab_layout"
app:tabIndicatorColor="#color/white"
app:tabSelectedTextColor="#color/white"
app:tabBackground="#color/tab_primary_background"
android:layout_height="wrap_content" />
</android.support.design.widget.AppBarLayout>
</android.support.design.widget.CoordinatorLayout>
<android.support.design.widget.NavigationView
android:id="#+id/navigation_view"
style="#style/Widget.Design.NavigationView"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
android:background="#color/white"
app:headerLayout="#layout/drawer_header"
app:itemBackground="#color/white"
app:itemIconTint="#color/black_effective"
app:itemTextColor="#color/black_effective"
app:menu="#menu/drawer">
<TextView
android:id="#+id/tv_app_version"
style="#style/TextStyle.Title.Sub"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:padding="5dp" />
</android.support.design.widget.NavigationView>
</android.support.v4.widget.DrawerLayout>
The nested scroll views I copied from - https://github.com/TheLittleNaruto/SupportDesignExample/tree/master/app/src/main/java/com/thelittlenaruto/supportdesignexample/customview
Now, the viewpager is scrolling but my actionbar title is not visible anymore.
Can someone suggest any changes to this layout that could fix this issue ?
I have tried to refine your code and if I am not wrong you wanted it to be scrollable,you can try the following code.
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/drawer_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<android.support.design.widget.CoordinatorLayout
android:id="#+id/cl_root_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clipChildren="false">
<LinearLayout
android:id="#+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/colorPrimary"
app:elevation="5dp">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?actionBarSize"
app:subtitleTextColor="#android:color/white"
app:title="#string/app_name"
app:titleTextColor="#android:color/white" />
</android.support.design.widget.AppBarLayout>
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="15dp"
android:orientation="vertical"
android:paddingEnd="15dp"
android:paddingLeft="15dp"
android:paddingRight="15dp"
android:paddingStart="15dp">
<ImageView
android:layout_width="60dp"
android:layout_height="60dp"
android:layout_gravity="center"
android:contentDescription="#string/take_test"
android:src="#mipmap/ic_launcher"
android:textAlignment="center" />
<TextView
android:id="#+id/tat_title_placeholder"
style="#android:style/TextAppearance.Medium"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="15dp"
android:text="#string/tat_title_placeholder"
android:textAlignment="center"
android:textSize="14sp" />
<View
android:id="#+id/fixed_test_placeholder"
android:layout_width="match_parent"
android:background="#color/colorAccent"
android:layout_height="400dp" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="500dp"
android:orientation="vertical">
<android.support.design.widget.TabLayout
android:id="#+id/tat_tab_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabMode="scrollable"
app:tabPadding="#dimen/s_padding"
app:tabBackground="#color/colorPrimaryDark"
app:tabIndicatorColor="#android:color/white"
app:tabSelectedTextColor="#android:color/white" />
<android.support.v4.view.ViewPager
android:id="#+id/tat_viewpager"
android:layout_width="match_parent"
android:background="#color/colorPrimaryDark"
android:layout_height="wrap_content" />
</LinearLayout>
</LinearLayout>
</ScrollView>
</LinearLayout>
</android.support.design.widget.CoordinatorLayout>
<android.support.design.widget.NavigationView
android:id="#+id/navigation_view"
style="#style/Widget.Design.NavigationView"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
android:background="#android:color/white"
app:headerLayout="#layout/nav_header_nav"
app:itemBackground="#android:color/white"
app:itemIconTint="#android:color/black"
app:itemTextColor="#android:color/black"
app:menu="#menu/activity_nav_drawer">
<TextView
android:id="#+id/tv_app_version"
style="#style/TextAppearance.AppCompat"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:padding="5dp" />
</android.support.design.widget.NavigationView>
</android.support.v4.widget.DrawerLayout>
I have made minor changes.
Try not to use weights when using scrollView.As they don't work so
well with each other.
I have wrapped Tab layouts in a Linear Layout
and gave it static height(can be replaced easily).
Hope it helps.
How I can put the card below the toolbar and collapse it until it disappear when I scroll down and re open when I scroll up
I am using Xamarin.Android with design libary
Here is my AXML code:
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
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:id="#+id/coordinatorLayoutMainLayoutPublicationsLayout"
android:fitsSystemWindows="true">
<android.support.design.widget.AppBarLayout
android:id="#+id/main.appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsing_toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
app:layout_scrollFlags="scroll|enterAlways|enterAlwaysCollapsed">
<android.support.v7.widget.CardView
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="#+id/card_view"
android:layout_gravity="center"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:cardCornerRadius="4dp"
app:cardElevation="4dp"
app:cardUseCompatPadding="true">
<Button
android:layout_width="match_parent"
android:layout_height="150dp"
android:text="BOBOBOBOBOBOB"
app:layout_scrollFlags="scroll|enterAlways"/>
</android.support.v7.widget.CardView>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.SwipeRefreshLayout
android:id="#+id/swipeContainerPublicationsLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<android.support.v7.widget.RecyclerView
android:id="#+id/recyclerViewPublicationsLayout"
android:scrollbars="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</android.support.v4.widget.SwipeRefreshLayout>
<android.support.v7.widget.Toolbar
android:id="#+id/toolbarPublicationsLayout"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary" />
<android.support.design.widget.FloatingActionButton
android:id="#+id/fabPublicationsLayout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:src="#drawable/icon_add_fab"
android:layout_margin="15dp" />
</android.support.design.widget.CoordinatorLayout>
The output view is like this:
Screenshot of the view
After many hours searching I found the solution, make the recyclerview and the cardview inside a NestedScrollView
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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:orientation="vertical"
android:id="#+id/linearLayoutMainLayout">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary" />
<android.support.design.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/coordinatorLayoutMainLayout">
<android.support.v4.widget.SwipeRefreshLayout
android:id="#+id/swipeContainer"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
>
<android.support.v7.widget.CardView
android:id="#+id/card_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:cardCornerRadius="4dp"
app:cardElevation="4dp"
app:cardUseCompatPadding="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:padding="8dp">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textStyle="bold"
android:id="#+id/textView1" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/textView2" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/textView3" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/textView4" />
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/button" />
</LinearLayout>
</android.support.v7.widget.CardView>
<android.support.v7.widget.RecyclerView
android:id="#+id/recyclerView"
android:scrollbars="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:nestedScrollingEnabled="false"/>
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
</android.support.v4.widget.SwipeRefreshLayout>
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:src="#drawable/icon_add_fab"
android:layout_margin="15dp"/>
</android.support.design.widget.CoordinatorLayout>
</LinearLayout>
i need to create a listview into a framelayout.
This is my code:
<FrameLayout
android:id="#+id/layout_ejercicios"
android:layout_width="match_parent"
android:layout_height="300dp"
android:layout_alignParentStart="true"
android:layout_below="#+id/layout_info"
android:orientation="vertical">
<ListView
android:id="#+id/listViewEjercicios"
android:layout_width="match_parent"
android:layout_height="match_parent"></ListView>
<include
android:id="#+id/tool_bar_ejercicios"
layout="#layout/toolbar" />
<android.support.design.widget.FloatingActionButton
android:id="#+id/fabCrearEntrenamiento"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:layout_margin="16dp"
android:clickable="true"
android:src="#drawable/ic_action_add"
app:fabSize="normal"
app:layout_anchor="#id/layout_ejercicios"
app:layout_anchorGravity="bottom|right|end" />
</FrameLayout>
It works almost fine but the first row always is hidden by the toolbar.
The rest rows look good.
I try to add padding_top in the row_layout.xml, but is no a solution.
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/rowTextView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="10dp"
android:textSize="21sp" >
</TextView>
How can i do that?
try this;
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
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:background="#color/holo_light_background"
android:fitsSystemWindows="true"
tools:context=".MainActivity">
<android.support.design.widget.AppBarLayout
android:id="#+id/bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay">
<include
android:id="#+id/tool_bar_ejercicios"
layout="#layout/toolbar" />
</android.support.design.widget.AppBarLayout>
<FrameLayout
android:id="#+id/layout_ejercicios"
android:layout_width="match_parent"
android:layout_height="300dp"
android:layout_alignParentStart="true"
android:layout_below="#+id/layout_info"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
android:orientation="vertical">
<ListView
android:id="#+id/list"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#id/bar"/>
<android.support.design.widget.FloatingActionButton
android:id="#+id/fabCrearEntrenamiento"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:layout_margin="16dp"
android:clickable="true"
android:src="#drawable/ic_action_add"
app:fabSize="normal"
app:layout_anchor="#id/layout_ejercicios"
app:layout_anchorGravity="bottom|right|end" />
</FrameLayout>
</android.support.design.widget.CoordinatorLayout>
You used a FrameLayout. Yes, all views overlap in a FrameLayout. Use a LinearLayout because you have set orientation="vertical"
You should put Toolbar above other things
CoordinatorLayout would be better
For example,
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
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:fitsSystemWindows="true">
<android.support.design.widget.AppBarLayout
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="#+id/tool_bar_ejercicios"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:popupTheme="#style/AppTheme.PopupOverlay"/>
</android.support.design.widget.AppBarLayout>
<!-- Some other layout behind the Action Button -->
<include layout="#layout/list_view"/>
<android.support.design.widget.FloatingActionButton
android:id="#+id/fabCrearEntrenamiento"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|right|end"
android:layout_margin="#dimen/fab_margin"
android:src="#drawable/ic_action_add"/>
</android.support.design.widget.CoordinatorLayout>
I'm using a RecyclerView to display a list of items, and I would like to show below the list a box with some details but I don't how to do it, I have tried a lot of things but I cant display the box I want.
My idea is implement something like in the image below:
Below is my code:
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
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:fitsSystemWindows="true"
tools:context="...MainActivity"
android:background="#color/backgroundColor">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:popupTheme="#style/AppTheme.PopupOverlay" />
</android.support.design.widget.AppBarLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/user_subscriptions"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingTop="12dp"
android:paddingBottom="10dp"
app:layout_behavior="#string/appbar_scrolling_view_behavior"/>
// HERE I'M TRYING TO ADD THE BOX.
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:layout_margin="#dimen/fab_margin"
android:src="#drawable/ic_add" />
</android.support.design.widget.CoordinatorLayout>
Any idea how can I do it? Thanks!
try this one hope this will help you.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
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:layout_above="#+id/bottomBox"
android:fitsSystemWindows="true">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary" />
</android.support.design.widget.AppBarLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/user_subscriptions"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="10dp"
android:paddingTop="12dp"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:layout_margin="15dp"
android:background="#color/colorPrimary" />
</android.support.design.widget.CoordinatorLayout>
<LinearLayout
android:id="#+id/bottomBox"
android:layout_width="match_parent"
android:layout_height="60dp"
android:layout_alignParentBottom="true"
android:background="#android:color/white"
android:orientation="vertical" />
</RelativeLayout>
You can do it like this
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
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:fitsSystemWindows="true"
tools:context="...MainActivity"
android:background="#color/backgroundColor">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:popupTheme="#style/AppTheme.PopupOverlay" />
</android.support.design.widget.AppBarLayout>
// HERE I'M TRYING TO ADD THE BOX.
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<View
android:id="#+id/box"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_alignParentBottom="true"
/>
<android.support.v7.widget.RecyclerView
android:id="#+id/user_subscriptions"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingTop="12dp"
android:paddingBottom="10dp"
android:layout_above="#id/box"
app:layout_behavior="#string/appbar_scrolling_view_behavior"/>
</RelativeLayout>
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:layout_margin="#dimen/fab_margin"
android:src="#drawable/ic_add" />
</android.support.design.widget.CoordinatorLayout>
Use app:layout_behavior="#string/appbar_scrolling_view_behavior like this:-
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
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:fitsSystemWindows="true"
tools:context="...MainActivity"
android:background="#color/backgroundColor">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:popupTheme="#style/AppTheme.PopupOverlay" />
</android.support.design.widget.AppBarLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/user_subscriptions"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingTop="12dp"
android:paddingBottom="10dp"
app:layout_behavior="#string/appbar_scrolling_view_behavior"/>
<LinearLayout
android:id="#+id/bottomBox"
android:layout_width="match_parent"
android:layout_height="60dp"
app:layout_behavior="#string/appbar_scrolling_view_behavior
android:background="#android:color/white"
android:orientation="vertical" />
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:layout_margin="#dimen/fab_margin"
android:src="#drawable/ic_add" />
</android.support.design.widget.CoordinatorLayout>
Your RecyclerView has match_parent in height. so you cannot display anything below in because it will take all the screen height.
I tried too mych on how to force in a recyclerview below a view and i realised its a simple task.
<android.support.v4.widget.NestedScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_height="wrap_content"
android:fillViewport="true">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:id="#+id/line1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_gravity="center"
android:padding="16dp">
<Button
android:layout_below="#+id/recycler_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Create Group"
android:layout_gravity="center"
style="#style/Button.Primary"/>
<ImageView
android:id="#+id/image_view_group_image"
android:layout_width="120dp"
android:layout_height="120dp"
android:layout_margin="16dp"
android:layout_gravity="center"
android:scaleType="centerInside"
android:background="#color/colorPrimary"
android:src="#drawable/ic_edit_white_24dp"/>
<TextView
android:layout_below="#+id/image_view_group_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="16dp"
android:layout_gravity="center"
android:text="Please add an icon for your group"/>
<android.support.design.widget.TextInputLayout
android:id="#+id/text_input_layout1"
android:layout_below="#+id/image_view_group_image"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:hint="Type your group subject here">
<android.support.design.widget.TextInputEditText
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</android.support.design.widget.TextInputLayout>
<android.support.design.widget.TextInputLayout
android:id="#+id/text_input_layout"
android:layout_below="#+id/text_input_layout1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:hint="Add Members">
<android.support.design.widget.TextInputEditText
android:id="#+id/text_input_layout_add_members"
android:layout_width="match_parent"
android:drawableRight="#drawable/ic_search_grey_600_24dp"
android:drawableEnd="#drawable/ic_search_grey_600_24dp"
android:layout_height="wrap_content" />
</android.support.design.widget.TextInputLayout>
</LinearLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/recycler_view"
android:layout_below="#+id/line1"
android:layout_marginTop="16dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_behavior="#string/appbar_scrolling_view_behavior"/>
</RelativeLayout>
You can use NestedScrollView if you want to display RecycleView with other Views like (TextView, Button another recycleView ....) like this example: https://stackoverflow.com/a/63266559/7308789