【框架】侧拉菜单

1.SlidingPaneLayout
2.DrawerLayout
3.NavigationView
4.SlidingMenu

1.SlidingPaneLayout
布局v4包下,先左侧拉(只有左侧拉),后主页,布局的位置决定前面的是左侧拉
通过slidingPaneLayout.closePane();关闭侧拉
2.DrawerLayout
布局v4包下,先主页,后左侧拉或右侧拉(顺序不能变否则点击事件失效)
通过drawerLayout.closeDrawer(Gravity.LEFT/Gravity.RIGHT);关闭侧拉
3.NavigationView
布局v4包下DrawerLayout,先主页面,后左或右侧拉(引进design包下的NavigationView)
NavigationView可以关联headerLayout和menu
navigationView设置监听,可以响应menu的点击事件
通过drawerLayout.closeDrawer(Gravity.LEFT/Gravity.RIGHT);关闭侧拉
4.SlidingMenu

需要导入第三方控件(不推荐使用)
通过slidingMenu.setMode(SlidingMenu.LEFT_RIGHT);设置两边都可以滑动
slidingMenu.setMenu(R.layout.left_layout);设置左边布局
slidingMenu.setSecondaryMenu(R.layout.right_layout);设置右边布局

 

第一种:SlidingPaneLayout

布局v4包下,先左侧拉(只有左侧拉),后主页
通过slidingPaneLayout.closePane();关闭侧拉

<android.support.v4.widget.SlidingPaneLayout
    android:id="@+id/sliding_pane_layout"
    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="org.mobiletrain.a7_2slidingpanelayout.MainActivity">
    
    <LinearLayout
        android:id="@+id/left_layout"
        android:layout_width="200dp"
        android:layout_height="match_parent"
        android:background="#f90101"
        android:gravity="center"
        android:orientation="vertical">

        <ListView
            android:id="@+id/lv"
            android:layout_width="match_parent"
            android:layout_height="match_parent">

    

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#08f504"
        android:orientation="vertical">

        <android.support.v7.widget.Toolbar
            android:id="@+id/tool_bar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:background="@color/colorPrimary">

        <Button
            android:id="@+id/toggle"
            android:layout_width="wrap_content"
            android:onClick="toggle"
            android:layout_height="wrap_content"/>

        <TextView
            android:id="@+id/tv"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="主页面"/>
    
public class MainActivity extends AppCompatActivity {

    private List list;
    private SlidingPaneLayout slidingPaneLayout;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        Toolbar toolbar = (Toolbar) findViewById(R.id.tool_bar);
        setSupportActionBar(toolbar);
        ListView listView = (ListView) findViewById(R.id.lv);
        final TextView textView = (TextView) findViewById(R.id.tv);
        LinearLayout leftLayout = (LinearLayout) findViewById(R.id.left_layout);
        ViewGroup.LayoutParams layoutParams = leftLayout.getLayoutParams();
        //将100px转为100dp
        layoutParams.width = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 100, getResources().getDisplayMetrics());
        leftLayout.setLayoutParams(layoutParams);
        slidingPaneLayout = (SlidingPaneLayout) findViewById(R.id.sliding_pane_layout);
        initData();
        ArrayAdapter adapter = new ArrayAdapter(this, android.R.layout.simple_list_item_1, list);
        listView.setAdapter(adapter);
        listView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView parent, View view, int position, long id) {
                textView.setText(list.get(position));
                //关闭侧拉菜单
                slidingPaneLayout.closePane();
            }
        });
    }

    //点击后退按钮
    @Override
    public void onBackPressed() {
        //如果侧拉菜单打开,则点击后退按钮时关闭侧拉菜单,否则直接退出应用
        if (slidingPaneLayout.isOpen()) {
            slidingPaneLayout.closePane();
        } else {
            super.onBackPressed();
        }
    }

    private void initData() {
        list = new ArrayList<>();
        list.add("收藏");
        list.add("钱包");
        list.add("相册");
        list.add("文件");
    }

    public void toggle(View view) {
        //点击按钮时,如果侧拉菜单已经打开,则关闭,否则打开侧拉菜单
        if (slidingPaneLayout.isOpen()) {
            slidingPaneLayout.closePane();
        } else {
            slidingPaneLayout.openPane();
        }
    }
}

 第二种:DrawerLayout

布局v4包下,先主页,后左侧拉或右侧拉(顺序不能变否则点击事件失效)
通过drawerLayout.closeDrawer(Gravity.LEFT/Gravity.RIGHT);关闭侧拉

<android.support.v4.widget.DrawerLayout
    android:id="@+id/drawer_layout"
    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="org.mobiletrain.a7_2drawerlayout.MainActivity">
    
    <RelativeLayout
        android:id="@+id/main_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:onClick="leftToggle"
            android:text="leftToggle"/>

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentRight="true"
            android:onClick="rightToggle"
            android:text="@string/righttoggle"/>

        <TextView
            android:id="@+id/tv"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="主页面"/>

    

    <LinearLayout
        android:id="@+id/left_layout"
        android:layout_width="200dp"
        android:layout_height="match_parent"
        android:layout_gravity="left"
        android:background="#00fa08"
        android:orientation="vertical">

        <ListView
            android:id="@+id/lv"
            android:layout_width="match_parent"
            android:layout_height="match_parent">
    

    <LinearLayout
        android:id="@+id/right_layout"
        android:layout_width="200dp"
        android:layout_height="match_parent"
        android:layout_gravity="right"
        android:background="#fa0212"
        android:orientation="vertical">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="right"/>
    
public class MainActivity extends AppCompatActivity {

    private DrawerLayout drawerLayout;
    private List list;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        drawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);
        ListView listView = (ListView) findViewById(R.id.lv);
        final TextView textView = (TextView) findViewById(R.id.tv);
        initData();
        ArrayAdapter adapter = new ArrayAdapter(this, android.R.layout.simple_list_item_1, list);
        listView.setAdapter(adapter);
        listView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView parent, View view, int position, long id) {
                textView.setText(list.get(position));
                drawerLayout.closeDrawer(Gravity.LEFT);
            }
        });
    }

    @Override
    public void onBackPressed() {
        if (drawerLayout.isDrawerOpen(Gravity.LEFT)) {
            drawerLayout.closeDrawer(Gravity.LEFT);
        } else if (drawerLayout.isDrawerOpen(Gravity.RIGHT)) {
            drawerLayout.closeDrawer(Gravity.RIGHT);
        } else {
            super.onBackPressed();
        }
    }

    private void initData() {
        list = new ArrayList<>();
        list.add("收藏");
        list.add("钱包");
        list.add("文件");
        list.add("相册");
    }

    public void leftToggle(View view) {
        //判断左边的侧拉菜单是否打开
        if (drawerLayout.isDrawerOpen(Gravity.LEFT)) {
            //关闭掉左边的侧拉菜单
            drawerLayout.closeDrawer(Gravity.LEFT);
        } else {
            //打开左边的侧拉菜单
            drawerLayout.openDrawer(Gravity.LEFT);
        }
    }

    public void rightToggle(View view) {
        //打开右边的侧拉菜单
        drawerLayout.openDrawer(Gravity.RIGHT);
    }
}

 第三种.NavigationView

布局v4包下DrawerLayout,先主页面,后左或右侧拉(引进design包下的NavigationView)
NavigationView可以关联headerLayout和menu
navigationView设置监听,可以响应menu的点击事件
通过drawerLayout.closeDrawer(Gravity.LEFT/Gravity.RIGHT);关闭侧拉

<android.support.v4.widget.DrawerLayout
    android:id="@+id/drawer_layout"
    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:layout_height="match_parent"
    tools:context="org.mobiletrain.a7_3drawerlayoutnavigationview.MainActivity">
    
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <TextView
            android:id="@+id/tv"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="主界面"/>
    

    
    <android.support.design.widget.NavigationView
        android:id="@+id/navigation_view"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="left"
        android:fitsSystemWindows="true"
        app:headerLayout="@layout/header_layout"
        app:menu="@menu/main">

                android:layout_width="match_parent"
                android:layout_height="200dp"
                android:orientation="vertical">

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="200dp"
        android:scaleType="centerCrop"
        android:src="@drawable/p1"/>

    <Button
        android:id="@+id/login"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:background="@null"
        android:gravity="center"
        android:text="请登录"
        android:textSize="24sp"/>

    
        <item
            android:id="@+id/favorite"
            android:icon="@mipmap/ic_launcher"
            android:title="收藏"/>
        <item
            android:id="@+id/wallet"
            android:icon="@mipmap/ic_launcher"
            android:title="钱包"/>
    
    
        <item
            android:id="@+id/photo"
            android:icon="@mipmap/ic_launcher"
            android:title="相册"/>
    
    <item
        android:id="@+id/file"
        android:icon="@mipmap/ic_launcher"
        android:title="文件"/>
public class MainActivity extends AppCompatActivity {

    private DrawerLayout drawerLayout;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        final TextView textView = (TextView) findViewById(R.id.tv);
        drawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);
        NavigationView navigationView = (NavigationView) findViewById(R.id.navigation_view);
        //使item上图片的颜色正常显示
        navigationView.setItemIconTintList(null);
        //设置NavigationView中item的点击事件
        navigationView.setNavigationItemSelectedListener(new NavigationView.OnNavigationItemSelectedListener() {
            @Override
            public boolean onNavigationItemSelected(MenuItem item) {
                switch (item.getItemId()) {
                    case R.id.favorite:
                        textView.setText("收藏");
                        break;
                }
                drawerLayout.closeDrawer(Gravity.LEFT);
                return true;
            }
        });
        /****************处理头部点击事件*************************/
        //获得头布局
        View headerView = navigationView.getHeaderView(0);
        Button login = (Button) headerView.findViewById(R.id.login);
        login.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Toast.makeText(MainActivity.this, "登录成功", Toast.LENGTH_SHORT).show();
            }
        });
    }

    @Override
    public void onBackPressed() {
        if (drawerLayout.isDrawerOpen(Gravity.LEFT)) {
            drawerLayout.closeDrawer(Gravity.LEFT);
        } else {
            super.onBackPressed();
        }
    }
}
private void initGuide() {
        //显示导航按钮
        getSupportActionBar().setDisplayHomeAsUpEnabled(true);
        //1.当前Activity
        //2.侧拉菜单的根布局
        //3.4.对于侧拉菜单打开或者关闭的一个描述
        ActionBarDrawerToggle actionBarDrawerToggle = new ActionBarDrawerToggle(MainActivity.this,drawerLayout,0,0);
        drawerLayout.setDrawerListener(actionBarDrawerToggle);
        //表示让ActionBar的状态和DrawerLayout的状态同步
        actionBarDrawerToggle.syncState();
    }

 第四种.SlidingMenu

通过slidingMenu.setMode(SlidingMenu.LEFT_RIGHT);设置两边都可以滑动
slidingMenu.setMenu(R.layout.left_layout);设置左边布局
slidingMenu.setSecondaryMenu(R.layout.right_layout);设置右边布局

*侧滑内容是文本

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        SlidingMenu slidingMenu = new SlidingMenu(this);
        //设置SlidingMenu的侧滑方式为左右两边都可以滑动
        slidingMenu.setMode(SlidingMenu.LEFT_RIGHT);
        //设置左边侧拉布局
        slidingMenu.setMenu(R.layout.left_layout);
        //设置右边侧拉布局
        slidingMenu.setSecondaryMenu(R.layout.right_layout);
        slidingMenu.setBehindWidth(getResources().getDisplayMetrics().widthPixels / 3);
        //第二个参数表示侧拉菜单滑动模式
        //1.SlidingMenu.SLIDING_WINDOW:表示侧拉菜单和页面一样高
        //2.SlidingMenu.SLIDING_CONTENT:表示侧拉菜单在ActionBar下面活动
        slidingMenu.attachToActivity(this, SlidingMenu.SLIDING_CONTENT);
    }
}

*侧滑内容是Fragment

public class LeftFragment extends Fragment {
    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        TextView textView = new TextView(getActivity());
        textView.setText("left");
        return textView;
    }
}

public class RightFragment extends Fragment {
    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        TextView textView = new TextView(getActivity());
        textView.setText("right");
        return textView;
    }
}
public class MainActivity extends SlidingFragmentActivity {

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

        //设置左边侧滑菜单的布局
        setBehindContentView(R.layout.left_layout);
        SlidingMenu slidingMenu = getSlidingMenu();
        slidingMenu.setMode(SlidingMenu.LEFT_RIGHT);
        slidingMenu.setSecondaryMenu(R.layout.right_layout);
        //设置两边菜单侧拉偏移量为屏幕宽度的1/3
        slidingMenu.setBehindWidth(getResources().getDisplayMetrics().widthPixels / 3);
        FragmentTransaction transaction = getSupportFragmentManager().beginTransaction();
        //用Fragment替换左右两边的Linearlayout
        transaction.replace(R.id.left_linearlayout, new LeftFragment());
        transaction.replace(R.id.right_linearlayout, new RightFragment());
        transaction.commit();
    }
}

 

你可能感兴趣的:(【框架】侧拉菜单)