web-dev-qa-db-ja.com

CoordinatorLayout + AppbarLayout + Viewpagerが子レイアウトのサイズを変更しない

CoordinatorLayoutをViewPagerおよびViewPagerと組み合わせて使用​​すると問題が発生します。 enter image description here

レイアウトのサイズが正しく変更されません。解決された高さにタブの高さが含まれているとします。だから私が一番下までスクロールすると、これが見えます：

enter image description here

メインレイアウトコード：

<?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"
    Android:layout_width="match_parent"
    Android:layout_height="match_parent"
    Android:fitsSystemWindows="true"
    tools:context=".activities.MainActivity">

    <Android.support.design.widget.AppBarLayout
        Android:id="@+id/app_bar_layout"
        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:layout_scrollFlags="scroll|enterAlways"
            app:popupTheme="@style/AppTheme.PopupOverlay" />

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

    <FrameLayout
        Android:id="@+id/root_view"
        Android:layout_width="match_parent"
        Android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">

        <include layout="@layout/content_main" />
    </FrameLayout>

    <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="@Android:drawable/ic_dialog_email" />

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

タブレイアウトコード

<?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"
    xmlns:tools="http://schemas.Android.com/tools"
    Android:layout_width="match_parent"
    Android:layout_height="match_parent"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    tools:context=".activities.MainActivity"
    tools:showIn="@layout/activity_main"
    Android:orientation="vertical">

    <Android.support.design.widget.TabLayout
        Android:id="@+id/tab_layout"
        Android:layout_width="match_parent"
        Android:layout_height="wrap_content"
        app:layout_behavior="@string/appbar_scrolling_view_behavior"/>

    <FrameLayout
        Android:id="@+id/regularLayout"
        Android:layout_width="match_parent"
        Android:layout_height="wrap_content"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">

        <Android.support.v4.view.ViewPager
            Android:id="@+id/pager"
            Android:layout_width="match_parent"
            Android:layout_height="wrap_content"
            app:layout_behavior="@string/appbar_scrolling_view_behavior"/>
    </FrameLayout>
</LinearLayout>

子レイアウトコード

<RelativeLayout xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:layout_width="match_parent"
    Android:layout_height="match_parent"
    Android:background="@color/colorPrimary"
    Android:clickable="false"
    Android:orientation="vertical">

    <ImageView
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:layout_alignParentBottom="true"
        Android:layout_alignParentRight="true"
        Android:layout_gravity="bottom"
        Android:layout_marginRight="85dp"
        Android:src="@drawable/ic_Android" />

</RelativeLayout>

何か案が？私はいくつかの投稿を見ましたが、問題を見つけることができませんでした、私は子供の高さがscreenHeight-actionBarHeight-TabBatHeightである必要があります

androidandroid-layoutandroid-viewpagerandroid-coordinatorlayoutandroid-appbarlayout
19
Gaston Flores

CoordinatorLayout + AppBarLayout + ViewPagerを使用する際に考慮すべき点がいくつかあります。

  • ViewPagerを配置するInsideCoordinatorLayout butOutsideAppbarLayout
  • OnlyViewPagerはその動作をapp:layout_behavior="@string/appbar_scrolling_view_behavior" putに設定する必要があります
  • TabLayoutをAppBarLayoutの中に配置します
  • AppBarLayout直接の子にスクロールフラグを設定することもできます-）
  • CoordinatorLayoutとAppBarLayoutの両方にAndroid:fitsSystemWindows="true"を設定して、スクリムの色をステータスバーに適用できるようにします

したがって、最終的なレイアウトはおそらく次のようになるはずです（子レイアウトは含まれていません。これは、ViewPagerページだったと思います）。

<?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"
    Android:layout_width="match_parent"
    Android:layout_height="match_parent"
    Android:fitsSystemWindows="true">

    <Android.support.design.widget.AppBarLayout
        Android:id="@+id/app_bar_layout"
        Android:layout_width="match_parent"
        Android:layout_height="wrap_content"
        Android:theme="@style/AppTheme.AppBarOverlay"
        Android:fitsSystemWindows="true">

        <Android.support.v7.widget.Toolbar
            Android:id="@+id/toolbar"
            Android:layout_width="match_parent"
            Android:layout_height="?attr/actionBarSize"
            Android:background="?attr/colorPrimary"
            app:layout_scrollFlags="scroll|enterAlways"
            app:popupTheme="@style/AppTheme.PopupOverlay" />

        <Android.support.design.widget.TabLayout
            Android:id="@+id/tab_layout"
            Android:layout_width="match_parent"
            Android:layout_height="wrap_content"
            app:layout_scrollFlags="scroll|enterAlways" />

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


    <Android.support.v4.view.ViewPager
        Android:id="@+id/pager"
        Android:layout_width="match_parent"
        Android:layout_height="wrap_content"
        app:layout_behavior="@string/appbar_scrolling_view_behavior" />

    <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="@Android:drawable/ic_dialog_email" />

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

そして、あなたが間違いなくチェックすべきいくつかのリソースがあります：

10
Behzad Bahmanyar

子レイアウトでNestedScrollviewを使用できます。

<Android.support.v4.widget.NestedScrollView
    Android:id="@+id/nest_scrollview"
    Android:layout_width="match_parent"
    Android:layout_height="match_parent"
    Android:layout_gravity="fill_vertical"
    Android:fillViewport="true"
    Android:fitsSystemWindows="true"
    app:layout_behavior="@string/appbar_scrolling_view_behavior">

       <your layout>

</Android.support.v4.widget.NestedScrollView>
3
Nirmal Shethwala

ページャーにrequestLayoutを強制すると、この問題を解決するのに役立ちました

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    ...
    mViewPager.post(new Runnable() {
        @Override
        public void run() {
            mViewPager.requestLayout();
        }
    });
}
2
Salah Hammouda

私は同様の問題があり、完璧な解決策が追加されました

Android:layout_marginBottom="?attr/actionBarSize

レイアウトで

app:layout_behavior="@string/appbar_scrolling_view_behavior"

例：

<?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/main_content"
Android:layout_width="match_parent"
Android:layout_height="match_parent"
Android:fitsSystemWindows="true">

<Android.support.design.widget.AppBarLayout
    Android:id="@+id/appbar"
    Android:layout_width="match_parent"
    Android:layout_height="wrap_content"
    Android:paddingTop="@dimen/appbar_padding_top"
    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:layout_scrollFlags="scroll|enterAlways"
        app:popupTheme="@style/AppTheme.PopupOverlay">

    </Android.support.v7.widget.Toolbar>

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

<Android.support.v4.view.ViewPager
    Android:id="@+id/container"
    Android:layout_width="match_parent"
    Android:layout_height="match_parent"
    Android:layout_marginBottom="?attr/actionBarSize"
    app:layout_behavior="@string/appbar_scrolling_view_behavior" />

<Android.support.design.widget.FloatingActionButton
    Android:id="@+id/fab"
    Android:layout_width="wrap_content"
    Android:layout_height="wrap_content"
    Android:layout_gravity="end|bottom"
    Android:layout_margin="@dimen/fab_margin"
    app:backgroundTint="@Android:color/holo_green_dark"
    app:srcCompat="@Android:drawable/ic_input_add" />

</Android.support.design.widget.CoordinatorLayout>
2
Sylwester Jędraszek

設計の問題を解決するためのリンクを提案します。

チュートリアルを確認

Main Layoutのように使用します

<Android.support.design.widget.CoordinatorLayout
    Android:id="@+id/coordinator"
    Android:layout_width="match_parent"
    Android:layout_height="match_parent">

    <LinearLayout
        Android:layout_width="match_parent"
        Android:layout_height="match_parent"
        Android:orientation="vertical">

        <Android.support.v7.widget.Toolbar
            Android:id="@+id/toolbar"
            Android:layout_width="match_parent"
            Android:layout_height="?attr/actionBarSize"
            Android:background="?attr/colorPrimary"
            Android:theme="@style/ThemeOverlay.AppCompat.Dark" />

        <Android.support.design.widget.TabLayout
            Android:id="@+id/tablayout"
            Android:layout_width="match_parent"
            Android:layout_height="wrap_content"
            Android:background="?attr/colorPrimary"
            app:tabGravity="fill"
            Android:theme="@style/ThemeOverlay.AppCompat.Dark" />

        <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.design.widget.FloatingActionButton
        Android:id="@+id/fab"
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:layout_alignParentBottom="true"
        Android:layout_gravity="bottom|right"
        Android:layout_marginBottom="@dimen/activity_vertical_margin"
        Android:layout_marginRight="@dimen/activity_horizontal_margin"
        Android:src="@drawable/ic_done"/>

</Android.support.design.widget.CoordinatorLayout>
1
Dinesh