RelativeLayout 中的 centerInParent 按钮包裹在 ScrollView 中

Question

我在 RelativeLayout 中有一个按钮中心，按钮下方有两个图像。当我将 RelativeLayout 包装在 ScrollView 中时，我遇到了两个问题：

按钮现在在包括可滚动部分的相关布局中居中。这不是我想要的，我想让它在我看到的屏幕部分居中而不滚动。
我在 centerInParent 按钮下方的图像不再位于该按钮下方。它就像按钮在左上角一样工作。

所以图像在顶部的白色 space 下方，就好像按钮在那里一样，按钮在我的布局中居中，但不是我想要的那样 :D

这是我的代码：

<ScrollView 
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">

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

    <Button
        android:id="@+id/button"
        android:layout_width="wrap_content"
        android:layout_height="50dp"
        android:layout_centerInParent="true"
        android:layout_marginBottom="16dp"
        android:background="#E74E4C"
        android:paddingLeft="24dp"
        android:paddingRight="24dp" />

    <ImageView
        android:id="@+id/imageone"
        android:layout_width="match_parent"
        android:layout_height="250dp"
        android:layout_below="@id/button"
        android:layout_margin="16dp"
        android:scaleType="centerCrop"
        android:src="@drawable/myimage" />

    <ImageView
        android:id="@+id/imagetwo"
        android:layout_width="match_parent"
        android:layout_height="250dp"
        android:layout_below="@id/imageone"
        android:layout_margin="16dp"
        android:scaleType="centerCrop"
        android:src="@drawable/myimagetwo" />

</RelativeLayout>

</ScrollView>

你看到哪里出了问题吗？对于信息，我打算添加一个底部导航栏。

这是我想要的和我得到的：

Answer 1

最终，我设法得到了这个，替换为你的值：

<?xml version="1.0" encoding="utf-8"?>
<ScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="fill_parent">

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="fill_parent">

    <Button
        android:id="@+id/button"
        android:layout_width="wrap_content"
        android:layout_height="50dp"
        android:background="#E74E4C"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="167dp" />


    <ImageView
        android:id="@+id/imagetwo"
        android:layout_width="match_parent"
        android:layout_height="250dp"
        android:layout_below="@id/button"
        android:layout_margin="16dp"
        android:scaleType="centerCrop"
        android:src="@mipmap/ic_launcher" />


    <ImageView
        android:id="@+id/imageone"
        android:layout_width="match_parent"
        android:layout_height="250dp"
        android:layout_below="@id/imagetwo"
        android:layout_margin="16dp"
        android:scaleType="centerCrop"
        android:src="@mipmap/ic_launcher" />

</RelativeLayout>

</ScrollView>

Answer 2

或

尝试使用 2 种布局：

<?xml version="1.0" encoding="utf-8"?>
<ScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="fill_parent">

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="fill_parent">

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="300dp"
        android:id="@+id/rl">

        <Button
            android:id="@+id/button"
            android:layout_width="wrap_content"
            android:layout_height="50dp"
            android:background="#E74E4C"
            android:layout_alignParentBottom="true"
            android:layout_centerHorizontal="true"
            android:layout_marginBottom="71dp" />
    </RelativeLayout>


    <ImageView
        android:id="@+id/imagetwo"
        android:layout_width="match_parent"
        android:layout_height="250dp"
        android:layout_below="@id/rl"
        android:layout_margin="16dp"
        android:scaleType="centerCrop"
        android:src="@mipmap/ic_launcher" />


    <ImageView
        android:id="@+id/imageone"
        android:layout_width="match_parent"
        android:layout_height="250dp"
        android:layout_below="@id/imagetwo"
        android:layout_margin="16dp"
        android:scaleType="centerCrop"
        android:src="@mipmap/ic_launcher" />





</RelativeLayout>

</ScrollView>

Answer 3

根据比率以编程方式给出 topMargin，您就完成了！如果你想调整你可以改变值，不管它在哪个屏幕显示相同的比例都会在那里。

这是我的 xml 与你的略有不同 - （更改 ID，我只是添加）

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/rel"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#000"
    android:gravity="center_horizontal">

    <ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_alignParentBottom="true"
            android:gravity="center"
            android:orientation="vertical">

            <RelativeLayout

                android:id="@+id/lin"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:orientation="vertical">

                <Button
                    android:id="@+id/button"
                    android:layout_width="wrap_content"
                    android:layout_height="50dp"
                    android:layout_alignParentBottom="true"
                    android:layout_marginBottom="16dp"
                    android:background="#E74E4C"
                    android:gravity="bottom"
                    android:paddingLeft="24dp"
                    android:paddingRight="24dp" />
            </RelativeLayout>

            <ImageView
                android:id="@+id/imageone"
                android:layout_width="match_parent"
                android:layout_height="250dp"
                android:layout_margin="16dp"
                android:background="#FFF"
                android:scaleType="centerCrop" />

            <ImageView
                android:id="@+id/imagetwo"
                android:layout_width="match_parent"
                android:layout_height="250dp"
                android:layout_margin="16dp"
                android:background="#7823"
                android:scaleType="centerCrop" />


        </LinearLayout>

    </ScrollView>

</LinearLayout>

代码

  private int screenHeight;
    private int screenWidth;
    private RelativeLayout relativeLayout;


    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.web);
        relativeLayout =(RelativeLayout)  findViewById(R.id.lin);


        Display display = getWindowManager().getDefaultDisplay();
        Point size = new Point();
        display.getSize(size);
        screenHeight = size.y;
        screenWidth = size.x;

        LinearLayout.LayoutParams relBtn = new LinearLayout.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT);
        relBtn.topMargin = ((1920/2) *screenHeight/1920); // ratio based mine height is 1920 so to get it to middle i give half height, will be same in your mobiles too , you can change 1920/2 as you like 
        relativeLayout.setLayoutParams(relBtn);


    }

与 RelativeLayout.LayoutParams

相同

xml:

<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <RelativeLayout
        android:gravity="center"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_alignParentBottom="true"
        android:orientation="vertical">

        <TextView
            android:id="@+id/tv"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerInParent="true"
            android:text="HELLO"
            android:textColor="#FFF"
            android:textSize="20dp" />

        <RelativeLayout
            android:id="@+id/lin"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:gravity="center">

            <Button
                android:id="@+id/button"
                android:layout_width="wrap_content"
                android:layout_height="50dp"

                android:layout_alignParentBottom="true"
                android:layout_marginBottom="16dp"
                android:background="@color/colorPrimaryDark"
                android:gravity="bottom"
                android:paddingLeft="24dp"
                android:paddingRight="24dp" />
        </RelativeLayout>

        <ImageView
            android:id="@+id/imageone"
            android:layout_width="match_parent"
            android:layout_height="250dp"
            android:layout_below="@+id/lin"
            android:layout_margin="16dp"
            android:background="@drawable/girl"
            android:scaleType="fitXY" />

        <ImageView
            android:id="@+id/imagetwo"
            android:layout_width="match_parent"
            android:layout_height="250dp"
            android:layout_below="@+id/imageone"
            android:layout_margin="16dp"
            android:background="@drawable/amanda"
            android:scaleType="fitXY" />


    </RelativeLayout>

</ScrollView>

代码：

private int screenHeight;
    private int screenWidth;
    private TextView textView;
    private RelativeLayout relativeLayout;


    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.web);
        relativeLayout =(RelativeLayout)  findViewById(R.id.lin);
        textView =(TextView)  findViewById(R.id.tv);


        Display display = getWindowManager().getDefaultDisplay();
        Point size = new Point();
        display.getSize(size);
        screenHeight = size.y;
        screenWidth = size.x;


        RelativeLayout.LayoutParams tv = new RelativeLayout.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT);
        tv.addRule(RelativeLayout.CENTER_HORIZONTAL);
        tv.topMargin = ((100)*screenHeight/1920); // ratio based mine height is 1920 so to get it to middle i give half height, will be same in your mobiles too , you can change 1920/2 as you like
        textView.setLayoutParams(tv);

        RelativeLayout.LayoutParams relBtn = new RelativeLayout.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT);
        relBtn.addRule(RelativeLayout.CENTER_HORIZONTAL);
        relBtn.topMargin = ((1920/2 - 100 ) *screenHeight/1920); // ratio based mine height is 1920 so to get it to middle i give half height, will be same in your mobiles too , you can change 1920/2 as you like

        relativeLayout.setLayoutParams(relBtn);




    }

输出：

RelativeLayout 中的 centerInParent 按钮包裹在 ScrollView 中

centerInParent button in a RelativeLayout wrapped in a ScrollView

android

android-layout

android-scrollview

android-relativelayout