Gmail的平板版本有一个特色的功能：

侧边菜单面板总是可见的，当关闭的时候只显示图标，当打开的时候会显示更详细的内容，并且两个内容切换的时候有个交叉渐变效果，是如何实现的呢？
我观察到主面板是在侧边面板打开的时候滑动的，因此应该不是用的NavigationDrawer，那我们试试SlidingPaneLayout如何。

package com.sqisland.android.sliding_pane_layout;
import android.content.Context;
import android.support.v4.widget.SlidingPaneLayout;
import android.util.AttributeSet;
import android.view.View;
import android.view.ViewGroup;
public class CrossFadeSlidingPaneLayout extends SlidingPaneLayout {
  private View partialView = null;
  private View fullView = null;
  public CrossFadeSlidingPaneLayout(Context context) {
    super(context);
  }
  public CrossFadeSlidingPaneLayout(Context context, AttributeSet attrs) {
    super(context, attrs);
  }
  public CrossFadeSlidingPaneLayout(Context context, AttributeSet attrs, int defStyle) {
    super(context, attrs, defStyle);
  }
  @Override
  protected void onFinishInflate() {
    super.onFinishInflate();
    if (getChildCount() < 1) {
      return;
    }
    View panel = getChildAt(0);
    if (!(panel instanceof ViewGroup)) {
      return;
    }
    ViewGroup viewGroup = (ViewGroup) panel;
    if (viewGroup.getChildCount() != 2) {
      return;
    }
    fullView = viewGroup.getChildAt(0);
    partialView = viewGroup.getChildAt(1);
    super.setPanelSlideListener(crossFadeListener);
  }
  @Override
  public void setPanelSlideListener(final PanelSlideListener listener) {
    if (listener == null) {
      super.setPanelSlideListener(crossFadeListener);
      return;
    }
    super.setPanelSlideListener(new PanelSlideListener() {
      @Override
      public void onPanelSlide(View panel, float slideOffset) {
        crossFadeListener.onPanelSlide(panel, slideOffset);
        listener.onPanelSlide(panel, slideOffset);
      }
      @Override
      public void onPanelOpened(View panel) {
        listener.onPanelOpened(panel);
      }
      @Override
      public void onPanelClosed(View panel) {
        listener.onPanelClosed(panel);
      }
    });
  }
  @Override
  protected void onLayout(boolean changed, int l, int t, int r, int b) {
    super.onLayout(changed, l, t, r, b);
    if (partialView != null) {
      partialView.setVisibility(isOpen() ? View.GONE : VISIBLE);
    }
  }
  private SimplePanelSlideListener crossFadeListener = new SimplePanelSlideListener() {
    @Override
    public void onPanelSlide(View panel, float slideOffset) {
      super.onPanelSlide(panel, slideOffset);
      if (partialView == null || fullView == null) {
        return;
      }
      partialView.setVisibility(isOpen() ? View.GONE : VISIBLE);
      partialView.setAlpha(1 - slideOffset);
      fullView.setAlpha(slideOffset);
    }
  };
}

package com.sqisland.android.sliding_pane_layout;
import android.app.ListActivity;
import android.content.Context;
import android.content.Intent;
import android.os.Bundle;
import android.view.View;
import android.widget.AdapterView;
import android.widget.ArrayAdapter;
import java.util.ArrayList;
public class MainActivity extends ListActivity {
  @Override
  protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    final ArrayList demos = new ArrayList<>();
    demos.add(new Demo(this, TwoPaneActivity.class, R.string.title_two_pane));
    demos.add(new Demo(this, PartiallyShownPaneActivity.class, R.string.title_partially_shown_pane));
    demos.add(new Demo(this, CrossFadePaneActivity.class, R.string.title_cross_fade_pane));
    ArrayAdapter adapter = new ArrayAdapter<>(
        this,
        android.R.layout.simple_list_item_1,
        demos);
    getListView().setAdapter(adapter);
    getListView().setOnItemClickListener(new AdapterView.OnItemClickListener() {
      @Override
      public void onItemClick(AdapterView adapterView, View view, int position, long id) {
        Demo demo = demos.get(position);
        startActivity(new Intent(MainActivity.this, demo.activityClass));
      }
    });
  }
  public static class Demo {
    public final Class activityClass;
    public final String title;
    public Demo(Context context, Class activityClass, int titleId) {
      this.activityClass = activityClass;
      this.title = context.getString(titleId);
    }
    @Override
    public String toString() {
      return this.title;
    }
  }
}

源码下载:sliding-pane-layout-master

本文链接:https://it72.com:4443/974.htm