1 开始使用
compile 'com.android.support:support-v4:25.3.1'
- android:layout_width="100dp" 展开状态
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.SlidingPaneLayout 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:id="@+id/id_spl"
android:layout_height="match_parent"
tools:context="com.classichu.slidingpanelayoutdemo.MainActivity">
<TextView
android:layout_width="100dp"
android:layout_height="match_parent"
android:text="left"
android:background="@color/colorAccent"
/>
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="right"
/>
</android.support.v4.widget.SlidingPaneLayout>
android:layout_width="100dp" 展开状态
android:layout_width="match_parent" 展开状态
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.SlidingPaneLayout 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:id="@+id/id_spl"
android:layout_height="match_parent"
tools:context="com.classichu.slidingpanelayoutdemo.MainActivity">
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="left"
android:background="@color/colorAccent"
/>
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="right"
/>
</android.support.v4.widget.SlidingPaneLayout>
android:layout_width="match_parent" 展开状态
因为SlidingPaneLayout的属性mOverhangSize的值是32,就是左菜单离右边屏幕边缘的距离
2 常规侧滑
- 设置一个整体背景 在SlidingPaneLayout 上
- 针对标题栏可以自行修改相关逻辑
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.SlidingPaneLayout 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:id="@+id/id_spl"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#70c235"
tools:context="com.classichu.slidingpanelayoutdemo.MainActivity">
<LinearLayout
android:id="@+id/id_ll"
android:layout_width="200dp"
android:layout_height="match_parent"
android:orientation="vertical"
android:text="Hello World!">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="10dp"
android:text="1111111" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="10dp"
android:text="22222222" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="10dp"
android:text="3333333333" />
</LinearLayout>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/colorPrimaryDark">
<TextView
android:id="@+id/id_tv"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="click" />
</FrameLayout>
</android.support.v4.widget.SlidingPaneLayout>
- 去掉SlidingPaneLayout 侧滑渐变色
SlidingPaneLayout id_spl = (SlidingPaneLayout) findViewById(R.id.id_spl);
id_spl.setSliderFadeColor(Color.TRANSPARENT);//设置面板的侧滑渐变色
1.png
3 类似QQ5.x侧滑
- 针对2区别就是 新增一个PanelSlideListener 处理侧滑时候的各个view
- 针对标题栏可以自行修改相关逻辑
SlidingPaneLayout id_spl = (SlidingPaneLayout) findViewById(R.id.id_spl);
id_spl.setSliderFadeColor(Color.TRANSPARENT);//设置面板的侧滑渐变色
final View leftView = id_spl.getChildAt(0);
id_spl.setPanelSlideListener(new SlidingPaneLayout.PanelSlideListener() {
@Override
public void onPanelSlide(View panel, float slideOffset) {
//
leftView.setPivotX(-leftView.getWidth() / 5.0f);
leftView.setPivotY(leftView.getHeight() / 2.0f);
leftView.setScaleX(0.8f + 0.2f * slideOffset);//0.8~1
leftView.setScaleY(0.8f + 0.2f * slideOffset);//0.8~1
leftView.setAlpha(0.8f + 0.2f * slideOffset);//0.8~1
//
panel.setScaleX(1 - 0.2f * slideOffset);//1~0.8
panel.setScaleY(1 - 0.2f * slideOffset);//1~0.8
panel.setAlpha(1 - 0.2f * slideOffset);//1~0.8
}
@Override
public void onPanelOpened(View panel) {
}
@Override
public void onPanelClosed(View panel) {
}
});
2.png
4 类似QQ6.x侧滑
- 针对 3 区别就是修改监听处理view的逻辑
- 针对标题栏可以自行修改相关逻辑
@Override
public void onPanelSlide(View panel, float slideOffset) {
leftView.setTranslationX((slideOffset - 1) * leftView.getWidth()); //-w~0
panel.setAlpha(1 - 0.2f * slideOffset);//1~0.8
}
3.png
5 侧滑结束Aty
-
代码动态生成SlidingPaneLayout
-
利用反射去掉边缘距离
-
设置Main2Aty背景透明主题AppThemeTransparent
<style name="AppThemeTransparent" parent="AppTheme">
<item name="android:windowBackground">@android:color/transparent</item>
<item name="android:windowIsTranslucent">true</item>
</style>
public class Main2Activity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main2);
//创建SlidingPaneLayout
SlidingPaneLayout mSlidingPaneLayout = new SlidingPaneLayout(this);
try {
//mOverhangSize属性,就是左菜单离右边屏幕边缘的距离
Field mOverhangSize = SlidingPaneLayout.class.getDeclaredField("mOverhangSize");
mOverhangSize.setAccessible(true);
//设置左菜单离右边屏幕边缘的距离为0,设置全屏
mOverhangSize.set(mSlidingPaneLayout, 0);
} catch (NoSuchFieldException e) {
e.printStackTrace();
} catch (IllegalAccessException e) {
e.printStackTrace();
}
mSlidingPaneLayout.setSliderFadeColor(Color.TRANSPARENT);//设置面板的侧滑渐变色
mSlidingPaneLayout.setPanelSlideListener(new SlidingPaneLayout.PanelSlideListener() {
@Override
public void onPanelSlide(View panel, float slideOffset) {
}
@Override
public void onPanelOpened(View panel) {
//菜单打开后,我们结束掉这个Activity
finish();
overridePendingTransition(0, 0);
}
@Override
public void onPanelClosed(View panel) {
}
});
//创建左侧视图
View leftView = new View(this);
//设置全屏
leftView.setLayoutParams(new ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT,
ViewGroup.LayoutParams.MATCH_PARENT));
//添加到SlidingPaneLayout中
mSlidingPaneLayout.addView(leftView, 0);
// 得到右侧的内容视图
ViewGroup decorView = (ViewGroup) getWindow().getDecorView();//decorView 是一个Fragment
ViewGroup childView = (ViewGroup) decorView.getChildAt(0);//decorView子view只有一个 是一个LinearLayout
ViewGroup contentView = (ViewGroup) decorView.findViewById(android.R.id.content);//是一个Fragment 包裹xml布局
View contentViewRootLayout = contentView.getChildAt(0);//是xml里面定义的根布局
//先移除contentView
decorView.removeView(childView);
// 添加 mSlidingPaneLayout
decorView.addView(mSlidingPaneLayout);
// childView.setBackgroundColor(Color.TRANSPARENT);
// 为 mSlidingPaneLayout 添加childView
mSlidingPaneLayout.addView(childView, 1);
}
}
网友评论