Question

我面临一个非常不寻常的情况。我已经定义了一个布局文件，其中一些图标排列在RelativeLayout中并垂直对齐。问题是我没有在它们之间设置任何边距，在预览屏幕和模拟器上它们按预期显示，但在设备上它们总是以一致的边距分开。

我的问题是：为什么这些利润出现了？我该如何删除它们？

您可以在此处查看emulator (API 26)和physical device (API 19)上的结果之间的差异。

谈到代码，下面是我的布局XML文件。

<com.example.rusia.madcall.design.CustomSlidingPaneLayout
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"
tools:context="com.example.rusia.madcall.MapsActivity"
android:id="@+id/sliding_pane_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">

<!-- PLEASE DO NOT CHANGE CHILDREN ORDER -->

<!-- CONTENT 1 (on the left): The Master Pane -->
<FrameLayout
    android:id="@+id/master_pane"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content" />

<!-- CONTENT 2 (on the right): The main view -->
<com.flipboard.bottomsheet.BottomSheetLayout
    android:id="@+id/bottomsheet"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <!-- Map -->
        <fragment
            android:id="@+id/map"
            android:name="com.google.android.gms.maps.SupportMapFragment"
            android:layout_width="match_parent"
            android:layout_height="match_parent" />

        <!-- Icons on the left-top -->
        <RelativeLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content">

            <!-- Menu Icon -->
            <android.support.design.widget.FloatingActionButton
                android:id="@+id/fab_menu"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="start|top"
                android:layout_margin="5dp"
                android:src="@drawable/ic_menu_white_24dp"
                android:visibility="visible"
                app:backgroundTint="@color/colorPrimary" />

            <!-- Icons & Descriptions -->
            <RelativeLayout
                android:id="@+id/left_icons"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginStart="5dp"
                android:layout_below="@id/fab_menu"
                android:visibility="visible"
                android:layout_marginLeft="5dp">

                <!-- 1st icon: NEAR ME -->
                <RelativeLayout
                    android:id="@+id/near_me_box"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginTop="0dp">

                    <TextView
                        android:id="@+id/fab_near_me_description"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_alignParentLeft="true"
                        android:layout_alignParentStart="true"
                        android:layout_centerVertical="true"
                        android:layout_marginLeft="21dp"
                        android:layout_marginStart="21dp"
                        android:background="@drawable/bg_description_left_icon"
                        android:gravity="center_vertical|center_horizontal"
                        android:text="@string/near_me"
                        android:textColor="@color/white"
                        android:textSize="18sp"
                        android:visibility="gone" />

                    <android.support.design.widget.FloatingActionButton
                        android:id="@+id/fab_near_me"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_gravity="start|top"
                        android:src="@drawable/ic_near_me_white_24dp"
                        android:visibility="visible"
                        app:backgroundTint="@color/colorPrimary" />

                </RelativeLayout>

                <!-- 2nd icon: ADVANCED SEARCH -->
                <RelativeLayout
                    android:id="@+id/advanced_search_box"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_below="@+id/near_me_box"
                    android:layout_marginTop="0dp">

                    <TextView
                        android:id="@+id/fab_search_description"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_alignParentLeft="true"
                        android:layout_alignParentStart="true"
                        android:layout_centerVertical="true"
                        android:layout_marginLeft="22dp"
                        android:layout_marginStart="22dp"
                        android:background="@drawable/bg_description_left_icon"
                        android:gravity="center_vertical|center_horizontal|center"
                        android:text="@string/advanced_search"
                        android:textColor="@color/white"
                        android:textSize="18sp"
                        android:visibility="gone" />

                    <android.support.design.widget.FloatingActionButton
                        android:id="@+id/fab_search"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_gravity="start|top"
                        android:src="@drawable/ic_search_white_24dp"
                        android:visibility="visible"
                        app:backgroundTint="@color/colorPrimary" />

                </RelativeLayout>

                <!-- 3rd icon: SETTINGS -->
                <RelativeLayout
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_below="@+id/advanced_search_box"
                    android:layout_marginTop="0dp">

                    <TextView
                        android:id="@+id/fab_settings_description"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_alignParentLeft="true"
                        android:layout_alignParentStart="true"
                        android:layout_centerVertical="true"
                        android:layout_marginLeft="22dp"
                        android:layout_marginStart="22dp"
                        android:background="@drawable/bg_description_left_icon"
                        android:gravity="center_vertical|center_horizontal|center"
                        android:text="@string/settings"
                        android:textColor="@color/white"
                        android:textSize="18sp"
                        android:visibility="gone" />

                    <android.support.design.widget.FloatingActionButton
                        android:id="@+id/fab_settings"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_gravity="start|top"
                        android:src="@drawable/ic_settings_white_24dp"
                        android:visibility="visible"
                        app:backgroundTint="@color/colorPrimary" />

                </RelativeLayout>

            </RelativeLayout>

        </RelativeLayout>

        <android.support.design.widget.FloatingActionButton
            android:id="@+id/fab_location"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="end|top"
            android:layout_margin="5dp"
            android:src="@drawable/ic_my_location_white_24dp"
            android:visibility="visible"
            app:backgroundTint="@color/colorPrimary" />

    </FrameLayout>

</com.flipboard.bottomsheet.BottomSheetLayout>

Answer 1

感谢@azizbekian的建议我得到了真正的问题，我解决了它。我正在分享我的发现和我的解决方案。

首先，我在Layout Inspector中注意到FloatingActionButton有mPaddingTop，mPaddingBottom等都设置为42dp。我调查了FloatingActionButton（s）填充，实际上我发现了一个众所周知的问题（在StackOverflow中已经讨论过here）。 然后问题与FloatingActionButton 有关，而与RelativeLayout无关。更具体地说，在旧版Android上，这些按钮带有默认的全方位填充。

通过组合答案，我通过向我的所有FloatingButton添加以下属性来解决问题：

app:useCompatPadding="true"
app:elevation="0dp"
app:pressedTranslationZ="0dp"

这样可以删除内置填充并获得简单的图标。然后，您可以使用常见属性android：layout_margin或android：padding添加自定义填充或边距。

Here最终结果的示例，按钮之间的填充为10dp。

希望它有所帮助！

Answer 2

您需要针对不同的屏幕尺寸开发不同的XML。

要查看您的设备dpi，您可以下载this app。

要创建不同的布局，请在资源中创建一个文件夹，并将其命名为layout-sw320dp

根据您的屏幕dpi将sw320dp更改为sw600dp，sw700dp。

不同的设备会根据设备dpi自动获取准确的布局XML。

供参考检查this

我希望这些信息对您有用。

RelativeLayout中的意外边距仅显示在设备上

2 个答案: