"Android UI design and development" 9: Sliding menu bar (i) Use and examples of open source projects Slidingmenu

I. Introduction of Slidingmenu

I believe that everyone is not unfamiliar with the slidingmenu, it is a relatively new set interface or configuration interface effect, in the main interface left or right slide appear to set the interface effect, can easily carry out a variety of operations. Many good apps use this interface, like Facebook, Renren, Everynote, Google +, and more. As shown in the following:

Because the effect is really relatively new, so in a lot of application development to achieve this effect, the solution is different. Many comparisons are made later

Now, or the open source project on GitHub, Slidingmenu offers the best possible implementation: flexible customization, a variety of shades and gradients, and animations that have a good sliding effect. But this is an open source library, not a complete project, to introduce it as a libary into your own project, simple configuration can achieve slidingmenu effect.

Second, the use of Slidingmenu

Slidingmenu_library:https://github.com/yexiaochao/slidingmenu_library

To be able to achieve the Slidingmenu effect, you first have to import it as a libary into your project

1. After the download is complete, import this project into the Eclipse development environment

2. After importing the project, then create a new Android project and import the slidingmenu_library into the new Android project with the following steps:

<1> Right click on the new Android project and click on the "Properties" option at the bottom.

<2> Click the "Android" option on the left and then click the "Add" button at the bottom right after clicking on the popup dialog box.

<3> Click the pop-up dialog to select the previously imported Slidingmenu_library project

<4> after selection;

<5> This shows that the import library has been successful, and after the successful import, a Slidingmenu_library.jar package will appear in the Android reference package;

Note: Here's a place to pay special attention, after the new Android project is created, the newer version of Eclipse will generate a Libs folder in the Android directory. Inside there will be a Android-support-v4.jar jar package, this jar must remember to delete, or run the program when there will be an exception, the hint is not found the class exception. The reason for the exception is because when you import the Slidingmenu_library class library, This class library itself contains the Android-support-v4.jar jar package, so when the runtime will be abnormal, the system does not know which path to call the next package, so the program crashes, the hint can not find the class.

Iii. Examples of Slidingmenu

1. Film (GIF image is larger, 3.6M)

2. Code explanation

1. Project Structure Chart

2. Content_frame.xml layout

<? XML version= "1.0" encoding= "Utf-8" ?> <  xmlns:android= "http://schemas.android.com/apk/res/android"    android:id = "@+id/menu_frame"     android:layout_width= "Match_parent"    android:layout_height= " Match_parent "/><!-- --

3. Menu_frame.xml Layout

<? XML version= "1.0" encoding= "Utf-8" ?> <  xmlns:android= "http://schemas.android.com/apk/res/android"    android:id = "@+id/menu_frame"     android:layout_width= "Match_parent"    android:layout_height= " Match_parent "/><!-- --

4, List.xml

<?XML version= "1.0" encoding= "Utf-8"?><ListViewxmlns:android= "Http://schemas.android.com/apk/res/android"Android:id= "@android: Id/list"Android:layout_width= "Match_parent"Android:layout_height= "Match_parent"Android:paddingleft= "@dimen/list_padding"Android:paddingright= "@dimen/list_padding" /><!--This list layout file will be used in the listfragment.  -

5, Row.xml

<?XML version= "1.0" encoding= "Utf-8"?><LinearLayoutxmlns:android= "Http://schemas.android.com/apk/res/android"Android:layout_width= "Match_parent"Android:layout_height= "50DP"android:orientation= "Horizontal" >    <ImageViewAndroid:id= "@+id/row_icon"Android:layout_width= "50DP"Android:layout_height= "50DP"android:padding= "10DP"android:src= "@drawable/ic_launcher" />    <TextViewAndroid:id= "@+id/row_title"Android:layout_width= "0DP"Android:layout_height= "Match_parent"Android:layout_weight= "1"android:gravity= "Center_vertical"android:padding= "10DP"Android:text= "Medium Text"android:textappearance= "@android: Style/textappearance.medium" /></LinearLayout><!--used to hold the picture and text in the list.  -

6. Shadow.xml Resources

<?XML version= "1.0" encoding= "Utf-8"?><Shapexmlns:android= "Http://schemas.android.com/apk/res/android" >    <GradientAndroid:centercolor= "#11000000"Android:endcolor= "#33000000"Android:startcolor= "#00000000" /></Shape><!--a graphic used to achieve a shadow effect, using a gradient drawing effect.  -

7, Samplelistfragment class

 PackageCom.yanis.slidingmenu;ImportAndroid.content.Context;ImportAndroid.os.Bundle;Importandroid.support.v4.app.ListFragment;ImportAndroid.view.LayoutInflater;ImportAndroid.view.View;ImportAndroid.view.ViewGroup;ImportAndroid.widget.ArrayAdapter;ImportAndroid.widget.ImageView;ImportAndroid.widget.TextView;/*** Underline the menu bar-used to display the list in the interface. */ Public classSamplelistfragmentextendslistfragment { PublicView Oncreateview (layoutinflater inflater, ViewGroup container, Bundle savedinstancestate) {returnInflater.inflate (R.layout.list,NULL); }     Public voidonactivitycreated (Bundle savedinstancestate) {Super. onactivitycreated (savedinstancestate); Sampleadapter Adapter=NewSampleadapter (Getactivity ());  for(inti = 0; I < 20; i++) {Adapter.add (NewSampleitem ("Sample List", Android.        R.drawable.ic_menu_search));    } setlistadapter (adapter); }         Public classSampleadapterextendsArrayadapter<sampleitem> {         PublicSampleadapter (Context context) {Super(Context, 0); }         PublicView GetView (intposition, View Convertview, ViewGroup parent) {            if(Convertview = =NULL) {Convertview= Layoutinflater.from (GetContext ()). Inflate (R.layout.row,NULL); } ImageView icon=(ImageView) Convertview.findviewbyid (R.id.row_icon);            Icon.setimageresource (GetItem (position). Iconres); TextView title=(TextView) Convertview.findviewbyid (r.id.row_title);            Title.settext (GetItem (position). tag); returnConvertview; }    }        Private classSampleitem { PublicString tag;  Public intIconres;  PublicSampleitem (String tag,inticonres) {             This. Tag =tag;  This. Iconres =Iconres; }    }}

8,slidingmenuactivity_1,slidingmenuactivity_2 and other categories

These classes are settings for the properties of the Slidingmenu, and the following is a simple, detailed view of the source code .

 PackageCom.yanis.slidingmenu;ImportAndroid.os.Bundle;Importandroid.support.v4.app.FragmentActivity;ImportCom.jeremyfeinstein.slidingmenu.lib.SlidingMenu;/** *  * @authorYechao * @ explains a simple effect of placing a slide menu bar on the left*/ Public classSlidingmenuactivity_2extendsfragmentactivity {Privateslidingmenu menu; @Overrideprotected voidonCreate (Bundle savedinstancestate) {Super. OnCreate (savedinstancestate); //Set TitleSettitle ("Attach"); //Initialize the swipe menuInitslidingmenu (); }    /*** Initialize sliding menu*/    Private voidInitslidingmenu () {//Setting the main interface viewSetcontentview (r.layout.content_frame); Getsupportfragmentmanager (). BeginTransaction (). replace (R.id.content_frame,Newsamplelistfragment ()). commit (); //Set property values for a slide menumenu =NewSlidingmenu ( This);        Menu.settouchmodeabove (Slidingmenu.touchmode_fullscreen);        Menu.setshadowwidthres (R.dimen.shadow_width);        Menu.setshadowdrawable (R.drawable.shadow);        Menu.setbehindoffsetres (R.dimen.slidingmenu_offset); Menu.setfadedegree (0.35f); Menu.attachtoactivity ( This, slidingmenu.sliding_content); //set the view interface for the slide menuMenu.setmenu (r.layout.menu_frame); Getsupportfragmentmanager (). BeginTransaction (). replace (R.id.menu_frame,Newsamplelistfragment ()). commit (); } @Override Public voidonbackpressed () {//Click the Back button to close the swipe menu        if(Menu.ismenushowing ()) {menu.showcontent (); } Else {            Super. onbackpressed (); }    }}

Source code Address: Https://github.com/YeXiaoChao/Yc_ui_slidingmenu

This address: http://www.cnblogs.com/yc-755909659/p/4306938.html

SOURCE article:

http://blog.csdn.net/yangyu20121224/article/details/9255829

http://blog.csdn.net/yangyu20121224/article/details/9258275

"Android UI design and development" 9: Sliding menu bar (i) Use and examples of open source projects Slidingmenu