I tried everything that I could to remove this gap (shown in the screenshot below) from the bottom of the layout, however got nothing but disappointment!
Here is the xml code of tournament_home.xml:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/background">
<include
android:id="#+id/toolbar_tournament_home"
layout="#layout/toolbar_tournament_home"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:layout_alignParentTop="true" />
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/toolbar_tournament_home">
<LinearLayout
android:id="#+id/lnl_home_screen"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/frame_home_screen_tournament_name"
android:orientation="vertical">
<ab9.com.cricliveptc.tabs.SlidingTabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/black"
android:elevation="2dp" />
<View
android:id="#+id/toolbar_shadow"
android:layout_width="match_parent"
android:layout_height="#dimen/margin2x"
android:background="#drawable/toolbar_dropshadow" />
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_marginTop="-4dp"
android:layout_weight="1" />
</LinearLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/recycler_view"
android:layout_width="270dp"
android:layout_height="match_parent"
android:layout_gravity="left"
android:background="#FFFFFF"
android:scrollbars="vertical" />
</android.support.v4.widget.DrawerLayout>
Here is the screenshot, where you can clearly see a small horizontal gap left at the bottom of the screen.
How to fix that?
Remove android:layout_marginTop="-4dp" from your layout.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/background">
<include
android:id="#+id/toolbar_tournament_home"
layout="#layout/toolbar_tournament_home"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:layout_alignParentTop="true" />
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/toolbar_tournament_home">
<LinearLayout
android:id="#+id/lnl_home_screen"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/frame_home_screen_tournament_name"
android:orientation="vertical">
<ab9.com.cricliveptc.tabs.SlidingTabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/black"
android:elevation="2dp" />
<View
android:id="#+id/toolbar_shadow"
android:layout_width="match_parent"
android:layout_height="#dimen/margin2x"
android:background="#drawable/toolbar_dropshadow" />
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" />
</LinearLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/recycler_view"
android:layout_width="270dp"
android:layout_height="match_parent"
android:layout_gravity="left"
android:background="#FFFFFF"
android:scrollbars="vertical" />
</android.support.v4.widget.DrawerLayout>
</RelativeLayout>
http://developer.android.com/reference/android/support/v4/widget/DrawerLayout.html
DrawerLayout acts as a top-level container for window content that
allows for interactive "drawer" views to be pulled out from the edge
of the window.
You should not use that RelativeLayout as the top-level.that could be something like this with adding Toolbar in your contents:
<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_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/toolbar_tournament_home">
<LinearLayout
android:id="#+id/lnl_home_screen"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/frame_home_screen_tournament_name"
android:orientation="vertical">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbarmain"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#android:color/white"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
app:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar" />
<ab9.com.cricliveptc.tabs.SlidingTabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/black"
android:elevation="2dp" />
<View
android:id="#+id/toolbar_shadow"
android:layout_width="match_parent"
android:layout_height="#dimen/margin2x"
android:background="#drawable/toolbar_dropshadow" />
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/recycler_view"
android:layout_width="270dp"
android:layout_height="match_parent"
android:layout_gravity="left"
android:background="#FFFFFF"
android:scrollbars="vertical" />
<!-- this is not a good place -->
</android.support.v4.widget.DrawerLayout>
Also, i'd rather to use CoordinatorLayout nowadays with SupportLibrary.
One more thing, your design is completly wrong i guess, RecyclerView is going to be like NavigationDrawer and that's not what android docs says.
You may want to take a look at here also: http://developer.android.com/training/implementing-navigation/nav-drawer.html
Remove android:layout_marginTop="-4dp" as others have stated. I'm guessing that you mean android:layout_marginTop="4dp" anyways.
If you want a margin between the View and the ViewPager just set a bottom margin to the View element.
The reason is that android:layout_height="0dp" and android:layout_weight="1" is working but then you are setting a negative top margin which is moving up the element.
try removing the android:layout_weight="1" of viewpager and replace android:layout_height="0dp" with android:layout_height="match_parent"
Related
I want to set layout_weight with viewpager 40% and recyclerview 60% in below code. But its not showing properly.It not showing properly in 6.0 but works perfectly in above 6.0 versions.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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:id="#+id/rel"
android:orientation="vertical"
android:layout_height="match_parent">
<android.support.v4.view.ViewPager
android:id="#+id/pager"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:layout_alignParentTop="true" />
<com.viewpagerindicator.CirclePageIndicator
android:id="#+id/indicator"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginTop="-20dp"
android:padding="10dip"
app:centered="true"
app:radius="20dp"
android:layout_alignParentBottom="true"
app:pageColor="#e5e5e5"
app:fillColor="#ffffff"
app:snap="false" />
<android.support.v7.widget.RecyclerView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_margin="5dp"
android:id="#+id/rcv"
android:layout_weight="2"
></android.support.v7.widget.RecyclerView>
</LinearLayout>
Below is my activity where i am replacing this fragment file.
<?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"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:openDrawer="start">
<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"
tools:context="com.example.laundry.laundryapp.activity.Navigation_drawer">
<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>
<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:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:context="com.example.laundry.laundryapp.activity.Navigation_drawer">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:id="#+id/lin"
android:layout_alignParentTop="true"
android:layout_above="#+id/navigation">
</LinearLayout>
<android.support.design.widget.BottomNavigationView
android:id="#+id/navigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginEnd="0dp"
android:layout_marginStart="0dp"
android:background="?android:attr/windowBackground"
android:layout_alignParentBottom="true"
app:menu="#menu/navigation" />
</RelativeLayout>
</android.support.design.widget.CoordinatorLayout>
<android.support.design.widget.NavigationView
android:id="#+id/nav_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
android:fitsSystemWindows="true"
app:headerLayout="#layout/nav_header_main2"
app:menu="#menu/activity_main2_drawer" />
</android.support.v4.widget.DrawerLayout>
Hey, I read somewhere that it is recommended to assign weight to all
the children of the parent layout. Also, it is important to include
weightSum in the parent view and the height of the views should be 0dp (or width in case the orientation is "horizontal")
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:id="#+id/rel"
android:weightSum="20">
<android.support.v4.view.ViewPager
android:id="#+id/pager"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="5"
/>
<com.viewpagerindicator.CirclePageIndicator
android:id="#+id/indicator"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:layout_centerHorizontal="true"
android:layout_marginTop="-20dp"
android:padding="10dip"
app:centered="true"
app:radius="20dp"
android:layout_alignParentBottom="true"
app:pageColor="#e5e5e5"
app:fillColor="#ffffff"
app:snap="false" />
<android.support.v7.widget.RecyclerView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_margin="5dp"
android:id="#+id/rcv"
android:layout_weight="14"
/>
</LinearLayout>
Try this code, also try adjusting the weights to get the desired look. Hope this works.
You can set android:layout_weight="0.4" and android:layout_weight="0.6"
Use ConstrainLayout combined with Guidelines (in percentage for sure), it's way more easier to arrive what you are looking for.
I am working on a UI that utilizes the CoordinatorLayout/AppBarLayout combo as normally seen in most examples but there is this requirement of mine: I want to overlay the AppBarLayout with a View at all times. So, whatever scrolling behavior that happens, should happen under this view. Currently, this is what I am seeing:
Here, the blue bar that you see is the one that I want on top of everything. As you can see, it is hidden initially and only gets exposed when we have scrolled AppBarLayout off the screen. For your reference, here is the code for this layout and its id is android:id="#+id/linearLayout":
<?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"
tools:context="com.example.snapsboardmainpage.MainActivity"
tools:layout_editor_absoluteX="8dp"
tools:layout_editor_absoluteY="8dp">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:id="#+id/linearLayout3"
android:layout_width="match_parent"
android:layout_height="40dp"
app:layout_scrollFlags="scroll|snap"
android:orientation="vertical">
</LinearLayout>
<LinearLayout
android:id="#+id/linearLayout1"
android:layout_width="match_parent"
android:layout_height="112dp"
android:orientation="vertical"
app:layout_scrollFlags="scroll|snap"
android:background="#android:color/holo_green_light">
</LinearLayout>
<android.support.design.widget.TabLayout
android:id="#+id/id_tab_photosvideos_albums"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_scrollFlags="scroll|snap">
<android.support.design.widget.TabItem
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<android.support.design.widget.TabItem
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</android.support.design.widget.TabLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
android:id="#+id/nested_container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<android.support.v4.view.ViewPager
android:id="#+id/id_viewpager_photosvideos_albums"
android:layout_width="match_parent"
android:layout_height="match_parent">
</android.support.v4.view.ViewPager>
</android.support.v4.widget.NestedScrollView>
<LinearLayout
android:id="#+id/linearLayout"
android:layout_width="match_parent"
android:layout_height="40dp"
android:orientation="vertical"
android:layout_gravity="top"
app:layout_behavior="com.example.snapsboardmainpage.TopActionBarBehavior"
android:background="#android:color/holo_blue_light">
</LinearLayout>
<LinearLayout
android:id="#+id/linearLayout2"
android:layout_width="match_parent"
android:layout_height="56dp"
android:orientation="vertical"
android:layout_gravity="bottom"
android:background="#android:color/holo_orange_light">
</LinearLayout>
</android.support.design.widget.CoordinatorLayout>
How can I achieve this overlay behavior?(it would be preferable if this blue bar could remain as a direct child of CoordinatorLayout)
Although the question seems to be difficult, the solution turned out to be amazingly simple:
android:elevation="8dp"
Yes, that was it. Just set it on the the view that had to overlay the AppBarLayout.
android:elevation="8dp" work on API level 21.
So You can put your view in side a new AppBarLayout.
In my case , i put my xml code in to new AppBarLayout like below
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/root"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/black"
android:fitsSystemWindows="true"
android:orientation="vertical">
<com.google.android.material.appbar.AppBarLayout
android:id="#+id/app_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay">
<androidx.appcompat.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"
app:title="#string/app_name" />
<com.google.android.material.tabs.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</com.google.android.material.appbar.AppBarLayout>
<!--i want below view on the top of app bar layout of id(android:id="#+id/app_bar")
so i put my all view inside the new app bar layout of id(
android:id="#+id/longClickItem")-->
<com.google.android.material.appbar.AppBarLayout
android:id="#+id/longClickItem"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay"
android:visibility="gone">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/colorPrimary"
android:paddingTop="#dimen/_5sdp"
android:paddingBottom="#dimen/_5sdp">
<ImageView
android:id="#+id/longItemBack"
android:layout_width="#dimen/_25sdp"
android:layout_height="#dimen/_25sdp"
android:layout_centerVertical="true"
android:layout_marginStart="#dimen/_15sdp"
android:layout_marginEnd="#dimen/_15sdp"
android:src="#drawable/back_arrow" />
<TextView
android:id="#+id/longItemCount"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_toEndOf="#id/longItemBack"
android:text="0"
android:textColor="#android:color/white"
android:textSize="#dimen/_18sdp"
android:textStyle="bold" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_centerVertical="true">
<ImageView
android:id="#+id/longItemDelete"
style="#style/long_press_image_view"
android:src="#drawable/item_long_delete" />
</LinearLayout>
</RelativeLayout>
</com.google.android.material.appbar.AppBarLayout>
<androidx.viewpager.widget.ViewPager
android:id="#+id/viewPager"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
I'm working on a view that need to be scrolled using coordinator layout and inside it should have recyclerview.
i've tried several answer, but it didn't work at all.
There's still empty space below the recycler view section.
Here's my activity.xml
<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"
tools:context="com.woi.adeisme.MainActivity"
android:background="#ff0000"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:fitsSystemWindows="true"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
app:layout_scrollFlags="scroll"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:text="Masa?"
android:paddingTop="60dp"
android:paddingBottom="60dp"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
</LinearLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/recyclerView"
android:background="#0000ff"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
android:fitsSystemWindows="true"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="0dp"
android:layout_margin = "0dp">
</android.support.v7.widget.RecyclerView>
</android.support.design.widget.CoordinatorLayout>
i've tried :
1. set layout_height = match_parent / wrap content
2. fitsSystemWindow
3. fillPort
and this still not working..
can anybody help me ?
try Linear layout instead of CoordinatorLayout like below this may help
<LinearLayout
android:orientation="vertical"
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:background="#ff0000"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:fitsSystemWindows="true"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
app:layout_scrollFlags="scroll"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:text="Masa?"
android:paddingTop="60dp"
android:paddingBottom="60dp"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
</LinearLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/recyclerView"
android:background="#0000ff"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
android:fitsSystemWindows="true"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="0dp"
android:layout_margin = "0dp"/>
<!-- <include layout="#layout/useless_content"/>-->
</LinearLayout>
I've tried searching all over, but I can't seem to figure this one out. Basically, I have a layout with Scrollview and elements inside it. I want to put a button inside the scrollview which would be at the end/bottom and you can only see it when you scroll all the way to the bottom.
I've tried doing it like this:
<ScrollView 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:fitsSystemWindows="true"
android:orientation="vertical">
<RelativeLayout
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:id="#+id/topcontainer">
<android.support.v7.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/toolbar_review"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/colorPrimary"
android:minHeight="?attr/actionBarSize"
android:theme="#style/ThemeOverlay.AppCompat.ActionBar"
app:title="Review Your Massage">
</android.support.v7.widget.Toolbar>
<include layout="#layout/card_review"/>
</LinearLayout>
<Button
android:id="#+id/buttonReview"
android:layout_width="match_parent"
android:layout_height="60dp"
android:layout_alignParentBottom="true"
android:background="#color/colorAccent"
android:text="#string/book"
android:layout_below="#+id/topcontainer"
/>
</RelativeLayout>
</ScrollView>
The button is indeed at the bottom but there is space beneath it. If I run the app on a phone with bigger resolution, the button will be almost in the middle of the screen. How can I make it so no matter the resolution it will always stay on bottom?
Here's a screenshot of what it looks like at the moment:
With android:layout_height="match_parent" and android:fillViewport="true" the ScrollView uses all the available space, even if the children are smaller.
The Space has a android:layout_weight="1" to receive the extra space, so the button is always at the bottom.
An explanation by Romain Guy with more details.
<ScrollView 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"
android:fillViewport="true"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:id="#+id/topcontainer">
<android.support.v7.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/toolbar_review"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/colorPrimary"
android:minHeight="?attr/actionBarSize"
android:theme="#style/ThemeOverlay.AppCompat.ActionBar"
app:title="Review Your Massage">
</android.support.v7.widget.Toolbar>
<include layout="#layout/card_review"/>
<android.support.v4.widget.Space
android:layout_width="match_parent"
android:layout_weight="1"
android:layout_height="0dp" />
<Button
android:id="#+id/buttonReview"
android:layout_width="match_parent"
android:layout_height="60dp"
android:background="#color/colorAccent"
android:text="#string/book" />
</LinearLayout>
</ScrollView>
try this
<ScrollView 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"
android:fillViewport="true"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:id="#+id/topcontainer">
<android.support.v7.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/toolbar_review"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/colorPrimary"
android:minHeight="?attr/actionBarSize"
android:theme="#style/ThemeOverlay.AppCompat.ActionBar"
app:title="Review Your Massage">
</android.support.v7.widget.Toolbar>
<include layout="#layout/card_review"/>
</LinearLayout>
<Button
android:id="#+id/buttonReview"
android:layout_width="match_parent"
android:layout_height="60dp"
android:layout_alignParentBottom="true"
android:background="#color/colorAccent"
android:text="#string/book"
/>
</RelativeLayout>
</ScrollView>
I'm trying to do something like this:
I currently have the above layout without the header implemented. All I need is to figure out how to add the header.
Here is the header layout I want to put above the tabs:
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:id="#+id/header"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_gravity="center_horizontal"
android:background="#color/green">
<LinearLayout
android:orientation="horizontal"
android:layout_width="wrap_content"
android:layout_height="match_parent" >
<ImageView
android:layout_width="50dp"
android:layout_height="50dp"
android:background="#drawable/ic_image"
android:adjustViewBounds="true"
android:scaleType="centerCrop"
android:layout_gravity="center_vertical" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hey!"
android:textColor="#color/white"
android:textSize="24sp"
android:layout_gravity="center_vertical" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
I use a RecyclerView for the content below the tabs. I use 3 different Fragments for the Activity.
Here is my Activity:
<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.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:elevation="0dp">
<android.support.v7.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/toolbar_group"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="0dp"
android:background="#color/blue"
app:layout_scrollFlags="scroll|enterAlways|enterAlwaysCollapsed"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light">
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabTextAppearance="#style/TabLayout"
app:tabSelectedTextColor="#color/white"
app:tabTextColor="#color/white"
/>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/pager"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
/>
</android.support.design.widget.CoordinatorLayout>
And here is one of my Fragments:
<android.support.design.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v7.widget.RecyclerView
android:id="#+id/recycler_view"
android:scrollbars="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
/>
</android.support.design.widget.CoordinatorLayout>
How can I add the header above the TabLayout and keep normal scrolling behaviors?
You just need a RecyclerView to do that.
Combine your header and tabLayout to a Header view, then add to your RecyclerView.
Check https://github.com/u3breeze/android-RecyclerView-WithHeaderAndFooter. I did a extension of RecyclerView.Adapter. Easy to add header and footer to RecyclerView.