如何在 SlidingDrawer 扩展时移动 LinearLayout？

Question

我正在尝试在片段中实现一个面板，该面板可以在单击屏幕右侧的按钮时展开。我不能使用导航抽屉，因为我已经有左右两侧的导航抽屉了。

这个想法是为了实现这样的目标：

我几乎可以使用 SlidingDrawer 小部件（已弃用..），唯一的问题是我不知道如何让 LinearLayout 出现在中间然后再单击 SlidingDrawer 展开按钮时移动。

我有以下代码：

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        Button handle = (Button) findViewById(R.id.handle);
        SlidingDrawer drawer = (SlidingDrawer) findViewById(R.id.slidingDrawer);

        drawer.setOnDrawerOpenListener(new SlidingDrawer.OnDrawerOpenListener() {
            @Override
            public void onDrawerOpened() {
            }
        });

        drawer.setOnDrawerCloseListener(new SlidingDrawer.OnDrawerCloseListener() {
            @Override
            public void onDrawerClosed() {
            }
        });
    }
}

和 XML 代码：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.test.slidingdrawertest.slidingdrawertest.MainActivity">

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

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="TEST TEST TEST" />

    </LinearLayout>

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


        <SlidingDrawer
            android:id="@+id/slidingDrawer"
            android:layout_width="200dp"
            android:layout_height="400dp"
            android:layout_marginTop="100dp"
            android:layout_gravity="end"
            android:content="@+id/content"
            android:handle="@+id/handle"
            android:orientation="horizontal">

            <Button
                android:id="@+id/handle"
                style="?android:attr/borderlessButtonStyle"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Expand" />

            <LinearLayout
                android:id="@+id/content"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:orientation="vertical">

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="TEST TEST TEST" />

            </LinearLayout>

        </SlidingDrawer>

    </LinearLayout>

</RelativeLayout>

Answer 1

您可以像这样编辑您的 XML

?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:padding="10dp"
    tools:context="com.test.slidingdrawertest.slidingdrawertest.MainActivity">

    <LinearLayout
      android:id="@+id/left"                // this is your linear layout 
      android:layout_width="match_parent"   // that you want to shift left
      android:layout_height="match_parent"
      android:layout_toLeftOf="@+id/right"  // apply this property due to 
     android:layout_alignParentLeft="true"  //which if the width of sliding menu 
      android:gravity="center"             //increase it will automatically compressed
      android:background="#aa00aa"


        android:orientation="vertical">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="TEST TEST TEST" />

    </LinearLayout>

    <LinearLayout
        android:id="@+id/right"
        android:layout_alignParentRight="true"
        android:layout_width="wrap_content"
        android:background="#0000aa"
        android:layout_height="match_parent">


        <SlidingDrawer
            android:id="@+id/slidingDrawer"
            android:layout_width="200dp"          // you can check by increasing or decreasing the with of this slidingdrawer
            android:layout_height="400dp"
            android:layout_marginTop="100dp"
            android:layout_gravity="end"
            android:content="@+id/content"
            android:handle="@+id/handle"
            android:orientation="horizontal">

            <Button
                android:id="@+id/handle"
                style="?android:attr/borderlessButtonStyle"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Expand" />

            <LinearLayout
                android:id="@+id/content"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:orientation="vertical">

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="TEST TEST TEST" />

            </LinearLayout>

        </SlidingDrawer>

    </LinearLayout>

</RelativeLayout>

除此之外，如果将任何布局设置到线性布局的右侧，最初是 GONE 并且当您单击按钮时，它的可见性变为 INVISIBLE/VISIBLE 因此它将移动线性布局向左。希望对您有所帮助！

Answer 2

如果你想要一个小例子，这是我的解决方案：（我不知道 Avani Nagar 的解决方案是否有效）：

TextView res;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);

    setContentView(R.layout.activity_main);

    final TextView img = (TextView)findViewById(R.id.second);
    res = (TextView)findViewById(R.id.first);

    img.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            img.setX(img.getX() - 5);
            changew(img.getX());
        }
    });
}

private void changew(float w){
    res.getLayoutParams().width = (int)(res.getX() +w);
    res.requestLayout();
    res.invalidate();
}

xml:

<?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"
android:background="@android:color/black">

<TextView
    android:layout_toRightOf="@+id/first"
    android:text="bonjourrrrrr"
    android:id="@+id/second"
    android:layout_width="wrap_content"
    android:layout_height="100dp"
    android:background="@android:color/holo_red_dark" />

<TextView
    android:text="salutttttttt"
    android:id="@id/first"
    android:layout_width="wrap_content"
    android:layout_height="100dp"
    android:background="@android:color/holo_green_light" />


</RelativeLayout>

Answer 3

我做到了，其实并没有那么难，只是有点棘手。这是解决方案：

xml代码：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:id="@+id/topLayout"
    tools:context="com.test.slidingdrawertest.slidingdrawertest.MainActivity">

    <LinearLayout
        android:id="@+id/mainLayout"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:orientation="vertical">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="TEST" />
    </LinearLayout>

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

        <SlidingDrawer
            android:id="@+id/slidingDrawer"
            android:layout_width="200dp"
            android:layout_height="400dp"
            android:layout_marginTop="100dp"
            android:layout_gravity="end"
            android:content="@+id/content"
            android:handle="@+id/handle"
            android:orientation="horizontal">

            <Button
                android:id="@+id/handle"
                style="?android:attr/borderlessButtonStyle"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Expand" />

            <LinearLayout
                android:id="@+id/content"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:orientation="vertical">

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="TEST TEST TESTT" />

            </LinearLayout>
        </SlidingDrawer>
    </LinearLayout>
</RelativeLayout>

MainActivity.java中的代码：

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        Button handle = (Button) findViewById(R.id.handle);
        SlidingDrawer drawer = (SlidingDrawer) findViewById(R.id.slidingDrawer);
        final View k = findViewById(R.id.mainLayout);

        drawer.setOnDrawerOpenListener(new SlidingDrawer.OnDrawerOpenListener() {
            @Override
            public void onDrawerOpened() {
                RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT,
                        RelativeLayout.LayoutParams.WRAP_CONTENT);
                params.addRule(RelativeLayout.ALIGN_PARENT_TOP);
                k.setLayoutParams(params);
            }
        });

        drawer.setOnDrawerCloseListener(new SlidingDrawer.OnDrawerCloseListener() {
            @Override
            public void onDrawerClosed() {
                RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT,
                        RelativeLayout.LayoutParams.WRAP_CONTENT);
                params.addRule(RelativeLayout.ALIGN_PARENT_BOTTOM);
                k.setLayoutParams(params);
            }
        });
    }
}

以及解释：我必须给主要的主要布局一个id（在XML中）然后在后面的代码中找到它，然后我必须在抽屉打开或关闭时向它应用新参数.基本上，我们需要找到父布局并为其设置参数。

现在 LinearLayout 可以在抽屉打开时改变它的位置，并在抽屉关闭时回到原来的位置。下一步是用动画制作这个过程，这样它就很流畅，而不只是来回跳到新的位置。

如何在 SlidingDrawer 扩展时移动 LinearLayout？

How to shift a LinearLayout when a SlidingDrawer expands?

android

slidingdrawer

android-layout

android-linearlayout