I am building an application and i want in an Activity to have the CollapsingToolbarLayout
. Everything works fine except the fact that when i scroll to the very top half of the button goes underneath the toolbar like this:
what i want to achieve is this:
my layout is:
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout 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:id="@+id/activity_game_info"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:id="@+id/appBar_layout"
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="210dp"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:contentScrim="@android:color/transparent"
app:expandedTitleMarginStart="48dp"
app:expandedTitleMarginBottom="-70dp"
app:expandedTitleMarginEnd="64dp"
android:fitsSystemWindows="true">
<ImageView
android:id="@+id/imageDescTropos"
android:layout_width="match_parent"
android:layout_height="250dp"
android:scaleType="fitXY"
android:contentDescription="Nothing"
android:src="@drawable/download"
android:fitsSystemWindows="true"
app:layout_collapseMode="parallax"/>
<android.support.v7.widget.Toolbar
android:id="@+id/toolBar"
android:layout_width="match_parent"
app:titleEnabled="false"
android:layout_height="?attr/actionBarSize"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
app:layout_collapseMode="pin" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/white"
app:layout_behavior="@string/appbar_scrolling_view_behavior">
<LinearLayout
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_marginTop="25dp"
android:layout_height="match_parent">
<TextView
android:id="@+id/game_full_name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="13.5dp"
android:layout_marginLeft="16dp"
android:scrollbars="vertical"
android:text="Game Name"
android:fadeScrollbars="true"
android:fontFamily="sans-serif-black"
android:textColor="@color/black"
android:textSize="18sp"
tools:targetApi="jelly_bean" />
<TextView
android:id="@+id/my_text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Category"
android:layout_marginLeft="16dp"/>
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="9dp"
android:background="@color/game_info_jackpot_background">
<TextView
android:text="Text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fontFamily="sans-serif-light"
android:layout_marginTop="9.5dp"
android:layout_marginBottom="9dp"
android:layout_marginLeft="16dp"
android:id="@+id/textView" />
</LinearLayout>
<TextView
android:text="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer iaculis luctus elementum. Maecenas ultricies volutpat mollis. Pellentesque lacinia euismod libero. Integer ullamcorper nulla suscipit eros maximus, at sollicitudin ante faucibus. Nulla semper purus ac dignissim porttitor. Sed in nisl posuere, fermentum arcu id, ultricies nibh. Morbi a pulvinar arcu, nec varius massa. Mauris ut sagittis magna. Etiam feugiat ut neque ac congue. Maecenas quis felis eget elit placerat venenatis ut ut nisl. Sed condimentum libero condimentum bibendum imperdiet. Sed non libero a odio faucibus consectetur. Nunc dignissim nisl ut nibh lacinia, a commodo tellus venenatis. Aenean diam diam, volutpat at aliquet id, tempor ut odio. Nunc sit amet egestas lectus, in consequat magna."
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="16dp"
android:fontFamily="sans-serif-light"
android:layout_marginRight="16dp"
android:layout_marginTop="13.5dp"
android:id="@+id/textView2" />
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
<Button
android:id="@+id/toolbar_Button_Play"
android:text="@string/play_now"
android:layout_width="300dp"
android:background="@color/blue"
android:textColor="@color/white"
app:layout_anchor="@id/appBar_layout"
app:layout_anchorGravity="bottom|center"
android:layout_height="wrap_content" />
</android.support.design.widget.CoordinatorLayout>
How can i achieve the button not to hide?
UPDATE
I have noticed that if i replace the Button
with a android.support.design.widget.FloatingActionButton
it just hides by itself. So the problem is with the widget. Anyone have any idea how to prevent this from happening?
This should work, it said that because noone declared the ID, now Button declared the id appBar_layout, and the barLayout only uses it. I also added elevation.