Android SlidingPaneLayout 实现新版 QQ 侧滑效果

最新推荐文章于 2023-07-29 21:42:31 发布

原创最新推荐文章于 2023-07-29 21:42:31 发布 · 333 阅读

CC 4.0 BY-SA版权

本文深入探讨了如何在Android中使用Sliding Pane Layout组件，并详细阐述了其核心代码实现过程，包括背景设置、侧滑效果以及与Fragment的集成。通过实例解析，展示了如何利用该布局实现动态菜单与主内容区域的切换。

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

        <ImageView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:scaleType="fitXY"
            android:src="@drawable/bg" />
    </LinearLayout>

    <android.support.v4.widget.SlidingPaneLayout
        android:id="@+id/slidingPane"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@android:color/transparent">

        <FrameLayout
            android:id="@+id/layout_menu"
            android:layout_width="250dp"
            android:layout_height="match_parent" />

        <FrameLayout
            android:id="@+id/layout_content"
            android:layout_width="match_parent"
            android:layout_height="match_parent" />

    </android.support.v4.widget.SlidingPaneLayout>
</FrameLayout>

首先重点是布局咯
FrameLayout 里面嵌套了两个布局
第一个是 LinearLayout 里面放了个 ImageView
这个布局的作用就是背景,用放 ImageView 就是为了可以设置缩放

第二个布局就是主角 SlidingPaneLayout 咯
里面放两个布局了这个侧滑就可以用了
这里用 FrameLayout 是为了可以用 Fragment
核心代码

        @Override
        public void onPanelSlide(View panel, float slideOffset) {
            int contentMargin = (int) (slideOffset * maxMargin);
            FrameLayout.LayoutParams contentParams = contentFragment
                    .getCurrentViewParams();

            contentParams.setMargins(0, contentMargin, 0, contentMargin);
            contentFragment.setCurrentViewPararms(contentParams);

            float scale = 1 - ((1 - slideOffset) * maxMargin * 2)
                    / (float) displayMetrics.heightPixels;
            menuFragment.getCurrentView().setScaleX(scale);// 设置缩放的基准点
            menuFragment.getCurrentView().setScaleY(scale);// 设置缩放的基准点
            menuFragment.getCurrentView().setPivotX(0);// 设置缩放和选择的点
            menuFragment.getCurrentView().setPivotY(
                    displayMetrics.heightPixels / 2);
            menuFragment.getCurrentView().setAlpha(slideOffset);
        }