Custom SlidingMenu component

Custom SlidingMenu component

I learned the custom slidingmenu component on the Internet. The key points are recorded here.

 

SlidingMenu is actually a HorizontalScrollView, which has two la S. You can override several methods to achieve the slide effect.

First, the principle is that HorizontalScrollView is nested outside LinearLayout, and SlidingMenu inherits HorizontalScrollView.

Override onMeasure (int widthMeasureSpec, int heightMeasureSpec), onLayout (boolean changed, int l, int t, int r, int B), onTouchEvent (MotionEvent ev) Method

Below is the code

 

Package com. example. slidingmenudemo. widget; import android. content. context; import android. content. res. typedArray; import android. util. attributeSet; import android. view. motionEvent; import android. view. viewGroup; import android. widget. horizontalScrollView; import android. widget. linearLayout; import com. example. slidingmenudemo. r; import com. example. slidingmenudemo. utils. screenUtils; import com. nineoldandroids. View. viewHelper; public class SlidingMenu extends HorizontalScrollView {// screen width private int mScreenWidth; // menu width private int mMenuWidth; // half menu width private int mHalfMenuWidth; // The width (pixel) of the menu to the right is private int mMenuRightPadding; // The width (dp) of the menu to the right is private float mdefamenmenurightpaddingdp = 150f; // whether to load private boolean firstIn = true for the first time; private boolean isOpen = false; private ViewGroup menu; private ViewGroup cont Ent; public SlidingMenu (Context context, AttributeSet attrs) {super (context, attrs); mScreenWidth = ScreenUtils. getScreenWidth (context); TypedArray typedArray = context. obtainStyledAttributes (attrs, R. styleable. slidingMenu); int n = typedArray. getIndexCount (); for (int I = 0; I <n; I ++) {int attr = typedArray. getIndex (I); switch (attr) {case R. styleable. slidingMenu_rightPadding: mMenuRightPadding = typed Array. getDimensionPixelOffset (attr, ScreenUtils. dp2px (context, mdefamenmenurightpaddingdp); break ;}}@ Overrideprotected void onMeasure (int widthMeasureSpec, int heightMeasureSpec) {// if it is loaded for the first time, content) width resetting (note that all are in pixels) if (firstIn) {LinearLayout wrapper = (LinearLayout) getChildAt (0); menu = (ViewGroup) wrapper. getChildAt (0); content = (ViewGroup) wrapper. getChildAt (1); mMenuWidth = mScree NWidth-mMenuRightPadding; mHalfMenuWidth = mMenuWidth/2; menu. getLayoutParams (). width = mMenuWidth; content. getLayoutParams (). width = mScreenWidth;} super. onMeasure (widthMeasureSpec, heightMeasureSpec);} @ Overrideprotected void onLayout (boolean changed, int l, int t, int r, int B) {super. onLayout (changed, l, t, r, B); if (changed) {// hide the menu this. scrollTo (mMenuWidth, 0); firstIn = false ;}}@ Overridepubl Ic boolean onTouchEvent (MotionEvent ev) {ev. getAction (); switch (ev. getAction () {case MotionEvent. ACTION_UP: if (getScrollX ()> mHalfMenuWidth) {// open the menu this. smoothScrollTo (mMenuWidth, 0); isOpen = true;} else {// close the menu this. smoothScrollTo (0, 0); isOpen = false;} return true;} return super. onTouchEvent (ev);} // open Menupublic void openMenu () {if (! IsOpen) {this. smoothScrollTo (0, 0); isOpen = true ;}// open Menupublic void closeMenu () {if (isOpen) {this. smoothScrollTo (mMenuWidth, 0); isOpen = false; }}// switch menu status public void toggle () {if (isOpen) {this. smoothScrollTo (mMenuWidth, 0); isOpen = false;} else {this. smoothScrollTo (0, 0); isOpen = true ;}}}

 

Attrs. xml

 

Layout main. xml

 

 

Notes:

1. Code operations all use px, so we need to convert dp into pixels for computation. Thank you.

2. The HorizontalScrollView's smoothScrollTo (mMenuWidth, 0) method jumps to the start content layout.

3. Rewrite onMeasure () to reset the width of the menu and content layout. Here, the distance between the menu and the right side is a custom attribute.

 

To create a custom component, follow these steps:

I. Write Layout

2. Write the java class. Generally, the name is the name of the custom component. Here, write some operations on the layout.

3. If you need to customize attributes, declare an attribute parameter similar to this in attr. xml to clearly define the name and type of each attribute.

 

4. Get the Custom Attributes written in the layout file from the custom components

 

 

TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.SlidingMenu); int n = typedArray.getIndexCount(); for (int i = 0; i < n; i++) { int attr = typedArray.getIndex(i); switch (attr) { case R.styleable.SlidingMenu_rightPadding: mMenuRightPadding = typedArray.getDimensionPixelOffset(attr, ScreenUtils.dp2px(context, mDefaultMenuRightPaddingDp)); break; } }

This code is very fixed. Remember, or take it easy.

 

4. Remember to add the custom attribute namespace in the layout.

 

xmlns:menu=http://schemas.android.com/apk/res/com.example.slidingmenudemo

The source code is basically on the top. If you have any project code, please leave a mailbox. I will send it after seeing it.