Android component-based development (1) -- reusable pop-up menus

Android component-based development (1) -- reusable pop-up menus

Component-based development and integration with android

**

Introduction

**
Applications with pop-up menus at the bottom can often be seen in the app, such as the choice of mobile QQ and Avatar. This component is very common. Therefore, after this component is encapsulated, you can use this function as easily as using android native view, greatly improving the scalability and maintainability of the program.

(1) effect implementation

Step 1: implement the pop-up menu at the bottom.
In android, menus can be implemented by dialog and popupwindow. Here we use popupwindow to achieve our results.

Popupwindow implementation pop-up box code:

View view = mInflater. inflate (R. layout. bottom_pop_window, null); mPopupWindow = new PopupWindow (view, ScreenUtil. getScreenWidth (mContext), LinearLayout. layoutParams. WRAP_CONTENT); // listen to the dismiss of PopupWindow. When dismiss is enabled, the screen brightness is restored to mPopupWindow. setOnDismissListener (new PopupWindow. onDismissListener () {@ Override public void onDismiss () {params. alpha = 1.0f; window. setAttributes (params) ;}}); mPopupWindow. setWidth (LayoutParams. MATCH_PARENT); mPopupWindow. setHeight (LayoutParams. WRAP_CONTENT); mPopupWindow. setBackgroundDrawable (new BitmapDrawable (); mPopupWindow. setTouchable (true); mPopupWindow. setFocusable (true); mPopupWindow. setOutsideTouchable (true); // The animation displays the mPopupWindow from the bottom. setAnimationStyle (R. style. popWindow_animation );

Bottom_pop_zookeeper XML indicates the custom layout.

Bottom_pop_zookeeper XML

Generally, when the bottom menu is displayed, the screen is dimmed. When the menu disappears, the screen brightness is restored. Dialog has its own effect, but popupwindow does not. Therefore, we need to implement this effect on our own. The specific steps are as follows:

Obtain the windowManager object:
WindowManager windowManager = context. getWindowManager ();
2. Obtain the LayoutParams object of the Window object and window: Window window = context. getWindow ();
LayoutParams params =
Context. getWindow (). getAttributes (); change params. alpha = 1.0f to adjust the screen brightness.

(2) encapsulated Components

It is not enough to achieve the effect. Just think that every time you use this control, you need to write a lot of code, many of which are repeated and unnecessary. We can extract the same part of the code, encapsulate the code, and expose different parts of the Code for external customization.
**

Analysis

**
For analysis, each time this component is used, the difference is nothing more than the text in the button and the corresponding events after the button is clicked. In the same case, the dialog box is created and disappears. Therefore, we can split different parts and use them as interfaces for external callback.

**

Encapsulation ing

**
First, create a BottomPopView class, encapsulate the creation of popupwindow and a series of initialization operations internally, and provide some callback methods for external Custom button text and events.

BottomPopView. class

Public abstract class implements {private Context mContext; private View anchor; private LayoutInflater mInflater; private TextView mTvTop; private TextView mTvBottom; private TextView mTvCancel; private PopupWindow parent; LayoutParams params; WindowManager windowManager; window window;/*** @ param context * @ param anchor under which View */public BottomPopView (Activity context, View anchor) {This. mContext = context; this. mInflater = LayoutInflater. from (context); this. anchor = anchor; windowManager = context. getWindowManager (); window = context. getWindow (); params = context. getWindow (). getAttributes (); init ();} public void init () {View view = mInflater. inflate (R. layout. bottom_pop_window, null); params. dimAmount = 0.5f; window. addFlags (LayoutParams. FLAG_DIM_BEHIND); mTvBottom = (T ExtView) view. findViewById (R. id. TV _choose_photo); mTvTop = (TextView) view. findViewById (R. id. TV _take_photo); mTvCancel = (TextView) view. findViewById (R. id. TV _cancel); mTvTop. setOnClickListener (new View. onClickListener () {@ Override public void onClick (View arg0) {// TODO Auto-generated method stub onTopButtonClick () ;}}); mTvBottom. setOnClickListener (new View. onClickListener () {@ Override public Void onClick (View arg0) {// TODO Auto-generated method stub onBottomButtonClick () ;}}); mTvCancel. setOnClickListener (new View. onClickListener () {@ Override public void onClick (View v) {dismiss () ;}}); mPopupWindow = new PopupWindow (view, ScreenUtil. getScreenWidth (mContext), LinearLayout. layoutParams. WRAP_CONTENT); // listen to the dismiss of PopupWindow. When dismiss is enabled, the screen brightness is restored to mPopupWindow. setOnDismissListener (new P OpupWindow. onDismissListener () {@ Override public void onDismiss () {params. alpha = 1.0f; window. setAttributes (params) ;}}); mPopupWindow. setWidth (LayoutParams. MATCH_PARENT); mPopupWindow. setHeight (LayoutParams. WRAP_CONTENT); mPopupWindow. setBackgroundDrawable (new BitmapDrawable (); mPopupWindow. setTouchable (true); mPopupWindow. setFocusable (true); mPopupWindow. setOutsideTouchable (true); // animation effect from MPopupWindow pops up at the bottom. setAnimationStyle (R. style. popWindow_animation);}/*** display the bottom dialog box */public void show () {mPopupWindow. showAtLocation (anchor, Gravity. BOTTOM, 0, 0); params. alpha = 0.5f; window. setAttributes (params);}/*** callback of the first button clicked */public abstract void onTopButtonClick (); /*** callback of the second button clicked */public abstract void onBottomButtonClick (); public void setTopText (String text) {mTvTop. setText (te Xt);} public void setBottomText (String text) {mTvBottom. setText (text);} public void dismiss () {if (mPopupWindow! = Null & mPopupWindow. isShowing () {mPopupWindow. dismiss ();}}}

The setTopText and setBottomText methods are provided to enable the text of the externally set button. The onTopButtonClick and onBottomButtonClick callback methods enable the externally implemented button click events.

Used like a system native View

Next, the use of our BottomPopView is quite simple, just as easy as using the system's Dialog.

// The layout photo pops up at the bottom and selects the image bottomPopView = new BottomPopView (this, root) {@ Override public void onTopButtonClick () {// take a photo takePhoto ();} @ Override public void onBottomButtonClick () {// select the local image choosePhoto () ;}}; bottomPopView. setTopText (photograph); bottomPopView. setBottomText (select image); // display the bottom menu bottomPopView. show ();

Now, you can use the pop-up menu at the bottom, which can be easily completed by just a few lines of code.