Android基础---PopupWindow实现漂亮的搜索

当初做毕业设计的时候,就在毕业设计 App 上面实现了该功能,当初只是简单的堆积代码,代码都是从别处拷贝了,对具体代码的意思也不是很清楚,现在做了一个简单的开源项目,也实现了该搜索功能,现在对 PopupWindow 有了更新的认识。

本文会一步一步的教你实现效果图中的效果,包会。。。如果还是不会的话,欢饮点击下面的链接去看看我的项目中怎么用的。

我的开源项目:Gank.io客户端
App 下载地址 :App下载 密码:ckgd

效果图

搜索框

一步步的具体实现

1. 搜索框和搜索按钮的背景

在 drawable 文件夹下新建文件 editsharp.xml




    
    
    
    
    


2.修改 EditText 光标的颜色

在 drawable 文件夹下新建文件 color_cursor.xml



    
    

3.新建 PopupWindow 的布局文件

在 layout文件夹下新建文件 search_popup.xml




    

        
    


    

    

4. 为 PopupWindow 设置的动画

在 res 下面新建 anim 文件夹。

  • 新建 inuptodown.xml


    

  • 新建 outdowntoup.xml


    

然后在 styles 文件里面添加:

    
    

4.初始化 PopupWindow

/**
     * 初始化PopupWindow
     */
    protected void initPopupWindow() {
        final View view = getLayoutInflater().inflate(R.layout.search_popup, null, false);
        int height = commonTitleTb.getHeight(); //  获取当前页面ToolBar的高度
        final EditText searchEt = (EditText) view.findViewById(R.id.search_et);
        popupWindow = new PopupWindow(view, ViewGroup.LayoutParams.MATCH_PARENT, height, true);
        final TextView selectTypeTv = (TextView) view.findViewById(R.id.select_type_tv);
        final RelativeLayout selectTypeRl = (RelativeLayout) view.findViewById(R.id.select_type_rl);
        popupWindow.setFocusable(true);//设置外部点击取消
        popupWindow.setBackgroundDrawable(new BitmapDrawable());// 不设置的话不能关闭此 PopupWindow
        popupWindow.setAnimationStyle(R.style.AnimBottom);
        view.setOnTouchListener(new View.OnTouchListener() {
            @Override
            public boolean onTouch(View v, MotionEvent event) {
                if (popupWindow != null && popupWindow.isShowing()) {
                    popupWindow.dismiss();
                    popupWindow = null;
                }
                return false;
            }
        });

        searchEt.setOnEditorActionListener(new TextView.OnEditorActionListener() {
            @Override
            public boolean onEditorAction(TextView v, int actionId,
                                          KeyEvent event) {
                if (actionId == EditorInfo.IME_ACTION_SEARCH) {
                    String searchContent = searchEt.getText().toString();
                    if (TextUtils.isEmpty(searchContent)) {
                        return false;
                    } else {
                        // todo someThing
                        // getSearchData(selectType, searchContent);
                    }
                    popupWindow.dismiss();
                }
                return false;
            }
        });
        selectTypeRl.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                // todo someThing
            }
        });

        view.findViewById(R.id.search_bt).setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                // todo someThing
                popupWindow.dismiss();
            }
        });
        // PopupWindow的消失事件监听,消失的时候,关闭软键盘
        popupWindow.setOnDismissListener(new PopupWindow.OnDismissListener() {
            @Override
            public void onDismiss() {
                KeyBoardUtils.closeKeybord(context);
            }
        });
    }

获取 PopupWindow 实例

    /**
     * 获取PopipWinsow实例
     */
    private void getPopupWindow() {
        if (null != popupWindow) {
            popupWindow.dismiss();
            return;
        } else {
            initPopupWindow();
        }
    }

5.调用 PopupWindow

getPopupWindow();
// 设置相对View的偏移,1、相对的view,2、相对view的x方向偏移,3、相对view的y方向偏移
popupWindow.showAsDropDown(new View(this), 0, ScreenUtils.getStatusHeight(MainActivity.this));
//打开软键盘
KeyBoardUtils.openKeyboard(new Handler(), 0, context);

至此就可以完成效果图中的效果了。

与此相关的有:

我的第一个开源项目
Android基础之---工具类 持续更新中...
Android基础---淡入淡出、上下弹出动画的
Android PopupWindow详解

  • 我的博客:博客传送门
  • 我的:传送门
  • 我的CSDN:CSDN传送门
  • 我的GitHub:GitHub传送门

你可能感兴趣的:(Android基础---PopupWindow实现漂亮的搜索)