视图未在布局中心对齐 [英] View doesn't aligned in the center of layout

问题描述

我的布局简单，如下所示:

I have a simple layout, as follow:

<?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">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerVertical="true"
        android:layout_centerHorizontal="true"
        android:text: "NOT CENTRALIZED!" />

    <android.support.v7.widget.RecyclerView
        android:id="@+id/recyclerView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:visibility="gone" />   
</RelativeLayout>

上面的布局属于一个片段，该片段被加载到ViewPager内(属于一个Activity，在这里称为ActivityA.java).

The above layout belongs to a Fragment which is loaded inside a ViewPager (which belongs to an Activity - called here as ActivityA.java).

ActivityA.java xml布局文件如下:

The ActivityA.java xml layout file is like the following:

<?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.support.design.widget.AppBarLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:stateListAnimator="@animator/elevated_appbar"
    app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

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

        <android.support.design.widget.TabLayout
            android:id="@+id/tabLayout"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            app:tabIndicatorColor="@android:color/white"
            app:tabMode="fixed" />
</android.support.design.widget.AppBarLayout>

<android.support.v4.view.ViewPager
    android:id="@+id/viewPager"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:layout_behavior="@string/appbar_scrolling_view_behavior" />
</android.support.design.widget.CoordinatorLayout>

请注意，我正在使用 CoordinatorLayout ，而我的 ViewPager 具有 app:layout_behavior="@string/appbar_scrolling_view_behavior"属性.

Note that I'm using the CoordinatorLayout and my ViewPager has the app:layout_behavior="@string/appbar_scrolling_view_behavior" attribute.

让我感到困惑的一点是:为什么我在声明android:layout_centerVertical="true"和android:layout_centerVertical="true"以来，我的TextView并没有集中在布局上?！

The little thing that makes me confusing is: Why my TextView is not centralized on the layout since I'm declaring android:layout_centerVertical="true" and android:layout_centerVertical="true" to it?!

奇怪的是，当我删除 android.support.v4.view.ViewPager 上的app:layout_scrollFlags="scroll|enterAlways"属性时，内容显示在屏幕中间，但是... android .support.v7.widget.Toolbar 停止折叠并展开功能.

Strangely, when I remove the app:layout_scrollFlags="scroll|enterAlways" attribute on android.support.v4.view.ViewPager the content is displayed on the middle of the screen, but... the android.support.v7.widget.Toolbar stops the collapse and expand features.

编辑

在布局预览中，我们可以看到android.support.v4.view.ViewPager不在导航栏上方(但需要app:layout_behavior="@string/appbar_scrolling_view_behavior"才能将该视图置于android.support.design.widget.AppBarLayout下面).删除此属性时，android.support.v4.view.ViewPager会在导航栏上向上，但与android.support.design.widget.AppBarLayout重叠.

On the layout preview, we can see that the android.support.v4.view.ViewPager is not above the navigation bar (but the app:layout_behavior="@string/appbar_scrolling_view_behavior" is needed to put this view bellow the android.support.design.widget.AppBarLayout). When removing this attribute, the android.support.v4.view.ViewPager goes up the navigation bar, but overlaps the android.support.design.widget.AppBarLayout.

看看:

使用app:layout_behavior="@string/appbar_scrolling_view_behavior":

没有app:layout_behavior="@string/appbar_scrolling_view_behavior":

编辑2

因此，我决定进行测试以在引用良好的项目上重现此问题.一些材料特征，结果是...

So, I decided to do a test to reproduce this issue on a well referenced project which demonstrates some Material features and the result is...

...同样的问题！

如果有人想自己复制，则只需更改 fragment_cheese_list.xml 可以:

If someone wants to reproduce it yourself, only change the fragment_cheese_list.xml to:

<RelativeLayout 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/recyclerview"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:visibility="gone" />

<android.support.v7.widget.AppCompatTextView
    android:id="@+id/alertMessage"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerVertical="true"
    android:layout_centerHorizontal="true"
    android:text="ALSO, NOT CENTRALIZED..." />
</RelativeLayout>

推荐答案

尝试将app:layout_behavior="@string/appbar_scrolling_view_behavior"添加到片段的布局xml文件中.

Try adding app:layout_behavior="@string/appbar_scrolling_view_behavior" to your Fragment's layout xml file.

编辑1
实际上，它的行为符合预期. 当您将Viewpager与以下内容一起使用时:app:layout_behavior="@string/appbar_scrolling_view_behavior"

Edit1
Actually it is behaving as it is supposed to. When you have your Viewpager with:app:layout_behavior="@string/appbar_scrolling_view_behavior"

Android根据AppBarLayout的高度将您的ViewPager下移(可能会增加边距).当您向上滚动视图时，会重新调整此边距.因为这就是scrolling_view_behavior是

Android shifts your ViewPager down, according to the height of AppBarLayout (Might be adding margin to it). And this margin is readjusted when you scroll your view up. Because that is what scrolling_view_behavior is

且不包含:app:layout_behavior="@string/appbar_scrolling_view_behavior"

And without:app:layout_behavior="@string/appbar_scrolling_view_behavior"

您的ViewPager独立于AppBarLAyout，因此，没有空白，这就是为什么您的TextView在这种情况下出现在中间的原因.

Your ViewPager is independent of AppBarLAyout Hence, no margin thats why your TextView Appears in center in this case.

因此，实际上，您的TextView始终位于ViewPager的中心.它是移动的ViewPager.要更改该行为，您可能需要实现自己的布局行为.

So, in reality, your TextView is always in center of your ViewPager. Its the ViewPager that shifts. For changing that behavior you might need to implement your own Layout Behavior. This is how android does it.

这篇关于视图未在布局中心对齐的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！