美文网首页Android自定义控件AndroidAndroid工具类
『自定义View实战』—— 银行种类选择器

『自定义View实战』—— 银行种类选择器

作者: 下位子 | 来源:发表于2018-01-19 16:32 被阅读332次

    在工作中难免遇到自定义 View 的相关需求,本身这方面比较薄弱,因此做个记录,也是自己学习和成长的积累。自定义View实战

    前言

    年前的最后一个开发需求,将之前H5开卡界面转变成native。意思就是开卡这个需求做成Android原生的界面,就这单单一个界面需要请求 8 个接口!可想逻辑是有多复杂,其中中间有个小需求-「选择银行卡」。来看一下UI出图。

    设计图

    大致就是点击「银行」弹出popupWindow,在里面嵌套一个银行选择器。这个「银行选择器」可以滚动类似IOS那边的UIPickerView,或者安卓的日期选择器,但是为了完成特殊的定制效果,所以咱们得自己写一个。BankPickerView

    看一下效果图:

    BankPickerView.gif

    实现

    思路其实也很简单。

    滚动

    ScrollViewListViewRecyclerView都可以实现滚动,这自然不用说,首尾都有offset个位置是留占坑,可以添加空数据作为占坑的显示。

    回弹

    那就在手指松开的时候,拿到滑动的距离,通过一系列的逻辑处理,回弹到最近的Item处即可。

    回调

    在滑动停止的时候,通过计算获取当前所处的item的位置,通过listener回调给调用者。

    因为时间有限,所以没对其进行封装,如果想使用请自行下载,通过修改源码满足特定的需求。

    至于弹出的效果,用的是popupWindow,其中遇到了一下坑,在这里记录并分享一下。

    背景透明

    popupWindow不像dialog本身是没有背景透明的效果的,需要自己实现。主要就是两种实现方式。

    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:skin="http://schemas.android.com/android/skin"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#7D000000"
        skin:enable="true">
    
            <!-- 内容 -->
            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:background="#fff"
                android:layout_alignParentBottom="true"
                android:orientation="vertical">
            </LinerarLayout>
     </RelativeLayout>
    

    一种就是直接在pooupWidnow展示的布局强行假如半透明的背景。

    第二种获取WindowManager修改当前窗口的透明值。

    点击返回关闭 popupWindow

    首先如果想实现点击返回让popupWindow消失,就得实现View.OnKeyListener接口,并且在回调中,让其消失。

    @Override
    public boolean onKey(View v, int keyCode, KeyEvent event) {
        if (keyCode == KeyEvent.KEYCODE_BACK) {
            dismiss();
            return true;
        }
        return false;
    }
    

    但是你会发现并没有生效,那是因为当前没有获取到焦点,需要设置setFocusable(true)即可。

    相关文章

      网友评论

      • 绳_::smirk: 根据银行卡号直接判断是什么银行不是用户更爽 百度一大把 选择作为万一没预留卡号识别序列
        下位子:嗯,也行,主要目的是这个 view,至于其他逻辑就看你自己了:smile:
      • sankemao:厉害了
      • 小之丶:思路部分如果有简单的代码解析就更好啦

      本文标题:『自定义View实战』—— 银行种类选择器

      本文链接:https://www.haomeiwen.com/subject/qoxaoxtx.html