Android SlidingMenu 仿网易新闻客户端布局

前面两篇文章中的SlidingMenu都出现在左侧，今天来模仿一下网易新闻客户端左右两边都有SlidingMenu的效果，以下是网易新闻客户端效果：

不扯闲话了，直接进入正题吧

frame_content.xml

<?xml version="1.0" encoding="utf-8"?>

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"

android:id="@+id/content"

android:layout_width="match_parent"

android:layout_height="match_parent" />

frame_left_menu.xml

android:id="@+id/left_menu"

frame_right_menu.xml

android:id="@+id/right_menu"

在主Activity 初始化 SlidingMenu

package com.example.slidingmenuwangyi;

import android.annotation.SuppressLint;

import android.os.Bundle;

import android.support.v4.app.Fragment;

import android.support.v4.app.FragmentManager;

import android.support.v4.app.FragmentTransaction;

import android.util.Log;

import android.view.Menu;

import android.view.MenuItem;

import android.widget.Toast;

import com.example.slidingmenuwangyi.fragment.CommunityFragment;

import com.example.slidingmenuwangyi.fragment.FindPeopleFragment;

import com.example.slidingmenuwangyi.fragment.HomeFragment;

import com.example.slidingmenuwangyi.fragment.MenuFragment;

import com.example.slidingmenuwangyi.fragment.MenuFragment.SLMenuListOnItemClickListener;

import com.example.slidingmenuwangyi.fragment.PagesFragment;

import com.example.slidingmenuwangyi.fragment.PhotosFragment;

import com.example.slidingmenuwangyi.fragment.RightMenuFragment;

import com.example.slidingmenuwangyi.fragment.WhatsHotFragment;

import com.jeremyfeinstein.slidingmenu.lib.SlidingMenu;

import com.jeremyfeinstein.slidingmenu.lib.app.SlidingFragmentActivity;

public class MainActivity extends SlidingFragmentActivity implements SLMenuListOnItemClickListener{

private SlidingMenu mSlidingMenu;

@SuppressLint("NewApi")

@Override

public void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setTitle("Home");

// setTitle(R.string.sliding_title);

setContentView(R.layout.frame_content);

//set the Behind View

setBehindContentView(R.layout.frame_left_menu);

// customize the SlidingMenu

mSlidingMenu = getSlidingMenu();

mSlidingMenu.setMode(SlidingMenu.LEFT_RIGHT);//设置左右都可以划出SlidingMenu菜单

mSlidingMenu.setSecondaryMenu(R.layout.frame_right_menu); //设置右侧菜单的布局文件

mSlidingMenu.setSecondaryShadowDrawable(R.drawable.drawer_shadow);

// mSlidingMenu.setShadowWidth(5);

// mSlidingMenu.setBehindOffset(100);

mSlidingMenu.setShadowDrawable(R.drawable.drawer_shadow);//设置阴影图片

mSlidingMenu.setShadowWidthRes(R.dimen.shadow_width); //设置阴影图片的宽度

mSlidingMenu.setBehindOffsetRes(R.dimen.slidingmenu_offset); //SlidingMenu划出时主页面显示的剩余宽度

mSlidingMenu.setFadeDegree(0.35f);

//设置SlidingMenu 的手势模式

//TOUCHMODE_FULLSCREEN 全屏模式，在整个content页面中，滑动，可以打开SlidingMenu

//TOUCHMODE_MARGIN 边缘模式，在content页面中，如果想打开SlidingMenu,你需要在屏幕边缘滑动才可以打开SlidingMenu

//TOUCHMODE_NONE 不能通过手势打开SlidingMenu

mSlidingMenu.setTouchModeAbove(SlidingMenu.TOUCHMODE_MARGIN);

//设置 SlidingMenu 内容

FragmentTransaction fragmentTransaction = getSupportFragmentManager().beginTransaction();

fragmentTransaction.replace(R.id.left_menu, new MenuFragment());

fragmentTransaction.replace(R.id.right_menu, new RightMenuFragment());

fragmentTransaction.replace(R.id.content, new HomeFragment());

fragmentTransaction.commit();

//使用左上方icon可点，这样在onOptionsItemSelected里面才可以监听到R.id.home

getActionBar().setDisplayHomeAsUpEnabled(true);

// getActionBar().setLogo(R.drawable.ic_logo);

}

public boolean onCreateOptionsMenu(Menu menu) {

// Inflate the menu; this adds items to the action bar if it is present.

getMenuInflater().inflate(R.menu.main, menu);

return true;

public boolean onOptionsItemSelected(MenuItem item) {

switch (item.getItemId()) {

case android.R.id.home:

toggle(); //动态判断自动关闭或开启SlidingMenu

// getSlidingMenu().showMenu();//显示SlidingMenu

// getSlidingMenu().showContent();//显示内容

return true;

case R.id.action_refresh:

Toast.makeText(getApplicationContext(), R.string.refresh, Toast.LENGTH_SHORT).show();

case R.id.action_person:

if(mSlidingMenu.isSecondaryMenuShowing()){

mSlidingMenu.showContent();

}else{

mSlidingMenu.showSecondaryMenu();

}

default:

return super.onOptionsItemSelected(item);

}

public void selectItem(int position, String title) {

// update the main content by replacing fragments

Fragment fragment = null;

switch (position) {

case 0:

fragment = new HomeFragment();

break;

case 1:

fragment = new FindPeopleFragment();

case 2:

fragment = new PhotosFragment();

case 3:

fragment = new CommunityFragment();

case 4:

fragment = new PagesFragment();

case 5:

fragment = new WhatsHotFragment();

default:

}

if (fragment != null) {

FragmentManager fragmentManager = getSupportFragmentManager();

fragmentManager.beginTransaction()

.replace(R.id.content, fragment).commit();

// update selected item and title, then close the drawer

setTitle(title);

mSlidingMenu.showContent();

} else {

// error in creating fragment

Log.e("MainActivity", "Error in creating fragment");

}

左边SlidingMenu Fragment

package com.example.slidingmenuwangyi.fragment;

import java.util.ArrayList;

import android.app.Activity;

import android.content.res.TypedArray;

import android.view.LayoutInflater;

import android.view.View;

import android.view.ViewGroup;

import android.widget.AdapterView;

import android.widget.AdapterView.OnItemClickListener;

import android.widget.ListView;

import com.example.slidingmenuwangyi.R;

import com.example.slidingmenuwangyi.adapter.NavDrawerListAdapter;

import com.example.slidingmenuwangyi.entity.NavDrawerItem;

public class MenuFragment extends Fragment implements OnItemClickListener {

private ListView mDrawerList;

private String[] mNavMenuTitles;

private TypedArray mNavMenuIconsTypeArray;

private ArrayList<NavDrawerItem> mNavDrawerItems;

private NavDrawerListAdapter mAdapter;

private SLMenuListOnItemClickListener mCallback;

private int selected = -1;

public void onAttach(Activity activity) {

try {

mCallback = (SLMenuListOnItemClickListener) activity;

} catch (ClassCastException e) {

throw new ClassCastException(activity.toString()

+ " must implement OnResolveTelsCompletedListener");

super.onAttach(activity);

// TODO Auto-generated method stub

public View onCreateView(LayoutInflater inflater, ViewGroup container,

Bundle savedInstanceState) {

View rootView = inflater.inflate(R.layout.fragment_menu, null);

findView(rootView);

return rootView;

private void findView(View rootView) {

mDrawerList = (ListView) rootView.findViewById(R.id.left_menu);

mNavMenuTitles = getResources().getStringArray(R.array.nav_drawer_items);

// nav drawer icons from resources

mNavMenuIconsTypeArray = getResources()

.obtainTypedArray(R.array.nav_drawer_icons);

mNavDrawerItems = new ArrayList<NavDrawerItem>();

// adding nav drawer items to array

// Home

mNavDrawerItems.add(new NavDrawerItem(mNavMenuTitles[0], mNavMenuIconsTypeArray

.getResourceId(0, -1)));

// Find People

mNavDrawerItems.add(new NavDrawerItem(mNavMenuTitles[1], mNavMenuIconsTypeArray

.getResourceId(1, -1)));

// Photos

mNavDrawerItems.add(new NavDrawerItem(mNavMenuTitles[2], mNavMenuIconsTypeArray

.getResourceId(2, -1)));

// Communities, Will add a counter here

mNavDrawerItems.add(new NavDrawerItem(mNavMenuTitles[3], mNavMenuIconsTypeArray

.getResourceId(3, -1), true, "22"));

// Pages

mNavDrawerItems.add(new NavDrawerItem(mNavMenuTitles[4], mNavMenuIconsTypeArray

.getResourceId(4, -1)));

// What's hot, We will add a counter here

mNavDrawerItems.add(new NavDrawerItem(mNavMenuTitles[5], mNavMenuIconsTypeArray

.getResourceId(5, -1), true, "50+"));

// Recycle the typed array

mNavMenuIconsTypeArray.recycle();

// setting the nav drawer list adapter

mAdapter = new NavDrawerListAdapter(getActivity(),

mNavDrawerItems);

mDrawerList.setAdapter(mAdapter);

mDrawerList.setOnItemClickListener(this);

if(selected!=-1){

mDrawerList.setItemChecked(selected, true);

mDrawerList.setSelection(selected);

}else{

mDrawerList.setItemChecked(0, true);

mDrawerList.setSelection(0);

public void onItemClick(AdapterView<?> parent, View view, int position,

long id) {

// update selected item and title, then close the drawer

mDrawerList.setItemChecked(position, true);

mDrawerList.setSelection(position);

if(mCallback!=null){

mCallback.selectItem(position, mNavMenuTitles[position]);

selected = position;

/**

* 左侧菜单点击回调接口

* @author FX_SKY

public interface SLMenuListOnItemClickListener{

public void selectItem(int position,String title);

MenuFragment 布局文件fragment_menu.xml

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"

android:layout_height="match_parent" >

<ListView

android:id="@+id/left_menu"

android:layout_width="match_parent"

android:layout_height="match_parent"

android:layout_gravity="start"

android:choiceMode="singleChoice"

android:divider="@android:color/transparent"

android:dividerHeight="0dp"

android:background="#111"/>

</RelativeLayout>

右边SlidingMenu Fragment

public class RightMenuFragment extends Fragment{

View rootView = inflater.inflate(R.layout.fragment_right_menu, null);

RightMenuFragment 布局文件 fragment_right_menu.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

android:layout_height="match_parent"

android:orientation="vertical"

android:background="#464646">

<RelativeLayout

android:layout_width="fill_parent"

android:layout_height="70dip">

<ImageView

android:id="@+id/right_permsg_center_img_usericon"

android:layout_width="60dip"

android:layout_height="60dip"

android:layout_marginLeft="5dip"

android:layout_marginTop="5dip"

android:layout_marginBottom="5dip"

android:src="@drawable/night_biz_pc_account_avatar_bg"

android:scaleType="fitXY"/>

<TextView

android:id="@+id/right_permsg_center_tv_name"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:text="AABBV"

android:layout_toRightOf="@id/right_permsg_center_img_usericon"

android:layout_marginLeft="10dip"

android:textColor="@color/whilte"

android:textSize="15sp"

android:layout_marginTop="13dip"/>

android:id="@+id/right_permsg_center_img_icon"

android:layout_width="15dip"

android:layout_height="15dip"

android:scaleType="fitXY"

android:layout_below="@id/right_permsg_center_tv_name"

android:src="@drawable/biz_pc_main_money_icon"

android:layout_alignLeft="@id/right_permsg_center_tv_name"/>

android:id="@+id/right_permsg_center_tv_level"

android:layout_toRightOf="@id/right_permsg_center_img_icon"

android:text="科长"

android:textSize="10sp"

android:layout_alignBaseline="@id/right_permsg_center_img_icon"

android:layout_marginTop="2dip"/>

<ImageButton

android:id="@+id/right_permsg_center_imgbtn_select"

android:layout_width="30dip"

android:layout_height="30dip"

android:layout_alignParentRight="true"

android:layout_marginRight="10dip"

android:background="@drawable/app_recommend_arrow"

android:layout_centerVertical="true"/>

</RelativeLayout>

<LinearLayout

android:layout_height="wrap_content"

android:orientation="horizontal">

<Button

android:id="@+id/right_permsg_center_btn_thread"

android:text="我的跟帖"

android:drawableTop="@drawable/biz_pc_go_tie"

android:background="#00000000"

android:layout_weight="1"

android:id="@+id/right_permsg_center_btn_collect"

android:text="我的收藏"

android:drawableTop="@drawable/biz_pc_go_favor"

android:id="@+id/right_permsg_center_btn_msgpush"

android:text="消息推送"

android:drawableTop="@drawable/biz_pc_go_msg"

</LinearLayout>

主Fragment HomeFragment

import java.util.List;

import android.support.v4.view.PagerTabStrip;

import android.support.v4.view.ViewPager;

import com.example.slidingmenuwangyi.adapter.ContentFragmentPagerAdapter;

import com.example.slidingmenuwangyi.entity.ContentBean;

public class HomeFragment extends Fragment {

private ViewPager mViewPager;

private static final String[] titles = {"One","Two","Three","Four","Five"};

private List<ContentBean> list = new ArrayList<ContentBean>();

private ContentFragmentPagerAdapter mAdapter;

public HomeFragment(){}

View rootView = inflater.inflate(R.layout.fragment_home, container, false);

initData();

private void initData() {

for(int i=0;i<titles.length;i++){

ContentBean cb = new ContentBean();

cb.setTitle(titles[i]);

cb.setContent(titles[i]+"_"+(i+1));

list.add(cb);

mViewPager = (ViewPager) rootView.findViewById(R.id.mViewPager);

PagerTabStrip mPagerTabStrip = (PagerTabStrip) rootView.findViewById(R.id.mPagerTabStrip);

mPagerTabStrip.setTabIndicatorColor(getResources().getColor(R.color.select_text_color));

mAdapter = new ContentFragmentPagerAdapter(getActivity().getSupportFragmentManager(),list);

mViewPager.setAdapter(mAdapter);

public void onStart() {

if(mAdapter!=null){

mAdapter.notifyDataSetChanged();

super.onStart();

HomeFragment 布局文件 fragment_home.xml

<android.support.v4.view.ViewPager

android:id="@+id/mViewPager"

android:layout_width="match_parent"

android:layout_height="wrap_content" >

<android.support.v4.view.PagerTabStrip

android:id="@+id/mPagerTabStrip"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_gravity="top"/>

<!-- <android.support.v4.view.PagerTitleStrip

android:id="@+id/mPagerTitleStrip"

android:layout_width="match_parent"

android:layout_gravity="top" /> -->

</android.support.v4.view.ViewPager>

别的就不贴了，自己下载下来看吧

运行效果如下

其它干货下载资源已放入微信公众号【一个码农的日常】

本文转自欢醉博客园博客，原文链接http://www.cnblogs.com/zhangs1986/p/3654638.html如需转载请自行联系原作者

欢醉

Android SlidingMenu 仿网易新闻客户端布局

继续阅读

Java小案例——随机数猜测随机数猜测

nginx location中斜线的位置的重要性

Android电视机（机顶盒）初次开发的一些经验分享

27 Best Free Eclipse Plug-ins for Java Developer to be ProductiveCode Quality PluginsText Editor PluginsDependency ManagementVersion Control Integration PluginsFramework Development Continuous Integration Related PluginsOther Utility Plugins

Java String.format方法的简单使用

neo4j之cypher使用文档

GitHub连夜封杀！这份阿里 10W 字内部 Java 字面试手册到底有多强？

spark/scala关于【资源文件】加载方法概述外部文件加载方案测试资源文件打包入jar包中小结

mybatis_入门程序Mybatis入门

AOP编程_Android优雅权限框架(1)概念基础，2021金三银四前言正文大纲正文

Effective Java 8:通用程序设计

OOM三种类型

工厂模式-三种类型

【递归】高效率求2的n次幂

win10本地scala和spark安装安装scala安装spark

scala (3) Function 和 Method