一个好看的Dialog样式实现，仿IOS

消息对话框在实现Android原生态开发的过程中是十分重要的。该篇文章将讲述仿IOS的消息对话框的实现。具体代码来源于网路（忘记了具体文章来源）。
实现效果如下图：

该消息对话框的实现主要使用到了listview和Dialog。当点击某个按钮时，弹出Dialog，Dialog上的view由listview实现。这样就实现了一个灵活的可复用的工具Dialog。具体代码如下。
首先给出XML布局文件和背景设置。
XML文件

<!-- dialog的布局view_dialog_select  dialog打开的实际上是这个view -->
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="match_parent"android:layout_height="match_parent"android:background="#00000000"android:gravity="bottom"android:orientation="vertical"android:padding="5dip" ><TextViewandroid:id="@+id/mTv_Title"android:layout_width="match_parent"android:layout_height="68dp"android:layout_marginTop="5dip"android:background="@drawable/dialog_item_bg_only"android:padding="10dip"android:textColor="#0073FF"android:textSize="18sp"android:gravity="center"android:visibility="gone"/><ListViewandroid:id="@+id/dialog_list"android:layout_width="match_parent"android:dividerHeight="0.5dp"android:divider="#DAD9DB"android:layout_marginTop="5dip"android:listSelector="@android:color/transparent"android:cacheColorHint="@android:color/transparent"android:layout_height="wrap_content" ></ListView><Buttonandroid:id="@+id/mBtn_Cancel"android:layout_width="match_parent"android:layout_height="40dp"android:layout_marginTop="5dip"android:background="@drawable/dialog_item_bg_only"android:text="取消"android:gravity="center"android:textColor="#0073FF"android:textSize="18sp" /></LinearLayout>

listview所展示的每个item的布局文件view_dialog_item

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="match_parent"android:layout_height="match_parent"android:orientation="vertical"><TextViewandroid:id="@+id/dialog_item_bt"android:layout_width="match_parent"android:layout_height="40dp"android:gravity="center"android:textColor="#0073FF"android:textSize="18sp" />
</RelativeLayout>

布局文件用到的样式：

dialog_item_bg_buttom

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android"><item android:state_pressed="true"><shape><solid android:color="#CACACB" /><corners android:bottomLeftRadius="5dp" android:bottomRightRadius="5dp" android:topLeftRadius="0dp" android:topRightRadius="0dp" /></shape></item><item><shape><solid android:color="#EBEBEB" /><corners android:bottomLeftRadius="5dp" android:bottomRightRadius="5dp" android:topLeftRadius="0dp" android:topRightRadius="0dp" /></shape></item></selector>

dialog_item_bg_center

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android"><item android:state_pressed="true"><shape><solid android:color="#CACACB" /></shape></item><item><shape><solid android:color="#EBEBEB" /></shape></item></selector>

dialog_item_bg_only

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android"><item android:state_pressed="true"><shape><solid android:color="#CACACB" /><corners android:bottomLeftRadius="5dp" android:bottomRightRadius="5dp" android:topLeftRadius="5dp" android:topRightRadius="5dp" /></shape></item><item><shape><solid android:color="#EBEBEB" /><corners android:bottomLeftRadius="5dp" android:bottomRightRadius="5dp" android:topLeftRadius="5dp" android:topRightRadius="5dp" /></shape></item></selector>

dialog_item_bg_top

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android"><item android:state_pressed="true"><shape><solid android:color="#CACACB" /><corners android:bottomLeftRadius="0dp" android:bottomRightRadius="0dp" android:topLeftRadius="5dp" android:topRightRadius="5dp" /></shape></item><item><shape><solid android:color="#EBEBEB" /><corners android:bottomLeftRadius="0dp" android:bottomRightRadius="0dp" android:topLeftRadius="5dp" android:topRightRadius="5dp" /></shape></item></selector>

上述为所有布局文件和背景设置，最主要的是view_dialog_select布局文件，在该文件中主要声明了一个listview控件。
Dialog的java代码

import android.app.Activity;
import android.app.Dialog;
import android.os.Bundle;
import android.text.TextUtils;
import android.view.LayoutInflater;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.ViewGroup;
import android.view.ViewGroup.LayoutParams;
import android.view.Window;
import android.view.WindowManager;
import android.widget.AdapterView;
import android.widget.AdapterView.OnItemClickListener;
import android.widget.BaseAdapter;
import android.widget.Button;
import android.widget.ListView;
import android.widget.TextView;
import java.util.List;
/*** dialog**/
public class SelectDialog extends Dialog implements OnClickListener,OnItemClickListener {private SelectDialogListener mListener;private Activity mActivity;private Button mMBtn_Cancel;private TextView mTv_Title;private List<String> mName;private String mTitle;private boolean mUseCustomColor = false;private int mFirstItemColor;private int mOtherItemColor;public interface SelectDialogListener {public void onItemClick(AdapterView<?> parent, View view, int position, long id);}private SelectDialogCancelListener mCancelListener;public interface SelectDialogCancelListener {public void onCancelClick(View v);}public SelectDialog(Activity activity, int theme,SelectDialogListener listener,List<String> names) {super(activity, theme);mActivity = activity;mListener = listener;this.mName=names;
// 设置是否点击外围解散setCanceledOnTouchOutside(true);}/*** @param activity 调用弹出菜单的activity* @param theme 主题* @param listener 菜单项单击事件* @param cancelListener 取消事件* @param names 菜单项名称**/public SelectDialog(Activity activity, int theme,SelectDialogListener listener,SelectDialogCancelListener cancelListener ,List<String> names) {super(activity, theme);mActivity = activity;mListener = listener;mCancelListener = cancelListener;this.mName=names;
// 设置是否点击外围不解散setCanceledOnTouchOutside(false);}/*** @param activity 调用弹出菜单的activity* @param theme 主题* @param listener 菜单项单击事件* @param names 菜单项名称* @param title 菜单标题文字**/public SelectDialog(Activity activity, int theme,SelectDialogListener listener,List<String> names,String title) {super(activity, theme);mActivity = activity;mListener = listener;this.mName=names;mTitle = title;
// 设置是否点击外围可解散setCanceledOnTouchOutside(true);}public SelectDialog(Activity activity, int theme,SelectDialogListener listener,SelectDialogCancelListener cancelListener,List<String> names,String title) {super(activity, theme);mActivity = activity;mListener = listener;mCancelListener = cancelListener;this.mName=names;mTitle = title;
// 设置是否点击外围可解散setCanceledOnTouchOutside(true);}@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);View view = getLayoutInflater().inflate(R.layout.view_dialog_select,null);setContentView(view, new LayoutParams(LayoutParams.FILL_PARENT,LayoutParams.WRAP_CONTENT));Window window = getWindow();
// 设置显示动画window.setWindowAnimations(R.style.main_menu_animstyle);WindowManager.LayoutParams wl = window.getAttributes();wl.x = 0;wl.y = mActivity.getWindowManager().getDefaultDisplay().getHeight();
// 以下这两句是为了保证按钮可以水平满屏wl.width = LayoutParams.MATCH_PARENT;wl.height = LayoutParams.WRAP_CONTENT;
// 设置显示位置onWindowAttributesChanged(wl);
//setCanceledOnTouchOutside(false);initViews();}private void initViews() {DialogAdapter dialogAdapter=new DialogAdapter(mName);ListView dialogList=(ListView) findViewById(R.id.dialog_list);dialogList.setOnItemClickListener(this);dialogList.setAdapter(dialogAdapter);mMBtn_Cancel = (Button) findViewById(R.id.mBtn_Cancel);mTv_Title = (TextView) findViewById(R.id.mTv_Title);
//mMBtn_Cancel.setOnClickListener(this);mMBtn_Cancel.setOnClickListener(new View.OnClickListener() {@Overridepublic void onClick(View v) {// TODO Auto-generated method stubif(mCancelListener != null){mCancelListener.onCancelClick(v);}dismiss();}});if(!TextUtils.isEmpty(mTitle) && mTv_Title != null){mTv_Title.setVisibility(View.VISIBLE);mTv_Title.setText(mTitle);}else{mTv_Title.setVisibility(View.GONE);}}@Overridepublic void onClick(View v) {dismiss();}@Overridepublic void onItemClick(AdapterView<?> parent, View view, int position,long id) {mListener.onItemClick(parent, view, position, id);dismiss();}private class DialogAdapter extends BaseAdapter {private List<String> mStrings;private Viewholder viewholder;private LayoutInflater layoutInflater;public DialogAdapter(List<String> strings) {this.mStrings = strings;this.layoutInflater=mActivity.getLayoutInflater();}@Overridepublic int getCount() {// TODO Auto-generated method stubreturn mStrings.size();}@Overridepublic Object getItem(int position) {// TODO Auto-generated method stubreturn mStrings.get(position);}@Overridepublic long getItemId(int position) {// TODO Auto-generated method stubreturn position;}@Overridepublic View getView(int position, View convertView, ViewGroup parent) {if (null == convertView) {viewholder=new Viewholder();convertView=layoutInflater.inflate(R.layout.view_dialog_item, null);viewholder.dialogItemButton=(TextView) convertView.findViewById(R.id.dialog_item_bt);convertView.setTag(viewholder);}else{viewholder=(Viewholder) convertView.getTag();}viewholder.dialogItemButton.setText(mStrings.get(position));if (!mUseCustomColor) {mFirstItemColor = mActivity.getResources().getColor(R.color.dialog_blue);mOtherItemColor = mActivity.getResources().getColor(R.color.dialog_blue);}if (1 == mStrings.size()) {viewholder.dialogItemButton.setTextColor(mFirstItemColor);viewholder.dialogItemButton.setBackgroundResource(R.drawable.dialog_item_bg_only);} else if (position == 0) {viewholder.dialogItemButton.setTextColor(mFirstItemColor);viewholder.dialogItemButton.setBackgroundResource(R.drawable.dialog_item_bg_top);} else if (position == mStrings.size() - 1) {viewholder.dialogItemButton.setTextColor(mOtherItemColor);viewholder.dialogItemButton.setBackgroundResource(R.drawable.dialog_item_bg_buttom);} else {viewholder.dialogItemButton.setTextColor(mOtherItemColor);viewholder.dialogItemButton.setBackgroundResource(R.drawable.dialog_item_bg_center);}return convertView;}}public static class Viewholder {public TextView dialogItemButton;}/*** 设置列表项的文本颜色*/public void setItemColor(int firstItemColor, int otherItemColor) {mFirstItemColor = firstItemColor;mOtherItemColor = otherItemColor;mUseCustomColor = true;}
}

通过代码我们可以看到该类继承了Dialog类，并实现了两个点击事件的接口。可以通过查看Dialog类的代码得知，Dialog本质上和一个Activity存在的区别并不明显，当我们调用dialog.show方法时，Dialog开始调用太自身的onCreate方法。
在这个SelectDialog类中我们提供了几个构造方法

public SelectDialog(Activity activity, int theme,SelectDialogListener listener,SelectDialogCancelListener cancelListener ,List<String> names);

以这个构造方法为例，他需要提供一个显示该Dialog的activity，以及两种监听器的实现和一个String链表。
其中activity表明Dialog在哪个主体界面上显示，而themo是表明显示的样式，SelectDialogListener 接口是指明listview的点击事件，SelectDialogCancelListener接口是点击取消按钮的点击事件，names是listview所要显示的内容。
不得不说，Android开发在一定程度上写出的代码要比Java后台开发更惊艳，由于各种框架的出现，Java后台开发更偏重于业务，而对编码思想的运用并不常见（架构师负责的），Android的整体框架比较少见，因此Android开发更侧重基础。
SelectDialog的使用

    private void showDialog() {List<String> list = new ArrayList<>();list.add("拍照");list.add("相册");showDialog(new SelectDialog.SelectDialogListener() {@Overridepublic void onItemClick(AdapterView<?> parent, View view, int position, long id) {switch (position){case 0:break;case 1:break;default:break;}}},list);}private SelectDialog showDialog(SelectDialog.SelectDialogListener listener, List<String> list){SelectDialog dialog = new SelectDialog(this,R.style.transparentFrameWindowStyle,listener,list);dialog.show();return dialog;}

一个好看的Dialog样式实现，仿IOS相关推荐

CSS 仿 iOS 系统通知数字样式
iOS 的图标上显示通知的数字: 下面代码就是用 CSS 模仿数字的样式: /*********************************************************/ /* ...
仿 IOS 打造一个全局通用的对话框
博主声明: 转载请在开头附加本文链接及作者信息,并标记为转载.本文由博主威威喵原创,请多支持与指教. 本文首发于此博主:威威喵 | 博客主页:https://blog.csdn.net/ ...
Android仿IOS封装通用的弹出框Dialog和底部弹出列表选择框仿美团顶部条件筛选框附自定义ViewGroup
弹出框背景提示与询问弹出框实现使用列表选择框实现使用顶部条件筛选框实现自定义ViewGroup 使用总结背景鉴于Android提供的默认弹出框很一般,IOS的弹出框样式还不错 ...
android漂亮的dialog,一个好看的Android AlertDialog
最近项目需求,需要一个好看一点的提示框,网上搜罗一番,发现sweetDialog 人气很高,但是到了实际使用的时候,发现有些问题不太好解决,而且已经三年没有更新了,而其他的库,更是达不到要求.所以索性 ...
Android Study 之通过DialogFragment玩转高仿IOS弹框~ ^.^
LZ-Say:在努力向前奔跑的途中,不要忘记让自己始终保持一个良好的状态,一颗初心,一颗永不言弃的心,一起加油` 前言 LZ虽说是搞Android的,但是对IOS的风格样式甚是酷爱,感觉简约大方,而今 ...
Android高仿IOS和QQ的弹出对话框
我们知道Android中其实并不提供圆形的东西,像Button,TextView,EditView等等都是没有弧形元素在里面(看看这些控件的属性就知道了).而很多时候我们的程序中又需要用到这样有弧形元 ...
android仿ios弹框_在“提示”框中：iOS外观（在Android上运行），Google Maps作为Time Machine，下载Wii游戏保存...
android仿ios弹框 Once a week we round up some great reader tips and share them with everyone. Read on t ...
Android 仿iOS弹窗
仿iOS弹窗一.先上效果图二.GitHub地址 GitHub地址 https://github.com/MNXP/MyDialog 三.使用 1)基本使用 myDialog = new Alert ...
android 仿ios三级联动,仿iOS的PickerView控件，有时间选择和选项选择并支持一二三级联动效果...
Android-PickerView 注意事项.详请使用方式.更新日志等,请查看 Wiki文档 Wiki文档,Wiki文档,Wiki文档 !~ 重要的事情说三遍对于使用上有任何疑问或优化建议等,欢迎 ...

一个好看的Dialog样式实现，仿IOS

一个好看的Dialog样式实现，仿IOS相关推荐

最新文章

热门文章