用于滑动操作栏的自定义抽屉布局

时间:2014-09-12 09:50:24

标签: android android-actionbar navigation-drawer slidingdrawer drawerlayout

我的要求是我需要导航抽屉的功能(导航菜单应该通过单击切换图标并从边距拖动来显示)+操作栏顶部的抽屉布局。

检查this帖子,我想要类似的操作。

我在SO中经历过很多关于此事的帖子,其中大多数人都说要使用第三方库来完成这项工作。但是我不想使用,而是在一个SO问题中 CommonsWare 说这样可以通过调整Drawerlayout来完成。

如何实现这一目标?

注意:我不想使用外部库,因为它会产生问题。

2 个答案:

答案 0 :(得分:2)

在Android Default中,您无法将DrawerLayout与Action Bar一起移动。但是,如果您热衷于使用默认导航抽屉。隐藏操作栏并创建类似于操作栏的顶部布局。它将与drawerLayout一起移动。如果您需要进一步的帮助代码,请告诉我。

找到我更新的答案

MainActivity.java

package com.example.android.navigationdrawerexample;

import android.annotation.SuppressLint;
import android.os.Build;
import android.os.Bundle;
import android.support.v4.app.ActionBarDrawerToggle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentActivity;
import android.support.v4.widget.DrawerLayout;
import android.view.Gravity;
import android.view.LayoutInflater;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.ViewGroup;
import android.view.animation.TranslateAnimation;
import android.widget.AdapterView;
import android.widget.AdapterView.OnItemClickListener;
import android.widget.ArrayAdapter;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.ListView;
import android.widget.RelativeLayout;
import android.widget.Toast;

public class MainActivity extends FragmentActivity {

    DrawerLayout drawerLayout;
    ActionBarDrawerToggle drawerToggle;
    ImageView menubtn, addbtn;
    LinearLayout menuLayout;
    RelativeLayout frame;
    TranslateAnimation anim;
    float moveFactor, lastTranslate = 0.0f;
    ListView accList;
    String[] menuValues = { "Add", "View" };

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

        if (savedInstanceState == null) {
            getSupportFragmentManager().beginTransaction()
                    .replace(R.id.container, new PlaceholderFragment())
                    .commit();
        }

        drawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);
        menuLayout = (LinearLayout) findViewById(R.id.menu);
        accList = (ListView) findViewById(R.id.drawer_list);
        frame = (RelativeLayout) findViewById(R.id.rl_main);
        menubtn = (ImageView) findViewById(R.id.menu_btn);
        addbtn = (ImageView) findViewById(R.id.add_btn);

        ArrayAdapter<String> adapter = new ArrayAdapter<String>(this,
                android.R.layout.simple_list_item_1, menuValues);

        accList.setAdapter(adapter);

        drawerToggle = new ActionBarDrawerToggle(this, drawerLayout,
                R.drawable.ic_drawer, R.string.open, R.string.close) {

            public void onDrawerClosed(View view) {

            }

            public void onDrawerOpened(View drawerview) {
                // adapter = new AccountAdapter(this, R.layout.row_acc, values);

            }

            @SuppressLint("NewApi")
            public void onDrawerSlide(View drawerView, float slideOffset) {

                // use this code only if you need the fragment to slide over, if you want the 
                // drawerlayout to be above the main screen then ignore this code. 

                //moveFactor = (menuLayout.getWidth() * slideOffset);
                //drawerLayout.setDrawerShadow(R.drawable.drawer_shadow,
                //      Gravity.LEFT);

                //if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.HONEYCOMB) {
                //  frame.setTranslationX(moveFactor);
                //} else {
                //  anim = new TranslateAnimation(lastTranslate, moveFactor,
                //          0.0f, 0.0f);
                //  anim.setDuration(0);
                //  anim.setFillAfter(true);
                //  frame.startAnimation(anim);

                //  lastTranslate = moveFactor;
                //}
            }
        };

        drawerLayout.setDrawerListener(drawerToggle);

        menubtn.setOnClickListener(new OnClickListener() {

            @Override
            public void onClick(View v) {
                if (drawerLayout.isDrawerVisible(Gravity.LEFT)) {
                    return;
                } else {
                    drawerLayout.openDrawer(Gravity.LEFT);
                }
            }
        });

        accList.setOnItemClickListener(new OnItemClickListener() {

            @Override
            public void onItemClick(AdapterView<?> parent, View view,
                    int position, long id) {
                if (position == 0) {
                    // Write your code
                    drawerLayout.closeDrawers();
                }
            }
        });

        addbtn.setOnClickListener(new OnClickListener() {

            @Override
            public void onClick(View arg0) {
                Toast.makeText(MainActivity.this, "Action Bar Icon code as per your requirement", Toast.LENGTH_LONG).show();
            }
        });

    }

    /**
     * A placeholder fragment containing a simple view.
     */
    public static class PlaceholderFragment extends Fragment {

        public PlaceholderFragment() {
        }

        @Override
        public View onCreateView(LayoutInflater inflater, ViewGroup container,
                Bundle savedInstanceState) {
            View rootView = inflater.inflate(R.layout.fragment_planet, container,
                    false);

            return rootView;
        }

    }

}

activity_main.xml中

<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/drawer_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@android:color/white"
    tools:context=".MainActivity" >

    <RelativeLayout
        android:id="@+id/rl_main"
        android:layout_width="match_parent"
        android:layout_height="match_parent" >

        <RelativeLayout
            android:id="@+id/top_layout"
            android:layout_width="match_parent"
            android:layout_height="40dp" >

            <ImageView
                android:id="@+id/menu_btn"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:layout_alignParentLeft="true"
                android:layout_marginLeft="10dp"
                android:src="@drawable/ic_drawer" />

            <ImageView
                android:id="@+id/add_btn"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:layout_alignParentRight="true"
                android:layout_marginRight="10dp"
                android:src="@android:drawable/ic_dialog_info"/>
        </RelativeLayout>

        <FrameLayout
            android:id="@+id/container"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_below="@+id/top_layout" />
    </RelativeLayout>

    <!-- The navigation drawer -->

    <LinearLayout
        android:id="@+id/menu"
        android:layout_width="240dp"
        android:layout_height="match_parent"
        android:layout_gravity="left"
        android:background="@android:color/white"
        android:orientation="vertical" >

        <TextView
            android:id="@+id/welcome_text"
            android:layout_width="match_parent"
            android:layout_height="40dp"
            android:layout_marginLeft="20dp"
            android:gravity="center_vertical"
            android:text="OPEN" />

        <ListView
            android:id="@+id/drawer_list"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_marginLeft="20dp"
            android:choiceMode="singleChoice"
            android:divider="@android:color/white"
            android:dividerHeight="2dp"
            android:listSelector="@android:color/white" />
    </LinearLayout>

</android.support.v4.widget.DrawerLayout>

另一个重要部分请将您的应用程序主题更改为noActionbar。如果这符合您的要求,请告诉我。

答案 1 :(得分:0)

您已经检查过Navigation Drawer documentation了吗?您必须为导航抽屉提供布局,因此它始终是自定义的,取决于您的样子。