android2.2的弹窗控件,Android开发小知识2—弹窗

前言

弹窗是指打开网页、软件、手机APP等的时候自动弹出的窗口，目前主要流行的弹出方式是快速进入网页游戏的快捷途径。 在android弹窗是非常常见与实用的控件，相信很多朋友都使用过弹窗。这篇文章想和大家分享一下弹窗的相关知识。

弹窗的分类和区别

弹窗分为模态弹窗和非模态弹窗两种，这两者最主要的区别在于需不需要用户对其进行回应。模态弹窗会打断用户的正常操作，要求用户必须对其进行回应，否则不能继续其它操作行为，比如说：Dialog；非模态弹窗则不会影响用户的操作，用户可以不对其进行回应，非模态弹窗通常都有时间限制，出现一段时间后就会自动消失，比如说：Toast。

弹窗分类

根据模态弹窗和非模态弹窗的区别，当只是需要告知用户信息，不需要用户操作，一般设计为非模态弹窗；需要用户进行一定的操作时我们使用模态弹窗。

仿IOS 的Dialog

IOS和Android在弹窗方面有一些不同，但是在实际开发中，设计者往往偏向于IOS的弹窗设计。所以，对于Android开发者，势必要学习几种常见的仿IOS弹窗。这里给大家介绍一种的仿IOS的Dialog。

布局文件，在这了可以修改dialog的式样。

xmlns:tools="http://schemas.android.com/tools"

android:layout_width="match_parent"

android:layout_height="match_parent">

android:id="@+id/background_image"

android:layout_width="match_parent"

android:layout_height="match_parent"

android:background="@color/transparent_half"

android:scaleType="fitXY" />

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:layout_centerInParent="true"

android:layout_marginLeft="@dimen/margin40"

android:layout_marginRight="@dimen/margin40"

android:background="@drawable/shape_frame_gray_background_white">

android:id="@+id/dialog_title"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_centerHorizontal="true"

android:layout_marginEnd="@dimen/margin10"

android:layout_marginStart="@dimen/margin10"

android:layout_marginTop="@dimen/margin20"

android:gravity="center"

android:textColor="@color/dark_gray"

android:textSize="@dimen/text_size17"

tools:text="Logout" />

android:id="@+id/dialog_content"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_below="@+id/dialog_title"

android:layout_centerHorizontal="true"

android:layout_marginBottom="@dimen/margin30"

android:layout_marginEnd="@dimen/margin10"

android:layout_marginStart="@dimen/margin10"

android:layout_marginTop="@dimen/margin30"

android:gravity="center"

android:textColor="@color/dark_gray"

android:textSize="@dimen/text_size13"

tools:text="Are you sure you want to log out?" />

android:id="@+id/line_transverse"

android:layout_width="match_parent"

android:layout_height="@dimen/height1"

android:layout_below="@+id/dialog_content"

android:background="@color/gray_dialog" />

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:layout_below="@+id/line_transverse">

android:id="@+id/right_button"

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:layout_alignParentEnd="true"

android:layout_toEndOf="@+id/line_vertical"

android:background="@color/transparent"

android:text="@string/dialog_yes"

android:textAllCaps="false"

android:textColor="@color/blue"

android:textSize="@dimen/text_size17" />

android:id="@+id/line_vertical"

android:layout_width="@dimen/height1"

android:layout_height="@dimen/layout_height54"

android:layout_centerInParent="true"

android:background="@color/gray_dialog" />

android:id="@+id/left_button"

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:layout_toStartOf="@+id/line_vertical"

android:background="@color/transparent"

android:text="@string/dialog_no"

android:textAllCaps="false"

android:textColor="@color/blue"

android:textSize="@dimen/text_size17" />

在IOS中，背景模糊是非常常见的。想要达到这一目的，最常见的做法是对此页面进行切图，在对图片进行模糊。操作实在麻烦，因此我使用了半透明颜色来代替。当然，如果需求确实需要，也可以做比较复杂的操作。

#d9ffffff

边缘灰色线的shapeshape_frame_gray_background_white如下：

android:width="1dp"

android:color="@color/gray_hint" />

布局已经Ok，定义仿IOS的dialog文件如下：

public class LikeIosDialog extends Dialog {

public LikeIosDialog(Context context, int theme) {

super(context, theme);

}

public void onDismiss() {

if (isShowing()) {

dismiss();

}

}

public static class Builder {

private Button leftButton;

private Button rightButton;

private TextView dialogTitle;

private TextView dialogContent;

private View lineVertical;

private String message;

private String title;

private String leftButtonText;

private String rightButtonText;

private View.OnClickListener leftButtonClickListener;

private View.OnClickListener rightButtonClickListener;

private boolean isSingle = false;

private View layout;

private LikeIosDialog dialog;

public Builder(Context context) {

dialog = new LikeIosDialog(context, R.style.Dialog);

LayoutInflater inflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);

layout = inflater.inflate(R.layout.layout_dialog, null);

dialog.addContentView(layout, new ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT));

dialog.setContentView(layout);

dialog.setCancelable(true);

dialog.setCanceledOnTouchOutside(false);

}

public LikeIosDialog createDialog() {

initView();

setText();

setEvent();

return dialog;

}

private void initView() {

leftButton = (Button) layout.findViewById(R.id.left_button);

rightButton = (Button) layout.findViewById(R.id.right_button);

dialogContent = (TextView) layout.findViewById(R.id.dialog_content);

dialogTitle = (TextView) layout.findViewById(R.id.dialog_title);

lineVertical = layout.findViewById(R.id.line_vertical);

}

private void setText() {

if (isSingle) {

leftButton.setVisibility(View.GONE);

lineVertical.setVisibility(View.GONE);

} else {

leftButton.setVisibility(View.VISIBLE);

lineVertical.setVisibility(View.VISIBLE);

}

dialogContent.setText(message);

leftButton.setText(leftButtonText);

rightButton.setText(rightButtonText);

dialogTitle.setText(title);

}

private void setEvent() {

leftButton.setOnClickListener(leftButtonClickListener);

rightButton.setOnClickListener(rightButtonClickListener);

}

public Builder setMessage(String message) {

this.message = message;

return this;

}

public Builder setTitle(String title) {

this.title = title;

return this;

}

public Builder setLeftButton(String leftButtonText, View.OnClickListener leftButtonClickListener) {

this.leftButtonText = leftButtonText;

this.leftButtonClickListener = leftButtonClickListener;

return this;

}

public Builder setRightButton(String rightButtonText, View.OnClickListener rightButtonClickListener) {

this.rightButtonText = rightButtonText;

this.rightButtonClickListener = rightButtonClickListener;

return this;

}

public Builder isSingleButton(boolean isSingleButton) {

this.isSingle = isSingleButton;

return this;

}

public Builder setSingleButton(String rightButtonText, View.OnClickListener rightButtonClickListener) {

this.rightButtonText = rightButtonText;

this.rightButtonClickListener = rightButtonClickListener;

return this;

}

}

@Override

public boolean onKeyDown(int keyCode, KeyEvent event) {

if (keyCode == KeyEvent.KEYCODE_BACK) {

dismiss();

}

return super.onKeyDown(keyCode, event);

}

}

到此，自定义仿IOS的Dialog已经完成了，我们简单的使用一下吧。

private BukkaDialog.Builder deleteDialogBuilder;

private BukkaDialog deleteDialog;

deleteDialogBuilder = new BukkaDialog.Builder(this);

deleteDialog = deleteDialogBuilder

.setTitle(getString(R.string.dialog_title))

.setMessage(getString(R.string.dialog_content))

.isSingleButton(false)

.setRightButton(getString(R.string.ok), v1 -> {

//TODO something

deleteDialog.onDismiss();

})

.setLeftButton(getString(R.string.cancel), v12 -> deleteDialog.onDismiss())

.createDialog();

deleteDialog.show();

一起来看看最终的效果吧，还不错。

最终效果

小结

这里我只提供了大部分核心代码，希望对广大安卓开发者有所帮助。也希望通过这个例子，更加清楚的认识到弹窗的知识。在这篇文章中，我自定义了一个仿IOS的Dialog，在android开发者，自定义View是一块非常实用的知识。下一期我想和大家分享的是：Android自定义View。