實現android自定義下拉選擇框，可隨意更改樣式

先看效果圖是否合口

在登錄界面選擇角色，上下箭頭是會變化的，默認是選擇學生，當選擇老師時，對應的icon、文字相應的改變（樣式可以隨意更改）。

使用的是RecycleView+自定義適配器+PopupWindow實現的：

1.準備好一個item_login_role.xml

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/cl_item_loginRole_view"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:paddingBottom="@dimen/spacing_5"
    android:background="@color/login_role_bg">

    <ImageView
        android:id="@+id/iv_item_loginRole"
        android:layout_width="@dimen/spacing_22"
        android:layout_height="@dimen/spacing_22"
        android:layout_marginLeft="@dimen/spacing_32"
        android:layout_marginTop="@dimen/spacing_12"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"/>

    <TextView
        android:id="@+id/tv_item_loginRole"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="@dimen/spacing_9"
        android:textSize="@dimen/font_15"
        android:textColor="@color/text_black1"
        app:layout_constraintLeft_toRightOf="@id/iv_item_loginRole"
        app:layout_constraintTop_toTopOf="@+id/iv_item_loginRole"
        app:layout_constraintBottom_toBottomOf="@+id/iv_item_loginRole"/>

</android.support.constraint.ConstraintLayout>

 2.自定義適配器LoginRoleAdapter

/**
 * 登錄角色選擇時
 * Created by Administrator on 2019/11/19
 *
 * @author mcl
 */
public class LoginRoleAdapter extends RecyclerView.Adapter {
    private Context mContext;
    private List<RoleBean> mList;
    private int selected = -1;
    private OnItemClickLitener mOnItemClickListener;

   public interface OnItemClickLitener {//點擊事件回調
        void onItemClick(View view, int position);
    }

    public LoginRoleAdapter(Context context, List<RoleBean> list) {
        this.mContext = context;
        this.mList = list;
    }

    public void setmOnItemClickListener(OnItemClickLitener mOnItemClickListener) {
        this.mOnItemClickListener = mOnItemClickListener;
    }

    @NonNull
    @Override
    public RecyclerView.ViewHolder onCreateViewHolder(@NonNull ViewGroup viewGroup, int i) {
        View view = LayoutInflater.from(viewGroup.getContext()).inflate(R.layout.item_login_role, viewGroup, false);
        return new LoginRoleViewHolder(view);
    }

    @Override
    public void onBindViewHolder(@NonNull RecyclerView.ViewHolder holder, int i) {
       if (holder instanceof LoginRoleViewHolder){
           final  LoginRoleViewHolder viewHolder=(LoginRoleViewHolder)holder;
           viewHolder.tvRole.setText(mList.get(i).getRoleName());
           viewHolder.ivRole.setBackgroundResource(ResUtils.getId(mContext,mList.get(i).getRoleIcon(),ResUtils.MIPMAP));
           if (null!=mOnItemClickListener){
               viewHolder.cl.setOnClickListener(new View.OnClickListener() {
                   @Override
                   public void onClick(View view) {
                       mOnItemClickListener.onItemClick(viewHolder.itemView,viewHolder.getAdapterPosition());
                   }
               });
           }
       }

    }

    @Override
    public int getItemCount() {
        if (null != mList && mList.size() > 0) {
            return mList.size();
        } else {
            return 0;
        }
    }

    class LoginRoleViewHolder extends RecyclerView.ViewHolder {
        private ConstraintLayout cl;
        private ImageView ivRole;
        private TextView tvRole;

        public LoginRoleViewHolder(@NonNull View itemView) {
            super(itemView);
            cl = itemView.findViewById(R.id.cl_item_loginRole_view);
            ivRole = itemView.findViewById(R.id.iv_item_loginRole);
            tvRole = itemView.findViewById(R.id.tv_item_loginRole);

        }
    }
}

3.在activity裏面：填充數據，及選擇後回調，顯示相應的文字、icon……

private RecyclerView recyclerView;

  RoleBean role = new RoleBean();
        role.setRoleName(this.getString(R.string.module_app_login_login_teacher_role));
        role.setRoleIcon("login_teacher_btn");
        role.setUserrole("S03");
        roleList.add(role);
        RoleBean role1 = new RoleBean();
        role1.setRoleName(this.getString(R.string.module_app_login_login_parent_role));
        role1.setRoleIcon("login_parent_btn");
        role.setUserrole("S04");
        roleList.add(role1);

        LoginRoleAdapter adapter = new LoginRoleAdapter(this, roleList);
        recyclerView = new RecyclerView(this);
        recyclerView.setVerticalScrollBarEnabled(false);//隱藏滾動條
        recyclerView.setAdapter(adapter);
        recyclerView.setLayoutManager(new LinearLayoutManager(this));
        adapter.setmOnItemClickListener(new LoginRoleAdapter.OnItemClickLitener() {
            @Override
            public void onItemClick(View view, int position) {
                binding.tvLoginRole.setText(roleList.get(position).getRoleName());//設置選擇的角色
                binding.ivLoginRole.setBackgroundResource(ResUtils.getId(LoginActivity.this, roleList.get(position).getRoleIcon(), ResUtils.MIPMAP));  //設置選擇角色對應的icon             
                userrole=roleList.get(position).getUserrole();//獲取選擇的角色
                window.dismiss();
            }
        });

 

 4.登錄界面的佈局這裏就省略了（不要在佈局裏面放icon，不然會重疊，在對應代碼裏面放），點擊時，創建PopupWindow

項目用到的是dataBinding數據綁定，binding.ivLoginDirection指的是圖標ImageView控件。

    /**
     * 選擇角色點擊事件
     *
     * @param view
     */
    public void clickRole(View view) {
        binding.ivLoginDirection.setBackgroundResource(ResUtils.getId(this, "login_arrow_up", ResUtils.MIPMAP));//向上的圖標
        if (window == null) {
        //在binding.rlLoginRole控件下顯示PopupWindow，一般長度就跟它一樣，所以參數2是這麼寫的
            window = new PopupWindow(recyclerView, binding.rlLoginRole.getWidth(), RecyclerView.LayoutParams.WRAP_CONTENT);
        }
        window.setFocusable(true);//要讓其中的view獲取焦點，必須設置爲true
        window.setOutsideTouchable(true);//設置點擊外部消失
        window.showAsDropDown(binding.rlLoginRole, 0, 0);//binding.rlLoginRole要在哪個控件下顯示
       window.setOnDismissListener(new PopupWindow.OnDismissListener() {//彈窗消失無論點擊內外部，箭頭都變成向下
            @Override
            public void onDismiss() {
                binding.ivLoginDirection.setBackgroundResource(ResUtils.getId(LoginActivity.this, "login_arrow_down", ResUtils.MIPMAP));
            }
        });
    }

5.補充RoleBean就三個屬性，進行get、set方法即可，如下：

/**
 * Created by Administrator on 2019/11/19
 *
 * @author mcl
 */
public class RoleBean {
    private String roleIcon;
    private String roleName;
    private String userrole;

    public String getRoleIcon() {
        return roleIcon;
    }

    public void setRoleIcon(String roleIcon) {
        this.roleIcon = roleIcon;
    }

    public String getRoleName() {
        return roleName;
    }

    public void setRoleName(String roleName) {
        this.roleName = roleName;
    }

    public String getUserrole() {
        return userrole;
    }

    public void setUserrole(String userrole) {
        this.userrole = userrole;
    }
}

 

用了最笨的方法，雖然能滿足需求，但是不夠優化，有更好的方式，可以幫提點一下，感激不盡！