*自定义布局的Toast和Dialog

来源:互联网 发布:linux 用户权限 编辑:程序博客网 时间:2024/05/21 09:04

App中 与人 交互 常用的 方式 有  通知栏、 对话框(Dialog) 以及 吐司。


默认的 Toast是下面这样子的


而有时候 我们项目需要 带图片的 吐司,比如



那 怎么把图片 加进去呢? 如果是 Activity ,我们知道 只要做一个xml 布局, 将图片资源 引用进去 , 然后 通过 SetContentView(R.layout.activity_xxx) 就可以显示在Activity 上面, 那么吐司 是怎么做的呢?

我们通常都是这么用toast 的  

Toast.makeText(this, R.string.toast,Toast.LENGTH_SHORT).show();

public static Toast makeText(Context context, int resId, int duration)                                throws Resources.NotFoundException {        return makeText(context, context.getResources().getText(resId), duration);    }


可以看到, 调用 静态方法 makeText  只需要传三个参数  上下文对象  文字 id, 显示 时常,就可以 显示 普通的toast了。

那 文字 是怎么设置的呢,一起 看 makeText 方法 怎么 实现的

 public static Toast makeText(Context context, CharSequence text, int duration) {        Toast result = new Toast(context);        LayoutInflater inflate = (LayoutInflater)                context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);        View v = inflate.inflate(com.android.internal.R.layout.transient_notification, null);        TextView tv = (TextView)v.findViewById(com.android.internal.R.id.message);        tv.setText(text);                result.mNextView = v;        result.mDuration = duration;        return result;    }

这里 可以看到  首先 new 了一个 Toast 对象, 然后加载了一个布局com.android.internal.R.layout.transient_notification、这个布局 是  com.android.internal.R.  开头的,所以是 封装在 系统sdk 内部的布局,我们了解太多, 这个布局里面 有一个TextView , 通过findviewbyid  查找出来,接下来 把我们传 入的 文字 id  context.getResources().getText(resId) 、duration 给设置 到Textview 上, 将加载的布局赋值给Toast 对象的mNextView ,这样 就拿到了 一个Toast 对象 result, 最后 调用 show() 方法就可以把吐司展示在界面上。 这里注意 改变界面 要执行在ui 线程上,也就是 主线程上。

 上面 我们 明白了 系统Toast 如何 创建出来的,那么我们就可以定义我们自己的layout布局,设置给Toast,就可以弹出 第二个图所示的 吐司了。

我们只要按照步骤

1  创建 一个 Toast 对象  2 定义 layout 布局   3  将布局 与 Toast 对象 关联起来  4  调用 show() 方法   

就可以了。

Toast toast = new Toast(context);toast.setView(generateToast(context, type));toast.setDuration(duration);toast.setGravity(Gravity.CENTER, 0, 0);toast.show();

因为 我们定义的 layout布局 最终 还是解析成view 设置给Activity 或者 toast。 这里我们尝试 直接用代码 生成 view。 这样 我们可以写一个ToastUtils 类,可以方便我们其他项目用到 toast 的时候直接copy 过去用。


布局 :

private static View generateToast(Context context, int width, int height, TOAST_T type, int picid, int picresid, int botoomtextresid) {// 我们布局最外层 用RelativeLayout  去实现RelativeLayout parentView = new RelativeLayout(context);// 设置 宽度  高度 都是  WRAP_CONTENTRelativeLayout.LayoutParams mParentParams = new RelativeLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);parentView.setLayoutParams(mParentParams);// toast 设置背景  半透明RelativeLayout childView = new RelativeLayout(context);RelativeLayout.LayoutParams mChildParams = new RelativeLayout.LayoutParams(width, height);childView.setBackgroundResource(R.drawable.shape_toast_bg_tanslucent);mChildParams.addRule(RelativeLayout.CENTER_VERTICAL);childView.setLayoutParams(mChildParams);// 添加底部 已经加入书单文字TextView bottomText = new TextView(context);RelativeLayout.LayoutParams mTextViewParams = new RelativeLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);//设置 文字提示信息//TODO: 在半透明背景上面 显示白色的 颜色值bottomText.setTextColor(context.getResources().getColor(android.R.color.white));bottomText.setText(botoomtextresid);childView.addView(bottomText, mTextViewParams);// 添加 图片资源ImageView imageView = new ImageView(context);RelativeLayout.LayoutParams imageParams = new RelativeLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);imageView.setId(picid);imageView.setBackgroundResource(picresid);// 是否添加文字。switch (type) {case ADD_BOOKMARK_SUCCES:// 添加书签成功 ,显示 底部提示文字bottomText.setVisibility(View.VISIBLE);imageParams.addRule(RelativeLayout.CENTER_IN_PARENT);// 图片 居中显示mTextViewParams.addRule(RelativeLayout.CENTER_IN_PARENT);mTextViewParams.addRule(RelativeLayout.BELOW, picid);mTextViewParams.setMargins(0, dip2px(context, 5), 0, 0);break;case ADD_LOCKSCREEN_SUCCES:// 锁定屏幕     更换显示 图片,隐藏底部文字bottomText.setVisibility(View.INVISIBLE);//picresid = R.drawable.slider_unlock_sign;imageParams.addRule(RelativeLayout.CENTER_IN_PARENT);// 图片 居中显示break;case ADD_AGREEMENT_SUCCES://点赞 +1 文字在图片右边bottomText.setVisibility(View.VISIBLE);mTextViewParams.addRule(RelativeLayout.CENTER_VERTICAL);mTextViewParams.addRule(RelativeLayout.RIGHT_OF, picid);imageParams.addRule(RelativeLayout.CENTER_VERTICAL);imageParams.setMargins(dip2px(context, 10), 0, 0, 0);mTextViewParams.setMargins(dip2px(context, 15), 0, 0, 0);//botoomtextresid=""; 设置 text  +1break;default:break;}childView.addView(imageView, imageParams);parentView.addView(childView);return parentView;}


  简单介绍下 布局的 组成  由于 文字和图片的相对位置  ,我们选择 relativelayout  去做最外层布局比较方便。大小 设置成包裹内容  Toast 背景是 半透明黑色的 

我们用 shape 生成一个背景, 我们在res 目录下 新建 一个drawable 文件夹  放置 我们自己定义的 shape 和 selector 布局。

这里 用shape 生成 一个 背景 我们按照  shape_toast_bg_tanslucent  这样的 命名格式,  shape 代表 是用shape 做的, toast_bg 表示 我们做的事toast 的background, 这个背景 是  半透明的tanslucent 。

<?xml version="1.0" encoding="utf-8"?><shape   xmlns:android="http://schemas.android.com/apk/res/android">    <!-- corners 角度 -->    <corners     android:radius="6dp"    />    <padding     android:left="5dp"    android:top="5dp"    android:right="5dp"    android:bottom="5dp"    />    <!--solid  填充色  -->    <solid     android:color="#b0000000"    /></shape>

然后 我们定义 出 TextView  和 Imageview   然后根据 图片与文字的位置  设置  params .最后调用addView()  方法 讲 childview 添加进去。在设置 gravity  居中显示。 这样就完成了。


附上 我自己录了一个这个Toast怎么做的视频,在百度云~:http://pan.baidu.com/s/1mg8dLFy


0 0
原创粉丝点击