android toolbar display half content

Question

I use CoordinatorLayout and CollapsingToolbarLayout, I don't know what cause this error, this is my xml file

main.xml for activity

<?xml version="1.0" encoding="utf-8"?>

     Licensed under the Apache License, Version 2.0 (the "License");
     you may not use this file except in compliance with the License.
     You may obtain a copy of the License at

          http://www.apache.org/licenses/LICENSE-2.0

     Unless required by applicable law or agreed to in writing, software
     distributed under the License is distributed on an "AS IS" BASIS,
     WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
     See the License for the specific language governing permissions and
     limitations under the License.

-->
<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:fitsSystemWindows="true">

    <include layout="@layout/toolbar" />


    <FrameLayout
        android:id="@+id/fragment_container"
        android:layout_width="fill_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        app:layout_behavior="@string/appbar_scrolling_view_behavior" />


</android.support.design.widget.CoordinatorLayout>

toolbar.xml for toolbar view

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.AppBarLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/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="match_parent"
        android:fitsSystemWindows="true"
        app:contentScrim="@color/actionbar"
        app:expandedTitleTextAppearance="@style/actinbar.textview.big"
        app:layout_scrollFlags="scroll|exitUntilCollapsed"
        app:statusBarScrim="@color/actionbar"
        app:titleEnabled="false">



        <ImageView
            android:id="@+id/toolbarbg"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:fitsSystemWindows="true"
            android:scaleType="centerCrop"
            android:src="@drawable/bg_ovenui_pic_"
            android:visibility="gone"
            app:layout_collapseMode="parallax" />

        <RelativeLayout
            android:id="@+id/toolbar_layout"
            android:layout_width="match_parent"
            android:layout_height="180dp"
            android:layout_gravity="bottom"
            android:visibility="gone"></RelativeLayout>

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            style="@style/ToolBarStyle"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            app:layout_collapseMode="pin"
            app:layout_scrollFlags="scroll|enterAlways" />

    </android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>

Freemon

add an empty view to CollapsingToolbarLayout, set height 80dp,looks work,but this is not a gool solution – Freemon

any solutions? have the same problem – Uniocular

Answer 1

Remove android:fitsSystemWindows="true" from AppBarLayout and you are good to go. When enabled, the AppBarLayout assumes that the status bar is not available and it has to occupy the entire real estate.

Mariomariology

Answer 2

Just remove android:fitsSystemWindows="true" because when it is true, it will adjust the padding of the AppbarLayout to leave space for the status bar.

Curren

Answer 3

Just insert you toolbar layout and frame layout inside a LinearLayout like below.

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <include layout="@layout/toolbar"/>

    <FrameLayout
        android:id="@+id/fragment_container"
        android:layout_width="fill_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        app:layout_behavior="@string/appbar_scrolling_view_behavior"/>
</LinearLayout>

This may help you.

Physoclistous

this make toolbar display fine, but this content view can't show, – Freemon

Coordinator layout is a special type of frame layout, so I think the problem is in the layout_height or layout_width. set your layout width to match_parent in frame layout instead of fill_parent. – Physoclistous

Answer 4

I had the same issue when I wanted to load ImageView in CollapsingToolbarLayout, after some research I found the solution like below:

<?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:id="@+id/coordinator_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
android:windowDrawsSystemBarBackgrounds="true"
tools:context="com.example.k1.DetailActivity">

<android.support.design.widget.AppBarLayout
    android:id="@+id/detail_app_bar"
    android:layout_width="match_parent"
    android:layout_height="@dimen/app_bar_height"
    android:fitsSystemWindows="true"
    android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

    <android.support.design.widget.CollapsingToolbarLayout
        android:id="@+id/collapsing_toolbar_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:fitsSystemWindows="true"
        app:collapsedTitleTextAppearance="@android:style/TextAppearance.Material.Small"
        app:contentScrim="?attr/colorPrimary"
        app:expandedTitleTextAppearance="@android:color/transparent"
        app:layout_scrollFlags="scroll|exitUntilCollapsed"
        tools:targetApi="lollipop">


        <ImageView
            android:id="@+id/detail_sliding_view_pager"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_gravity="fill|center"
            android:fitsSystemWindows="true"
            app:layout_collapseMode="parallax" />

        <android.support.v7.widget.Toolbar
            android:id="@+id/detail_toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:minHeight="?attr/actionBarSize"
            app:contentScrim="?attr/colorPrimary"
            app:layout_collapseMode="pin"
            app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
            app:statusBarScrim="?attr/colorAccent" />

    </android.support.design.widget.CollapsingToolbarLayout>

</android.support.design.widget.AppBarLayout>

Notice : AppBarLayout height value setted up as android:layout_height="@dimen/app_bar_height" in dimens resources values via 300dp for xxhdpi as you see <dimen name="app_bar_height">300dp</dimen>.
I hope this helps you.

Counterstatement