碼上歡樂
相關內容    簡體    繁體

Android DrawerLayout Plus 增強版抽屜菜單

本文轉載自   查看原文   2016-12-08 17:02   1717 

 DrawerLayout是官方提供的側滑菜單，相比SliddingMenu，它更加輕量級。默認情況下，DrawerLayout可以設置左側或者右側滑出菜單。如下，

 

xml布局：

 

[html] view plain copy
 
print?在CODE上查看代碼片派生到我的代碼片
  1. <!-- 
  2.  
  3. <!-- 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. -->  
  4. <com.sys.app.uikit.drawerlayoutplus.DrawerLayoutPlus xmlns:android="http://schemas.android.com/apk/res/android"  
  5.     android:id="@+id/drawer_layout"  
  6.     android:layout_width= "match_parent"  
  7.     android:layout_height= "match_parent" >  
  8.   
  9.     <!--  
  10.          As the main content view, the view below consumes the entire  
  11.          space available using match_parent in both dimensions.  
  12.     -->  
  13.   
  14.     <FrameLayout  
  15.         android:id="@+id/content_frame"  
  16.         android:layout_width="match_parent"  
  17.         android:layout_height="match_parent" />  
  18.   
  19.     <!--  
  20.          android:layout_gravity="start" tells DrawerLayout to treat  
  21.          this as a sliding drawer on the left side for left-to-right  
  22.          languages and on the right side for right-to-left languages.  
  23.          The drawer is given a fixed width in dp and extends the full height of  
  24.          the container. A solid background is used for contrast  
  25.          with the content view.  
  26.     -->  
  27.   
  28.     <!-- Left drawer -->  
  29.     <ListView  
  30.         android:id="@+id/left_drawer"  
  31.         android:layout_width="240dp"  
  32.         android:layout_height="match_parent"  
  33.         android:layout_gravity="left"  
  34.         android:background="#111"  
  35.         android:choiceMode="singleChoice"  
  36.         android:divider="@android:color/transparent"  
  37.         android:dividerHeight="0dp" />  
  38.   
  39.     <!-- Right drawer -->  
  40.     <ListView  
  41.         android:id="@+id/right_drawer"  
  42.         android:layout_width="match_parent"  
  43.         android:layout_height="match_parent"  
  44.         android:layout_gravity="right"  
  45.         android:choiceMode="singleChoice" />  
  46.   
  47. </com.sys.app.uikit.drawerlayoutplus.DrawerLayoutPlus>  
<!--

<!-- 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. -->
<com.sys.app.uikit.drawerlayoutplus.DrawerLayoutPlus xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/drawer_layout"
    android:layout_width= "match_parent"
    android:layout_height= "match_parent" >

    <!--
         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:layout_gravity="start" tells DrawerLayout to treat
         this as a sliding drawer on the left side for left-to-right
         languages and on the right side for right-to-left languages.
         The drawer is given a fixed width in dp and extends the full height of
         the container. A solid background is used for contrast
         with the content view.
    -->

    <!-- Left drawer -->
    <ListView
        android:id="@+id/left_drawer"
        android:layout_width="240dp"
        android:layout_height="match_parent"
        android:layout_gravity="left"
        android:background="#111"
        android:choiceMode="singleChoice"
        android:divider="@android:color/transparent"
        android:dividerHeight="0dp" />

    <!-- Right drawer -->
    <ListView
        android:id="@+id/right_drawer"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_gravity="right"
        android:choiceMode="singleChoice" />

</com.sys.app.uikit.drawerlayoutplus.DrawerLayoutPlus>
Activity代碼：
[html] view plain copy
 
print?在CODE上查看代碼片派生到我的代碼片
  1. package com.sys.app.uikit.drawerlayoutplus;  
  2.   
  3. import java.util.Locale;  
  4. import android.app.Activity;  
  5. import android.app.Fragment;  
  6. import android.app.FragmentManager;  
  7. import android.app.SearchManager;  
  8. import android.content.Intent;  
  9. import android.content.res.Configuration;  
  10. import android.os.Bundle;  
  11. import android.support.v4.view.GravityCompat;  
  12. import android.view.LayoutInflater;  
  13. import android.view.Menu;  
  14. import android.view.MenuInflater;  
  15. import android.view.MenuItem;  
  16. import android.view.View;  
  17. import android.view.ViewGroup;  
  18. import android.widget.AdapterView;  
  19. import android.widget.ArrayAdapter;  
  20. import android.widget.ImageView;  
  21. import android.widget.ListView;  
  22. import android.widget.Toast;  
  23.   
  24.   
  25. public class MainActivity extends Activity {  
  26.   
  27.      private DrawerLayoutPlus mDrawerLayout;  
  28.      private ListView mLeftDrawerList, mRightDrawerList;  
  29.      private ActionBarDrawerToggle mDrawerToggle;  
  30.   
  31.      private CharSequence mDrawerTitle;  
  32.      private CharSequence mTitle;  
  33.      private String[] mPlanetTitles;  
  34.   
  35.      @Override  
  36.      protected void onCreate(Bundle savedInstanceState) {  
  37.           super.onCreate(savedInstanceState);  
  38.           setContentView(R.layout.activity_main);  
  39.   
  40.           mTitle = mDrawerTitle = getTitle();  
  41.           mPlanetTitles = getResources().getStringArray(R.array.planets_array);  
  42.           mDrawerLayout = (DrawerLayoutPlus) findViewById(R.id.drawer_layout);  
  43.           mLeftDrawerList = (ListView) findViewById(R.id.left_drawer);  
  44.           mRightDrawerList = (ListView) findViewById(R.id.right_drawer);  
  45.           // set a custom shadow that overlays the main content when the drawer  
  46.           // opens  
  47.           mDrawerLayout.setDrawerShadow(R.drawable.drawer_shadow, GravityCompat.START);  
  48.           // set up the drawer's list view with items and click listener  
  49.           mLeftDrawerList.setAdapter(new ArrayAdapter<String>(this, R.layout.drawer_list_item, mPlanetTitles));  
  50.           mLeftDrawerList.setOnItemClickListener(new DrawerItemClickListener());  
  51.           mRightDrawerList.setAdapter(new ArrayAdapter<String>(this, R.layout.drawer_list_item, mPlanetTitles));  
  52.           mRightDrawerList.setOnItemClickListener(new DrawerItemClickListener());  
  53.   
  54.           // enable ActionBar app icon to behave as action to toggle nav drawer  
  55.           getActionBar().setDisplayHomeAsUpEnabled(true);  
  56.           getActionBar().setHomeButtonEnabled(true);  
  57.   
  58.           // ActionBarDrawerToggle ties together the the proper interactions  
  59.           // between the sliding drawer and the action bar app icon  
  60.           mDrawerToggle = new ActionBarDrawerToggle(this, /* host Activity */  
  61.           mDrawerLayout, /* DrawerLayout object */  
  62.           R.drawable.ic_drawer, /* nav drawer image to replace 'Up' caret */  
  63.           R.string.drawer_open, /* "open drawer" description for accessibility */  
  64.           R.string.drawer_close /* "close drawer" description for accessibility */  
  65.           ) {  
  66.                public void onDrawerClosed(View view) {  
  67.                     getActionBar().setTitle(mTitle);  
  68.                     invalidateOptionsMenu(); // creates call to  
  69.                                                        // onPrepareOptionsMenu()  
  70.                }  
  71.   
  72.                public void onDrawerOpened(View drawerView) {  
  73.                     getActionBar().setTitle(mDrawerTitle);  
  74.                     invalidateOptionsMenu(); // creates call to  
  75.                                                        // onPrepareOptionsMenu()  
  76.                }  
  77.           };  
  78.   
  79.           mDrawerLayout.setDrawerListener(mDrawerToggle);  
  80.   
  81.           if (savedInstanceState == null) {  
  82.                selectItem(0);  
  83.           }  
  84.      }  
  85.   
  86.      @Override  
  87.      public boolean onCreateOptionsMenu(Menu menu) {  
  88.           MenuInflater inflater = getMenuInflater();  
  89.           inflater.inflate(R.menu.main, menu);  
  90.           return super.onCreateOptionsMenu(menu);  
  91.      }  
  92.   
  93.      /* Called whenever we call invalidateOptionsMenu() */  
  94.      @Override  
  95.      public boolean onPrepareOptionsMenu(Menu menu) {  
  96.           // If the nav drawer is open, hide action items related to the content  
  97.           // view  
  98.           boolean drawerLeftOpen = mDrawerLayout.isDrawerOpen(mLeftDrawerList);  
  99.           boolean drawerRightOpen = mDrawerLayout.isDrawerOpen(mRightDrawerList);  
  100.           menu.findItem(R.id.action_websearch).setVisible(!(drawerLeftOpen && drawerRightOpen));  
  101.           return super.onPrepareOptionsMenu(menu);  
  102.      }  
  103.   
  104.      @Override  
  105.      public boolean onOptionsItemSelected(MenuItem item) {  
  106.           // The action bar home/up action should open or close the drawer.  
  107.           // ActionBarDrawerToggle will take care of this.  
  108.           if (mDrawerToggle.onOptionsItemSelected(item)) {  
  109.                return true;  
  110.           }  
  111.           // Handle action buttons  
  112.           switch (item.getItemId()) {  
  113.           case R.id.action_websearch:  
  114.                // create intent to perform web search for this planet  
  115.                Intent intent = new Intent(Intent.ACTION_WEB_SEARCH);  
  116.                intent.putExtra(SearchManager.QUERY, getActionBar().getTitle());  
  117.                // catch event that there's no activity to handle intent  
  118.                if (intent.resolveActivity(getPackageManager()) != null) {  
  119.                     startActivity(intent);  
  120.                } else {  
  121.                     Toast.makeText(this, R.string.app_not_available, Toast.LENGTH_LONG).show();  
  122.                }  
  123.                return true;  
  124.           default:  
  125.                return super.onOptionsItemSelected(item);  
  126.           }  
  127.      }  
  128.   
  129.      /* The click listner for ListView in the navigation drawer */  
  130.      private class DrawerItemClickListener implements ListView.OnItemClickListener {  
  131.           @Override  
  132.           public void onItemClick(AdapterView<?> parent, View view, int position, long id) {  
  133.                selectItem(position);  
  134.           }  
  135.      }  
  136.   
  137.      private void selectItem(int position) {  
  138.           // update the main content by replacing fragments  
  139.           Fragment fragment = new PlanetFragment();  
  140.           Bundle args = new Bundle();  
  141.           args.putInt(PlanetFragment.ARG_PLANET_NUMBER, position);  
  142.           fragment.setArguments(args);  
  143.   
  144.           FragmentManager fragmentManager = getFragmentManager();  
  145.           fragmentManager.beginTransaction().replace(R.id.content_frame, fragment).commit();  
  146.   
  147.           // update selected item and title, then close the drawer  
  148.           mLeftDrawerList.setItemChecked(position, true);  
  149.           mRightDrawerList.setItemChecked(position, true);  
  150.           setTitle(mPlanetTitles[position]);  
  151.           mDrawerLayout.closeDrawer(mLeftDrawerList);  
  152.           mDrawerLayout.closeDrawer(mRightDrawerList);  
  153.      }  
  154.   
  155.      @Override  
  156.      public void setTitle(CharSequence title) {  
  157.           mTitle = title;  
  158.           getActionBar().setTitle(mTitle);  
  159.      }  
  160.   
  161.      /**  
  162.      * When using the ActionBarDrawerToggle, you must call it during  
  163.      * onPostCreate() and onConfigurationChanged()...  
  164.      */  
  165.   
  166.      @Override  
  167.      protected void onPostCreate(Bundle savedInstanceState) {  
  168.           super.onPostCreate(savedInstanceState);  
  169.           // Sync the toggle state after onRestoreInstanceState has occurred.  
  170.           mDrawerToggle.syncState();  
  171.      }  
  172.   
  173.      @Override  
  174.      public void onConfigurationChanged(Configuration newConfig) {  
  175.           super.onConfigurationChanged(newConfig);  
  176.           // Pass any configuration change to the drawer toggls  
  177.           mDrawerToggle.onConfigurationChanged(newConfig);  
  178.      }  
  179.   
  180.      /**  
  181.      * Fragment that appears in the "content_frame", shows a planet  
  182.      */  
  183.      public static class PlanetFragment extends Fragment {  
  184.           public static final String ARG_PLANET_NUMBER = "planet_number";  
  185.   
  186.           public PlanetFragment() {  
  187.                // Empty constructor required for fragment subclasses  
  188.           }  
  189.   
  190.           @Override  
  191.           public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {  
  192.                View rootView = inflater.inflate(R.layout.fragment_planet, container, false);  
  193.                int i = getArguments().getInt(ARG_PLANET_NUMBER);  
  194.                String planet = getResources().getStringArray(R.array.planets_array)[i];  
  195.   
  196.                int imageId = getResources().getIdentifier(planet.toLowerCase(Locale.getDefault()), "drawable",  
  197.                          getActivity().getPackageName());  
  198.                ((ImageView) rootView.findViewById(R.id.image)).setImageResource(imageId);  
  199.                getActivity().setTitle(planet);  
  200.                return rootView;  
  201.           }  
  202.      }  
  203. }  
package com.sys.app.uikit.drawerlayoutplus;

import java.util.Locale;
import android.app.Activity;
import android.app.Fragment;
import android.app.FragmentManager;
import android.app.SearchManager;
import android.content.Intent;
import android.content.res.Configuration;
import android.os.Bundle;
import android.support.v4.view.GravityCompat;
import android.view.LayoutInflater;
import android.view.Menu;
import android.view.MenuInflater;
import android.view.MenuItem;
import android.view.View;
import android.view.ViewGroup;
import android.widget.AdapterView;
import android.widget.ArrayAdapter;
import android.widget.ImageView;
import android.widget.ListView;
import android.widget.Toast;


public class MainActivity extends Activity {

     private DrawerLayoutPlus mDrawerLayout;
     private ListView mLeftDrawerList, mRightDrawerList;
     private ActionBarDrawerToggle mDrawerToggle;

     private CharSequence mDrawerTitle;
     private CharSequence mTitle;
     private String[] mPlanetTitles;

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

          mTitle = mDrawerTitle = getTitle();
          mPlanetTitles = getResources().getStringArray(R.array.planets_array);
          mDrawerLayout = (DrawerLayoutPlus) findViewById(R.id.drawer_layout);
          mLeftDrawerList = (ListView) findViewById(R.id.left_drawer);
          mRightDrawerList = (ListView) findViewById(R.id.right_drawer);
          // set a custom shadow that overlays the main content when the drawer
          // opens
          mDrawerLayout.setDrawerShadow(R.drawable.drawer_shadow, GravityCompat.START);
          // set up the drawer's list view with items and click listener
          mLeftDrawerList.setAdapter(new ArrayAdapter<String>(this, R.layout.drawer_list_item, mPlanetTitles));
          mLeftDrawerList.setOnItemClickListener(new DrawerItemClickListener());
          mRightDrawerList.setAdapter(new ArrayAdapter<String>(this, R.layout.drawer_list_item, mPlanetTitles));
          mRightDrawerList.setOnItemClickListener(new DrawerItemClickListener());

          // enable ActionBar app icon to behave as action to toggle nav drawer
          getActionBar().setDisplayHomeAsUpEnabled(true);
          getActionBar().setHomeButtonEnabled(true);

          // ActionBarDrawerToggle ties together the the proper interactions
          // between the sliding drawer and the action bar app icon
          mDrawerToggle = new ActionBarDrawerToggle(this, /* host Activity */
          mDrawerLayout, /* DrawerLayout object */
          R.drawable.ic_drawer, /* nav drawer image to replace 'Up' caret */
          R.string.drawer_open, /* "open drawer" description for accessibility */
          R.string.drawer_close /* "close drawer" description for accessibility */
          ) {
               public void onDrawerClosed(View view) {
                    getActionBar().setTitle(mTitle);
                    invalidateOptionsMenu(); // creates call to
                                                       // onPrepareOptionsMenu()
               }

               public void onDrawerOpened(View drawerView) {
                    getActionBar().setTitle(mDrawerTitle);
                    invalidateOptionsMenu(); // creates call to
                                                       // onPrepareOptionsMenu()
               }
          };

          mDrawerLayout.setDrawerListener(mDrawerToggle);

          if (savedInstanceState == null) {
               selectItem(0);
          }
     }

     @Override
     public boolean onCreateOptionsMenu(Menu menu) {
          MenuInflater inflater = getMenuInflater();
          inflater.inflate(R.menu.main, menu);
          return super.onCreateOptionsMenu(menu);
     }

     /* Called whenever we call invalidateOptionsMenu() */
     @Override
     public boolean onPrepareOptionsMenu(Menu menu) {
          // If the nav drawer is open, hide action items related to the content
          // view
          boolean drawerLeftOpen = mDrawerLayout.isDrawerOpen(mLeftDrawerList);
          boolean drawerRightOpen = mDrawerLayout.isDrawerOpen(mRightDrawerList);
          menu.findItem(R.id.action_websearch).setVisible(!(drawerLeftOpen && drawerRightOpen));
          return super.onPrepareOptionsMenu(menu);
     }

     @Override
     public boolean onOptionsItemSelected(MenuItem item) {
          // The action bar home/up action should open or close the drawer.
          // ActionBarDrawerToggle will take care of this.
          if (mDrawerToggle.onOptionsItemSelected(item)) {
               return true;
          }
          // Handle action buttons
          switch (item.getItemId()) {
          case R.id.action_websearch:
               // create intent to perform web search for this planet
               Intent intent = new Intent(Intent.ACTION_WEB_SEARCH);
               intent.putExtra(SearchManager.QUERY, getActionBar().getTitle());
               // catch event that there's no activity to handle intent
               if (intent.resolveActivity(getPackageManager()) != null) {
                    startActivity(intent);
               } else {
                    Toast.makeText(this, R.string.app_not_available, Toast.LENGTH_LONG).show();
               }
               return true;
          default:
               return super.onOptionsItemSelected(item);
          }
     }

     /* The click listner for ListView in the navigation drawer */
     private class DrawerItemClickListener implements ListView.OnItemClickListener {
          @Override
          public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
               selectItem(position);
          }
     }

     private void selectItem(int position) {
          // update the main content by replacing fragments
          Fragment fragment = new PlanetFragment();
          Bundle args = new Bundle();
          args.putInt(PlanetFragment.ARG_PLANET_NUMBER, position);
          fragment.setArguments(args);

          FragmentManager fragmentManager = getFragmentManager();
          fragmentManager.beginTransaction().replace(R.id.content_frame, fragment).commit();

          // update selected item and title, then close the drawer
          mLeftDrawerList.setItemChecked(position, true);
          mRightDrawerList.setItemChecked(position, true);
          setTitle(mPlanetTitles[position]);
          mDrawerLayout.closeDrawer(mLeftDrawerList);
          mDrawerLayout.closeDrawer(mRightDrawerList);
     }

     @Override
     public void setTitle(CharSequence title) {
          mTitle = title;
          getActionBar().setTitle(mTitle);
     }

     /**
     * When using the ActionBarDrawerToggle, you must call it during
     * onPostCreate() and onConfigurationChanged()...
     */

     @Override
     protected void onPostCreate(Bundle savedInstanceState) {
          super.onPostCreate(savedInstanceState);
          // Sync the toggle state after onRestoreInstanceState has occurred.
          mDrawerToggle.syncState();
     }

     @Override
     public void onConfigurationChanged(Configuration newConfig) {
          super.onConfigurationChanged(newConfig);
          // Pass any configuration change to the drawer toggls
          mDrawerToggle.onConfigurationChanged(newConfig);
     }

     /**
     * Fragment that appears in the "content_frame", shows a planet
     */
     public static class PlanetFragment extends Fragment {
          public static final String ARG_PLANET_NUMBER = "planet_number";

          public PlanetFragment() {
               // Empty constructor required for fragment subclasses
          }

          @Override
          public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
               View rootView = inflater.inflate(R.layout.fragment_planet, container, false);
               int i = getArguments().getInt(ARG_PLANET_NUMBER);
               String planet = getResources().getStringArray(R.array.planets_array)[i];

               int imageId = getResources().getIdentifier(planet.toLowerCase(Locale.getDefault()), "drawable",
                         getActivity().getPackageName());
               ((ImageView) rootView.findViewById(R.id.image)).setImageResource(imageId);
               getActivity().setTitle(planet);
               return rootView;
          }
     }
}
效果如圖所示：
圖-1
  如果換一個需求，是從下面彈出菜單，那是用系統的DrawerLayout是做不到的，不過可以通過修改其源碼來達到目的。
 
二、分析
    DrawerLayout作為一個父類容器，可以包含子View，而子View又可以分為內容區域和菜單區域。內容區域占據整個屏幕大小，菜單區域默認在屏幕內側。DrawerLayout繼承於ViewGroup，必然需要重寫onLayout()方法，那么在設置子View位置的時候，內容區域默認直接顯示出來，菜單區域默認隱藏在屏幕內側。DrawerLayout的onLayout()代碼如下：
[html] view plain copy
 
print?在CODE上查看代碼片派生到我的代碼片
  1. @Override  
  2.      protected void onLayout(boolean changed, int l, int t, int r, int b) {  
  3.            mInLayout = true ;  
  4.            final int width = r - l;  
  5.            final int childCount = getChildCount();  
  6.            for (int i = 0; i < childCount; i++) {  
  7.                final View child = getChildAt(i);  
  8.   
  9.                if (child.getVisibility() == GONE) {  
  10.                     continue;  
  11.               }  
  12.   
  13.                final LayoutParams lp = (LayoutParams) child.getLayoutParams();  
  14.   
  15.                if (isContentView(child)) {  
  16.                    child.layout(lp. leftMargin, lp.topMargin, lp.leftMargin + child.getMeasuredWidth(),  
  17.                              lp. topMargin + child.getMeasuredHeight());  
  18.               } else { // Drawer, if it wasn't onMeasure would have thrown an  
  19.                               // exception.  
  20.                     final int childWidth = child.getMeasuredWidth();  
  21.                     final int childHeight = child.getMeasuredHeight();  
  22.                     int childLeft;  
  23.   
  24.                     final float newOffset;  
  25.                     if (checkDrawerViewAbsoluteGravity(child, Gravity.LEFT)) {  
  26.                         childLeft = -childWidth + ( int) (childWidth * lp.onScreen);  
  27.                         newOffset = ( float) (childWidth + childLeft) / childWidth;  
  28.                    } else { // Right; onMeasure checked for us.  
  29.                         childLeft = width - ( int) (childWidth * lp.onScreen);  
  30.                         newOffset = ( float) (width - childLeft) / childWidth;  
  31.                    }  
  32.                  
  33.                     final boolean changeOffset = newOffset != lp.onScreen;  
  34.   
  35.                     final int vgrav = lp.gravity & Gravity.VERTICAL_GRAVITY_MASK ;  
  36.                     switch (vgrav) {  
  37.                     default:  
  38.                     case Gravity.TOP : {  
  39.                         child.layout(childLeft, lp.topMargin, childLeft + childWidth, lp.topMargin + childHeight);  
  40.                          break;  
  41.                    }  
  42.   
  43.                     case Gravity.BOTTOM : {  
  44.                          final int height = b - t;  
  45.                         child.layout(childLeft, height - lp.bottomMargin - child.getMeasuredHeight(), childLeft + childWidth,  
  46.                                   height - lp.bottomMargin);  
  47.                          break;  
  48.                    }  
  49.   
  50.                     case Gravity.CENTER_VERTICAL : {  
  51.                          final int height = b - t;  
  52.                          int childTop = (height - childHeight) / 2;  
  53.   
  54.                          // Offset for margins. If things don't fit right because of  
  55.                          // bad measurement before, oh well.  
  56.                          if (childTop < lp.topMargin ) {  
  57.                              childTop = lp. topMargin;  
  58.                         } else if (childTop + childHeight > height - lp.bottomMargin ) {  
  59.                              childTop = height - lp.bottomMargin - childHeight;  
  60.                         }  
  61.                         child.layout(childLeft, childTop, childLeft + childWidth, childTop + childHeight);  
  62.                          break;  
  63.                    }  
  64.                    }  
  65.   
  66.                     if (changeOffset) {  
  67.                         setDrawerViewOffset(child, newOffset);  
  68.                    }  
  69.   
  70.                     final int newVisibility = lp.onScreen > 0 ? VISIBLE : INVISIBLE ;  
  71.                     if (child.getVisibility() != newVisibility) {  
  72.                         child.setVisibility(newVisibility);  
  73.                    }  
  74.               }  
  75.           }  
  76.            mInLayout = false ;  
  77.            mFirstLayout = false ;  
  78.      }  
@Override
     protected void onLayout(boolean changed, int l, int t, int r, int b) {
           mInLayout = true ;
           final int width = r - l;
           final int childCount = getChildCount();
           for (int i = 0; i < childCount; i++) {
               final View child = getChildAt(i);

               if (child.getVisibility() == GONE) {
                    continue;
              }

               final LayoutParams lp = (LayoutParams) child.getLayoutParams();

               if (isContentView(child)) {
                   child.layout(lp. leftMargin, lp.topMargin, lp.leftMargin + child.getMeasuredWidth(),
                             lp. topMargin + child.getMeasuredHeight());
              } else { // Drawer, if it wasn't onMeasure would have thrown an
                              // exception.
                    final int childWidth = child.getMeasuredWidth();
                    final int childHeight = child.getMeasuredHeight();
                    int childLeft;

                    final float newOffset;
                    if (checkDrawerViewAbsoluteGravity(child, Gravity.LEFT)) {
                        childLeft = -childWidth + ( int) (childWidth * lp.onScreen);
                        newOffset = ( float) (childWidth + childLeft) / childWidth;
                   } else { // Right; onMeasure checked for us.
                        childLeft = width - ( int) (childWidth * lp.onScreen);
                        newOffset = ( float) (width - childLeft) / childWidth;
                   }
               
                    final boolean changeOffset = newOffset != lp.onScreen;

                    final int vgrav = lp.gravity & Gravity.VERTICAL_GRAVITY_MASK ;
                    switch (vgrav) {
                    default:
                    case Gravity.TOP : {
                        child.layout(childLeft, lp.topMargin, childLeft + childWidth, lp.topMargin + childHeight);
                         break;
                   }

                    case Gravity.BOTTOM : {
                         final int height = b - t;
                        child.layout(childLeft, height - lp.bottomMargin - child.getMeasuredHeight(), childLeft + childWidth,
                                  height - lp.bottomMargin);
                         break;
                   }

                    case Gravity.CENTER_VERTICAL : {
                         final int height = b - t;
                         int childTop = (height - childHeight) / 2;

                         // Offset for margins. If things don't fit right because of
                         // bad measurement before, oh well.
                         if (childTop < lp.topMargin ) {
                             childTop = lp. topMargin;
                        } else if (childTop + childHeight > height - lp.bottomMargin ) {
                             childTop = height - lp.bottomMargin - childHeight;
                        }
                        child.layout(childLeft, childTop, childLeft + childWidth, childTop + childHeight);
                         break;
                   }
                   }

                    if (changeOffset) {
                        setDrawerViewOffset(child, newOffset);
                   }

                    final int newVisibility = lp.onScreen > 0 ? VISIBLE : INVISIBLE ;
                    if (child.getVisibility() != newVisibility) {
                        child.setVisibility(newVisibility);
                   }
              }
          }
           mInLayout = false ;
           mFirstLayout = false ;
     }
  在onLayout方法中可以通過參數獲取之前測量DrawerLayout的寬度和高度，然后獲取DrawerLayout里面子View的個數，通過一個for循環來設置子View的位置。可以看到先是設置內容區域的位置，然后是菜單區域，后者通過設置offset來達到隱藏菜單的目的。所以這個地方是關鍵，如果想要在屏幕下方彈出菜單，那么就需要修改菜單的顯示位置,讓它置於屏幕下方。
  菜單View位置更改好，接着是手勢操作的部分。在DrawerLayout中，是通過ViewDragHelper這個類來實現View的拖拽。首先它聲明了左右菜單的幫助類和回調，
  
[html] view plain copy
 
print?在CODE上查看代碼片派生到我的代碼片
  1. private final ViewDragHelper mLeftDragger ;  
  2.      private final ViewDragHelper mRightDragger ;  
  3.      private final ViewDragCallback mLeftCallback ;  
  4.      private final ViewDragCallback mRightCallback ;  
 private final ViewDragHelper mLeftDragger ;
      private final ViewDragHelper mRightDragger ;
      private final ViewDragCallback mLeftCallback ;
      private final ViewDragCallback mRightCallback ;

 以及左右鎖和陰影，
[html] view plain copy
 
print?在CODE上查看代碼片派生到我的代碼片
  1. private int mLockModeLeft ;  
  2.      private int mLockModeRight ;  
  3.   
  4.      private Drawable mShadowLeft ;  
  5.      private Drawable mShadowRight ;  
 private int mLockModeLeft ;
      private int mLockModeRight ;

      private Drawable mShadowLeft ;
      private Drawable mShadowRight ;
 在構造方法里面初始化了幫助類和回調，

[html] view plain copy
 
print?在CODE上查看代碼片派生到我的代碼片
  1. mLeftCallback = new ViewDragCallback(Gravity.LEFT );  
  2.          mRightCallback = new ViewDragCallback(Gravity.RIGHT );  
  3.   
  4.          mLeftDragger = ViewDragHelper.create( this , TOUCH_SLOP_SENSITIVITY , mLeftCallback );  
  5.          mLeftDragger .setEdgeTrackingEnabled(ViewDragHelper. EDGE_LEFT);  
  6.          mLeftDragger .setMinVelocity(minVel);  
  7.          mLeftCallback .setDragger(mLeftDragger );  
  8.   
  9.          mRightDragger = ViewDragHelper.create( this , TOUCH_SLOP_SENSITIVITY , mRightCallback );  
  10.          mRightDragger .setEdgeTrackingEnabled(ViewDragHelper. EDGE_RIGHT);  
  11.          mRightDragger .setMinVelocity(minVel);  
  12.          mRightCallback .setDragger(mRightDragger );  
  mLeftCallback = new ViewDragCallback(Gravity.LEFT );
           mRightCallback = new ViewDragCallback(Gravity.RIGHT );

           mLeftDragger = ViewDragHelper.create( this , TOUCH_SLOP_SENSITIVITY , mLeftCallback );
           mLeftDragger .setEdgeTrackingEnabled(ViewDragHelper. EDGE_LEFT);
           mLeftDragger .setMinVelocity(minVel);
           mLeftCallback .setDragger(mLeftDragger );

           mRightDragger = ViewDragHelper.create( this , TOUCH_SLOP_SENSITIVITY , mRightCallback );
           mRightDragger .setEdgeTrackingEnabled(ViewDragHelper. EDGE_RIGHT);
           mRightDragger .setMinVelocity(minVel);
           mRightCallback .setDragger(mRightDragger );
 在設置陰影效果，進行一個左右的判斷
[html] view plain copy
 
print?在CODE上查看代碼片派生到我的代碼片
  1. public void setDrawerShadow(Drawable shadowDrawable, @EdgeGravity int gravity) {  
  2.           /*  
  3.           * TODO Someone someday might want to set more complex drawables here.  
  4.           * They're probably nuts, but we might want to consider registering  
  5.           * callbacks, setting states, etc. properly.  
  6.           */  
  7.   
  8.           final int absGravity = GravityCompat.getAbsoluteGravity(gravity, ViewCompat.getLayoutDirection( this));  
  9.           if ((absGravity & Gravity. LEFT) == Gravity. LEFT) {  
  10.               mShadowLeft = shadowDrawable;  
  11.              invalidate();  
  12.          }  
  13.           if ((absGravity & Gravity. RIGHT) == Gravity.RIGHT ) {  
  14.               mShadowRight = shadowDrawable;  
  15.              invalidate();  
  16.          }  
  17.     }  
 public void setDrawerShadow(Drawable shadowDrawable, @EdgeGravity int gravity) {
           /*
           * TODO Someone someday might want to set more complex drawables here.
           * They're probably nuts, but we might want to consider registering
           * callbacks, setting states, etc. properly.
           */

           final int absGravity = GravityCompat.getAbsoluteGravity(gravity, ViewCompat.getLayoutDirection( this));
           if ((absGravity & Gravity. LEFT) == Gravity. LEFT) {
               mShadowLeft = shadowDrawable;
              invalidate();
          }
           if ((absGravity & Gravity. RIGHT) == Gravity.RIGHT ) {
               mShadowRight = shadowDrawable;
              invalidate();
          }
     }
  還有菜單鎖，
[html] view plain copy
 
print?在CODE上查看代碼片派生到我的代碼片
  1. public void setDrawerLockMode(@LockMode int lockMode) {  
  2.         setDrawerLockMode(lockMode, Gravity. LEFT );  
  3.         setDrawerLockMode(lockMode, Gravity. RIGHT );  
  4.    }  
  public void setDrawerLockMode(@LockMode int lockMode) {
          setDrawerLockMode(lockMode, Gravity. LEFT );
          setDrawerLockMode(lockMode, Gravity. RIGHT );
     }
  也是進行左右的判斷，
[html] view plain copy
 
print?在CODE上查看代碼片派生到我的代碼片
  1. public void setDrawerLockMode(@LockMode int lockMode, @EdgeGravity int edgeGravity) {  
  2.            final int absGravity = GravityCompat.getAbsoluteGravity(edgeGravity, ViewCompat.getLayoutDirection( this));  
  3.            if (absGravity == Gravity. LEFT) {  
  4.                mLockModeLeft = lockMode;  
  5.           } else if (absGravity == Gravity. RIGHT) {  
  6.                mLockModeRight = lockMode;  
  7.           }  
  8.            if (lockMode != LOCK_MODE_UNLOCKED) {  
  9.                // Cancel interaction in progress  
  10.                final ViewDragHelper helper = absGravity == Gravity.LEFT ? mLeftDragger : mRightDragger ;  
  11.               helper.cancel();  
  12.           }  
  13.            switch (lockMode) {  
  14.            case LOCK_MODE_LOCKED_OPEN :  
  15.                final View toOpen = findDrawerWithGravity(absGravity);  
  16.                if (toOpen != null) {  
  17.                    openDrawer(toOpen);  
  18.               }  
  19.                break ;  
  20.            case LOCK_MODE_LOCKED_CLOSED :  
  21.                final View toClose = findDrawerWithGravity(absGravity);  
  22.                if (toClose != null) {  
  23.                    closeDrawer(toClose);  
  24.               }  
  25.                break ;  
  26.            // default: do nothing  
  27.           }  
  28.      }  
public void setDrawerLockMode(@LockMode int lockMode, @EdgeGravity int edgeGravity) {
           final int absGravity = GravityCompat.getAbsoluteGravity(edgeGravity, ViewCompat.getLayoutDirection( this));
           if (absGravity == Gravity. LEFT) {
               mLockModeLeft = lockMode;
          } else if (absGravity == Gravity. RIGHT) {
               mLockModeRight = lockMode;
          }
           if (lockMode != LOCK_MODE_UNLOCKED) {
               // Cancel interaction in progress
               final ViewDragHelper helper = absGravity == Gravity.LEFT ? mLeftDragger : mRightDragger ;
              helper.cancel();
          }
           switch (lockMode) {
           case LOCK_MODE_LOCKED_OPEN :
               final View toOpen = findDrawerWithGravity(absGravity);
               if (toOpen != null) {
                   openDrawer(toOpen);
              }
               break ;
           case LOCK_MODE_LOCKED_CLOSED :
               final View toClose = findDrawerWithGravity(absGravity);
               if (toClose != null) {
                   closeDrawer(toClose);
              }
               break ;
           // default: do nothing
          }
     }
  不光是上面的方法，DrawerLayout中還有很多方法也都是這樣。都是對Gravity的判斷，判斷是左側菜單還是右側，所以如果要改成從底部彈出菜單，那么把相應的值替換為Gravity.BOTTOM即可。當然還要注意在替換的過程中的一些邏輯問題，以免有紕漏。比如offset之前是左右，現在要改成上下，因此數值要重新計算。還有變量的命名等，之前是left或者right，現在改為bottom等等。
  修改后運行效果如下：




免責聲明！

本站轉載的文章為個人學習借鑒使用，本站對版權不負任何法律責任。如果侵犯了您的隱私權益，請聯系本站郵箱yoyou2525@163.com刪除。



猜您在找 [UI]抽屜菜單DrawerLayout分析（三） Linux命令行增強版 極路由4增強版(極企版)-刷潘多拉固件 Android 抽屜效果的導航菜單實現 Office2016專業增強版永久激活 深入淺出 消息隊列 ActiveMQ------增強版 Java 14 祭出增強版 switch，真香！！ Office2016專業增強版.密鑰 Docker安裝transmission並使用增強版的UI android29之UI控件的抽屜式實現方法之一(DrawerLayout和NavigationView)
 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM