组件使用 - PopupWindow - 《XUI - Android 原生 UI 框架》

XUIPopup

弹出窗是Android中非常重要的组件，它可以给用户予以信息提示、选择，增强用户交互体验。

XUIPopup

包括简单的自定义布局的XUIPopup以及内嵌ListView的XUIListPopup和XUISimplePopup。可定义向上弹出和向下弹出，并且弹出的指示箭头是自适应的。

XUIPopup

演示效果

使用案例

mNormalPopup = new XUIPopup(getContext());
TextView textView = new TextView(getContext());
textView.setLayoutParams(mNormalPopup.generateLayoutParam(
        DensityUtils.dp2px(getContext(), 250),
        WRAP_CONTENT
));
textView.setLineSpacing(DensityUtils.dp2px(4), 1.0f);
int padding = DensityUtils.dp2px(20);
textView.setPadding(padding, padding, padding, padding);
textView.setText("Popup 可以设置其位置以及显示和隐藏的动画");
textView.setTextColor(ContextCompat.getColor(getContext(), R.color.xui_config_color_sub_title_common_explain_text));
mNormalPopup.setContentView(textView);
mNormalPopup.setOnDismissListener(new PopupWindow.OnDismissListener() {
    @Override
    public void onDismiss() {
        mBtnCommonPopup.setText("显示普通浮层");
    }
});
mNormalPopup.setAnimStyle(XUIPopup.ANIM_GROW_FROM_CENTER);
mNormalPopup.setPreferredDirection(XUIPopup.DIRECTION_TOP);
mNormalPopup.show(v);

常用方法

1.设置自定义布局：setContentView(View root)

2.设置弹窗弹出的动画：setAnimStyle(int animStyle)

3.设置消失的监听：setOnDismissListener(PopupWindow.OnDismissListener listener)

4.设置弹出的方向：setPreferredDirection(int preferredDirection)

XUIListPopup

演示效果

使用案例

String[] listItems = new String[]{
        "Item 1",
        "Item 2",
        "Item 3",
        "Item 4",
        "Item 5",
};
XUISimpleAdapter adapter = XUISimpleAdapter.create(getContext(), listItems);
mListPopup = new XUIListPopup(getContext(), adapter);
mListPopup.create(DensityUtils.dp2px(200), DensityUtils.dp2px(150), new AdapterView.OnItemClickListener() {
    @Override
    public void onItemClick(AdapterView<?> adapterView, View view, int i, long l) {
        ToastUtils.toast("Item " + (i + 1));
        mListPopup.dismiss();
    }
});
mListPopup.setOnDismissListener(new PopupWindow.OnDismissListener() {
    @Override
    public void onDismiss() {
        mBtnListPopup.setText("显示列表浮层");
    }
});
mListPopup.setAnimStyle(XUIPopup.ANIM_GROW_FROM_CENTER);
mListPopup.setPreferredDirection(XUIPopup.DIRECTION_TOP);
mListPopup.show(v);

常用方法

1.创建弹窗：


T create(int width, int maxHeight, AdapterView.OnItemClickListener onItemClickListener)
T create(int width, int maxHeight)
T create(int width)

2.设置是否有分割线：T setHasDivider(boolean hasDivider)

3.设置分割线的资源：T setDivider(Drawable divider)

4.设置分割线的高度：T setDividerHeight(int dividerHeight)

XUISimplePopup

演示效果

使用案例

mMenuPopup = new XUISimplePopup(getContext(), DemoDataProvider.menuItems)
        .create(new XUISimplePopup.OnPopupItemClickListener() {
            @Override
            public void onItemClick(XUISimpleAdapter adapter, AdapterItem item, int position) {
                ToastUtils.toast(item.getTitle().toString());
            }
        });
mMenuPopup.showDown(v);

常用方法

1.设置条目点击监听：T setOnPopupItemClickListener(final OnPopupItemClickListener onItemClickListener)

2.向下显示：showDown(View v)

3.向上显示：showUp(View v)

EasyPopup

对系统的PopupWindow进行的简单代理封装，方便PopupWindow的自定义和操作，支持上、下、左、右4种弹出位置。自定义的PopupWindow可继承BaseCustomPopup轻松实现。

使用案例

mCirclePop = new EasyPopup(getContext())
        .setContentView(R.layout.layout_friend_circle_comment)
        .setFocusAndOutsideEnable(true)
        .createPopup();
TextView tvZan = mCirclePop.getView(R.id.tv_zan);
TextView tvComment = mCirclePop.getView(R.id.tv_comment);
tvZan.setOnClickListener(new View.OnClickListener() {
     @Override
     public void onClick(View v) {
         ToastUtils.toast("点赞");
         mCirclePop.dismiss();
     }
 });
tvComment.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        ToastUtils.toast("评论");
        mCirclePop.dismiss();
    }
});
mCirclePop.showAtAnchorView(mBtnCircleComment, VerticalGravity.CENTER, HorizontalGravity.LEFT, 0, 0);

常用方法

1.设置自定义布局内容


T setContentView(View contentView)；
T setContentView(int layoutId)；
T setContentView(View contentView, int width, int height)

2.设置宽高


T setWidth(int width)；
T setHeight(int height)；

3.设置显示的对齐方式


T setVerticalGravity(@VerticalGravity int verticalGravity)；
T setHorizontalGravity(@VerticalGravity int horizontalGravity)；

4.设置动画的样式


T setAnimationStyle(@StyleRes int animationStyle)；

5.设置是否可以点击PopupWindow之外的地方dismiss


T setFocusAndOutsideEnable(boolean focusAndOutsideEnable)

6.设置监听


T setOnDismissListener(PopupWindow.OnDismissListener listener)
T setOnAttachedWindowListener(OnAttachedWindowListener listener)

7.弹窗显示

（1）相对anchor view显示：

void showAtAnchorView(@NonNull View anchor, @VerticalGravity final int vertGravity, @HorizontalGravity int horizGravity, int x, int y)；

（2）PopupWindow自带的显示方法：

void showAsDropDown(View anchor, int offsetX, int offsetY)；

ViewTooltip

控件提示弹出窗，可自定义弹出的位置，持续时间以及样式。

演示效果

使用案例

ViewTooltip
    .on(mEditText)
    .color(Color.BLACK)
    .position(ViewTooltip.Position.LEFT)
    .text("Some tooltip with long text")
    .clickToHide(true)
    .autoHide(false, 0)
    .animation(new ViewTooltip.FadeTooltipAnimation(500))
    .onDisplay(new ViewTooltip.ListenerDisplay() {
        @Override
        public void onDisplay(View view) {
            ToastUtils.toast("onDisplay");
        }
    })
    .onHide(new ViewTooltip.ListenerHide() {
        @Override
        public void onHide(View view) {
            ToastUtils.toast("onHide");
        }
    })
    .show();

常用方法

1.创建并设置提示控件依附的View：ViewTooltip on(final View view)

2.设置提示显示的相对位置：position(Position position)

3.设置自定义提示布局：customView(View customView)

4.设置提示持续的时间：duration(long duration)

5.设置提示框的背景颜色：color(int color)

6.设置显示和隐藏的监听：


onDisplay(ListenerDisplay listener)；
onHide(ListenerHide listener)；

7.设置间隔的距离：padding(int left, int top, int right, int bottom)

8.设置显示和隐藏的动画：animation(TooltipAnimation tooltipAnimation)

9.设置提示的文字：text(String text)

10.设置圆角的角度：corner(int corner)

11.设置提示文字的颜色：textColor(int textColor)

12.设置提示文字的字体大小：textSize(int unit, float textSize)

13.设置是否点击隐藏：clickToHide(boolean clickToHide)

CookieBar

顶部和底部信息消息显示条, 类似Snackbar,支持自定义布局。

演示效果

使用案例

CookieBar.builder(getActivity())
    .setTitle(R.string.cookie_title)
    .setIcon(R.mipmap.ic_launcher)
    .setMessage(R.string.cookie_message)
    .setLayoutGravity(Gravity.BOTTOM)
    .setAction(R.string.cookie_action, new View.OnClickListener() {
        @Override
        public void onClick(View view) {
            ToastUtils.toast("点击消失！");
        }
    })
    .show();
CookieBar.builder(getActivity())
    .setTitle(R.string.cookie_title)
    .setMessage(R.string.cookie_message)
    .setDuration(3000)
    .setBackgroundColor(R.color.colorPrimary)
    .setActionColor(android.R.color.white)
    .setTitleColor(android.R.color.white)
    .setAction(R.string.cookie_action, new View.OnClickListener() {
        @Override
        public void onClick(View view) {
            ToastUtils.toast("点击消失！");
        }
    })
    .show();

XToast

自定义Toast样式

使用案例

XToast.error(getContext(), R.string.error_message).show();
XToast.success(getContext(), R.string.success_message).show();
XToast.info(getContext(), R.string.info_message).show();
XToast.warning(getContext(), R.string.warning_message).show();
XToast.normal(getContext(), R.string.normal_message_without_icon).show();