Android Open Source project Slidingmenu in-depth analysis

Slidingmenu Introduction:

Slidingmenu is a relatively new setup interface or configuration interface effect, in the main interface left or right slide display settings interface, can easily do a variety of operations. There are a lot of applications that are using this effect now. such as Evernote, Google +, Foursquare, and so on, the domestic pea folder, everyone, 360 mobile phone assistants, etc. are using the Slidingmenu interface scheme.

Project : Https://github.com/jfeinstein10/SlidingMenu
Note : Slidingmenu relies on another open source project Actionbarsherlock, so you need to add Actionbarsherlock as a Slidingmenu library project, otherwise you will report that the resource could not find an error.
Then add the Slidingmenu to your project.

Slidingmenu Integration Common errors:

Jar mismatch! Fix your dependencies : a conflict caused by a inconsistency in the version of the jar package referenced by the project and itself. Ensure that the jar package versions used by Slidingmenu and Actionbarsherlock are consistent

If you use the relevant API to Actionbarsherlock, you may not be able to find methods such as Getsupportactionbar Actionbarsherlock. The reason is that the activity that uses actionbarsherlock needs to inherit from Sherlockactivity, modify the slidingfragmentactivity in the Slidingmenu library, Let it inherit from the sherlockfragmentactivity and recompile the library import.

Slidingmenu commonly used properties are:

Menu.setmode (slidingmenu.left);//Set Left slide menu

Menu.settouchmodeabove (Slidingmenu.touchmode_fullscreen);//sets the screen range to slide, which can be slid across the full-screen area

Menu.setshadowdrawable (R.drawable.shadow);//Set Shadow Picture

Menu.setshadowwidthres (r.dimen.shadow_width);//Set the width of the shadow picture

Menu.setbehindoffsetres (R.dimen.slidingmenu_offset); the remaining width displayed on the main page when//slidingmenu

Menu.setbehindwidth (400);//Set the width of the Slidingmenu menu

Menu.setfadedegree (0.35f); degree of gradient when//slidingmenu sliding

Menu.attachtoactivity (this, slidingmenu.sliding_content);//enable the Slidingmenu to be attached to the activity

Menu.setmenu (r.layout.menu_layout);//Set Menu layout file

Menu.toggle ();//dynamic judgment automatically shuts down or turns on Slidingmenu

Menu.showmenu ();//Display Slidingmenu

Menu.showcontent ();//display content

Menu.setonopenlistener (Onopenlistener);//Monitor Slidingmenu Open

About close Menu There are two listeners, in a nutshell, for the menu Close event, one is when, and the other is after

Menu. Onclosedlistener (Onclosedlistener);//monitor Slidingmenu Shutdown Event

Menu. Onclosedlistener (Onclosedlistener);//monitor Slidingmenu post-shutdown event

Left and right can be slidingmenu menu only need to set
Menu.setmode (slidingmenu.left_right); property, and then set the layout file for the menu on the right

Menu.setsecondaryshadowdrawable (r.drawable.shadowright);//Shadow picture on right menu

To implement Slidingmenu with fragment:

1. First the activity inherits from the Slidingfragmentactivity under the Slidingmenu package
2. Setcontentview (r.layout.content_frame);//The layout is a full-screen framelayout
3. Setbehindcontentview (r.layout.menu_frame);//Set Slidingmenu to use a layout that is also a full-screen framelayout
4. Set the fragment of the Slidingmenu left menu
[Java] view Plaincopyprint?

1. Setbehindcontentview (R.layout.menu_frame);
2. Fragmenttransaction t = this.getsupportfragmentmanager (). BeginTransaction ();
3. Leftmenufragment = new Menufragment ();
4. T.replace (R.id.menu_frame, leftmenufragment);
5. T.commit ();

        Setbehindcontentview (r.layout.menu_frame);        Fragmenttransaction t = This.getsupportfragmentmanager (). BeginTransaction ();        Leftmenufragment = new Menufragment ();        T.replace (R.id.menu_frame, leftmenufragment);        T.commit ();

Menufragment is actually a fragment that shows a ListView
Then click on each item in the ListView to notify the activity to switch between the different fragment
To see the effect, we created 5 new frament, respectively
Fragment1, Fragment2, Fragment3, Fragment4, FRAGMENT5
Displayed in Slidingmenu with a ListView.

Set the fragment for the main page display:

[Java]View Plaincopyprint?

2. if (savedinstancestate = = null) {//== null when creating a new Fragment1
4. Contentfragment = new Fragment1 ();
6. } else {//Not equal to NULL, direct get out
8. Not equal to NULL to find the fragment of the current activity display previously saved
10. Contentfragment = Getsupportfragmentmanager (). Getfragment (Savedinstancestate, "contentfragment");
12. }
14. Set Content Fragment
16. Getsupportfragmentmanager ()
18. . BeginTransaction ()
20. . replace (R.id.content_frame, contentfragment)
22. . commit ();

if (savedinstancestate = = null) {//== NULL when new fragment1contentfragment = new Fragment1 ();} else {//not equal to NULL, direct get out/ Not equal to NULL, find the fragmentcontentfragment = Getsupportfragmentmanager () that was previously saved by the current activity display. Getfragment (savedinstancestate , "Contentfragment");} Set content Fragmentgetsupportfragmentmanager (). BeginTransaction (). replace (R.id.content_frame, contentfragment). Commit ();
Saves the currently displayed fragment in the activity's onsaveinstancestate
Getsupportfragmentmanager (). Putfragment (Outstate, "contentfragment", contentfragment);
Setting the Slidingmenu property
SM = Getslidingmenu ();
If only the left menu is displayed, the right side, left, is supported on Left_right
Sm.setmode (slidingmenu.left_right);//Set menu slide mode, whether the menu appears on the left or right, or both sides
Sm.setshadowdrawable (R.drawable.shadow);//Set the Shadow's picture resource
Sm.setshadowwidthres (r.dimen.shadow_width);//Set the width of the shadow picture
Sm.setbehindwidth (200);//Setting the width of the menu
Sm.setbehindoffsetres (R.dimen.slidingmenu_offset); the remaining width displayed on the main page when//slidingmenu
Sm.settouchmodeabove (Slidingmenu.touchmode_fullscreen);//Set the area of the slide
supports the right-side underline menu:
Slidingmenu can simultaneously support the left and right side of the menu, non-conflict, and animation beautiful, good experience.
Sm.setsecondarymenu (r.layout.menu_frame2);//Set Right menu
Sm.setsecondaryshadowdrawable (r.drawable.shadowright);//Set the picture Resource for the right menu shadow
Right Slidingmenu fragment.
Getsupportfragmentmanager (). BeginTransaction (). Replace (r.id.menu_frame2, New Samplelistfragment ()). commit ();

Settings Actionbar can be clicked:
Getsupportactionbar (). Sethomebuttonenabled (TRUE);//actionbar main button can be clicked
Getsupportactionbar (). Setdisplayhomeasupenabled (true);//Show Left icon
Setslidingactionbarenabled (false);//Slidingmenu The left and right sides of the fragment whether to display the title bar
Toggle the fragment of the main page display:
public void Switchcontent (Fragment f) {
Assign a value to the content fragment and save the fragment when Onsaveinstancestate
Contentfragment = f;
Fragmenttransaction t = Getsupportfragmentmanager (). BeginTransaction ();
T.replace (R.id.content_frame, F);
T.commit ();
Sm.showcontent ();
Use normal activity to implement Slidingmenu:

[Java] view Plaincopyprint?

2. Slidingmenu menu = new Slidingmenu (this); Direct new, not getslidingmenu
4. Menu.setmode (Slidingmenu.left);
6. Menu.settouchmodeabove (Slidingmenu.touchmode_fullscreen);
8. Menu.setshadowdrawable (R.drawable.shadow);
10. Menu.setshadowwidthres (R.dimen.shadow_width);
12. Menu.setbehindoffsetres (R.dimen.slidingmenu_offset);
14. Menu.setbehindwidth (+); Set the width of the Slidingmenu menu
16. Menu.setfadedegree (0.35f);
18. Menu.attachtoactivity (this, slidingmenu.sliding_content); Must call
20. Menu.setmenu (R.layout.menu_layout_left); //is the normal layout
22. Menu.setbehindcanvastransformer (Mtransformer);

Slidingmenu menu = new Slidingmenu (this);//Direct new, not Getslidingmenumenu.setmode (Slidingmenu.left); Menu.settouchmodeabove (Slidingmenu.touchmode_fullscreen); menu.setshadowdrawable (R.drawable.shadow); Menu.setshadowwidthres (r.dimen.shadow_width); Menu.setbehindoffsetres (R.dimen.slidingmenu_offset); Menu.setbehindwidth (400);//Set the width of the Slidingmenu menu Menu.setfadedegree (0.35f); Menu.attachtoactivity (This, slidingmenu.sliding_content);//Must call Menu.setmenu (r.layout.menu_layout_left);// is the normal layout menu.setbehindcanvastransformer (Mtransformer);

The corresponding slidingmenu in the Click event, because Slidingmenu has been included in the activity, so the direct Findviewbyid (ID), get the view can be processed accordingly.

Supports both left and right sides to draw a menu
Menu.setsecondarymenu (R.layout.menu_layout_right);
Menu.setsecondaryshadowdrawable (R.drawable.shadowright);

The right menu is the same as direct Findviewbyid (ID), after you get the view can be processed arbitrarily

Change the Slidingmenu animation

Slidingmenu supports the definition of different animations, including stretching, zooming, rotating, and so on, when left or right-sliding. It is the animation that slidingmenu how to appear during the sliding process.
Animation is also easy to use
First define Canvastransformer Mtransformer; variables:

[Java]View Plaincopyprint?

1. mtransformer = new canvastransformer ()  {  
2. @Override   
3. < span class= "keyword" >public void transformcanvas (canvas canvas, float percentopen)  {  
4. float)   (Percentopen*0.25 +  0.75)   
5. canvas.scale ( Scale, scale, canvas.getwidth ()/2, canvas.getheight ()/ 2)   
6. }  
7. };  

Mtransformer = new Canvastransformer () {@Overridepublic void Transformcanvas (canvas canvas, float percentopen) {float SCA Le = (float) (percentopen*0.25 + 0.75); Canvas.scale (scale, scale, canvas.getwidth ()/2, Canvas.getheight ()/2);}};
Then set the Mtransformer object to Slidingmenu, which is the Zoom animation:

[Java]View Plaincopyprint?

2. Private void Initslidupcanvastransformer () {
4. Mtransformer = New Canvastransformer () {
8. @Override
10. Public void Transformcanvas (canvas canvas, float percentopen) {
12. Canvas.translate (0, Canvas.getheight () * (1-interp.getinterpolation (Percentopen)));
14. }
16. };
18. }
22. Private static Interpolator Interp = new Interpolator () {
24. @Override
26. Public float getinterpolation (float t) {
28. T-= 1.0f;
30. return T * t * t + 1.0f;
32. }
34. };

private void Initslidupcanvastransformer () {Mtransformer = new Canvastransformer () {@Overridepublic void Transformcanvas (canvas canvas, float percentopen) {canvas.translate (0, Canvas.getheight () * (1- Interp.getinterpolation (Percentopen)));}};}  private static Interpolator Interp = new Interpolator () {@Overridepublic float getinterpolation (float t) {t-= 1.0f;return T * t * + 1.0f;}}; Stretch animations:

[Java]View Plaincopyprint?

1. Mtransformer = New Canvastransformer () {
2. @Override
3. Public void Transformcanvas (canvas canvas, float percentopen) {
4. Canvas.scale (Percentopen, 1, 0, 0);
5. }
6. });