शीर्ष एक्शनबार पर Android नेविगेशन दराज

अद्यतन: कैसे नाव दराज के साथ एक्शनबार ओवरले करने के लिए। (नए टूलबार के साथ) अपने build.gradle में अपनी निर्भरता में इनका उपयोग करें

compile 'com.android.support:appcompat-v7:21.0.0'
compile 'com.android.support:support-v4:21.0.0'

यह आपका ड्राअरलेआउट है

<!-- A DrawerLayout is intended to be used as the top-level content view using match_parent for both width and height to consume the full space available. -->
<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">
    <LinearLayout
        android:id="@+id/layout_main"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">
    <include layout="@layout/toolbar"/>
    <!-- As the main content view, the view below consumes the entire
         space available using match_parent in both dimensions. -->
    <FrameLayout
        android:id="@+id/content_frame"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@color/white"/>

    </LinearLayout>
    <fragment android:id="@+id/navigation_drawer"
        android:layout_width="@dimen/navigation_drawer_width"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:background="@color/list_background"
         />

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

अपने लेआउट फ़ोल्डर में नया टूलबार.एक्सएमएल फ़ाइल बनाएं।

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.Toolbar
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/toolbar"
    android:layout_height="wrap_content"
    android:layout_width="match_parent"
    app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
    app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
    android:minHeight="?attr/actionBarSize"
    android:background="?attr/colorPrimary" />

आप गतिविधि पर जाएं जो नेविगेशन दराज का विस्तार करती है। और इसे SetContentView () के बाद जोड़ें

Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);

अपने मूल्यों फ़ोल्डर में अपने विषय NoActionBar का विस्तार करने के लिए मत भूलना।

<style name="Theme.Whtsnxt" parent="@style/Theme.AppCompat.Light.NoActionBar">
    <item name="windowActionBar">false</item>
    <!-- colorPrimary is used for the default action bar background -->
    <item name="windowActionModeOverlay">true</item>
    <item name="android:textColorPrimary">@color/white</item>
    <item name="colorPrimary">@color/splashscreen</item>
    <item name="colorPrimaryDark">@color/holo_blue_light</item>

    <item name="android:windowBackground">@color/white</item>
    <item name="android:colorBackground">@color/white</item>

</style>

मेरे पास एक छोटा सा "ट्रिक" है जिसे https://github.com/jfeinstein10/SlidingMenu से सीखा जाता है ताकि आवश्यक प्रभाव को लागू किया जा सके।

आपको केवल खिड़की के सजावट दृश्य के पहले बच्चे को निकालने की जरूरत है, और पहले बच्चे को अपने दराज के सामग्री दृश्य में जोड़ें। उसके बाद, आपको केवल खिड़की की सजावट के दृश्य में अपने दराज को जोड़ने की आवश्यकता है।

नीचे आप के लिए कुछ विस्तृत कदम हैं।

सबसे पहले, एक xml बनाएं जिसका नाम "decor.xml" या कुछ भी आपको पसंद है। केवल DrawerLayout और दराज को अंदर रखें। नीचे दिया गया "FrameLayout" केवल एक कंटेनर है। हम इसका उपयोग आपकी गतिविधि की सामग्री को लपेटने के लिए करेंगे।

<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout ...>
    <FrameLayout android:id="@+id/container"
        android:orientation="vertical" 
        android:layout_width="fill_parent" 
        android:layout_height="fill_parent"/>
    <fragment android:name="com...." 
        android:layout_gravity="start" 
        android:id="@id/navigation" 
        android:layout_width="@dimen/navigation_menu_width" 
        android:layout_height="fill_parent" />
</android.support.v4.widget.DrawerLayout>

और फिर अपने मुख्य लेआउट में ड्रालेयआउट को हटा दें। अब आपकी मुख्य गतिविधि का लेआउट जैसा दिखना चाहिए

<RelativeLayout android:orientation="vertical" 
    android:layout_width="fill_parent" 
    android:layout_height="fill_parent">
    ...
</RelativeLayout>

हम मानते हैं कि मुख्य गतिविधि के लेआउट को "main.xml" नाम दिया गया है।

अपने MainActivity में, निम्नलिखित के रूप में लिखें:

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

    // Inflate the "decor.xml"
    LayoutInflater inflater = (LayoutInflater) getSystemService(Context.LAYOUT_INFLATER_SERVICE);
    DrawerLayout drawer = (DrawerLayout) inflater.inflate(R.layout.decor, null); // "null" is important.

    // HACK: "steal" the first child of decor view
    ViewGroup decor = (ViewGroup) getWindow().getDecorView();
    View child = decor.getChildAt(0);
    decor.removeView(child);
    FrameLayout container = (FrameLayout) drawer.findViewById(R.id.container); // This is the container we defined just now.
    container.addView(child);

    // Make the drawer replace the first child
    decor.addView(drawer);

    // Do what you want to do.......

}

अब आपको एक DrawerLayout मिला है, जो ActionBar पर स्लाइड कर सकता है। लेकिन आप इसे स्टेटस बार द्वारा कवर कर सकते हैं। इसे ठीक करने के लिए आपको दराज में एक पेडिंगटॉप जोड़ना होगा।

यदि आप एक lib या इस हैक का उपयोग नहीं करना चाहते हैं:

1. "Theme.AppCompat.NoActionBar" बढ़ाएँ
2. एक रेखीय लयआउट में अपने दराज के पहले तत्व ले जाएँ।

3. इस LinearLayout में एक टूलबार जोड़ें।

   <android.support.v7.widget.Toolbar
       android:id="@+id/toolbar"
       android:minHeight="?attr/actionBarSize"
       android:layout_width="match_parent"
       android:layout_height="wrap_content"
       app:titleTextColor="@android:color/white"
       android:background="?attr/colorPrimary">
   </android.support.v7.widget.Toolbar>

4. गतिविधि में सेटऑनवेंट व्यू के बाद निम्न पंक्ति जोड़ें

   setSupportActionBar((Toolbar) findViewById(R.id.toolbar));

5. अब यह काम करना चाहिए।