继续浏览精彩内容
慕课网APP
程序员的梦工厂
打开
继续
感谢您的支持,我会继续努力的
赞赏金额会直接到老师账户
将二维码发送给自己后长按识别
微信支付
支付宝支付

Android图片突出

白衣染霜花
关注TA
已关注
手记 126
粉丝 17
获赞 57

概述

今天有个群友问 Android 图片凸出 效果怎么弄,早以前有过类似的需求,整个项目的提示框都是一个背景,背景上方有凸出半张图片,所以用layer-list写了一个背景来实现

随便画了一下比较丑,大概就是这个样子了,从上图中应该不难看出,有三个部分,顶部为透明的,底部是有色值的,那个六角星就是凸出来的图片。

那么就来动手呗,新建一个资源文件,用layer-list属性,里面用三个item,第一个item设置高度为30dp,第二个item设置top为30dp,就刚好是个垂直布局,第三个item包含一个bitmap标签,作用是为了保持图片的原大小。

代码

layer-list背景

[html] view plain copy

  1. <?xml version="1.0" encoding="utf-8"?>  

  2. <layer-list xmlns:android="http://schemas.android.com/apk/res/android">  

  3.     <item>  

  4.         <!--30dp 透明-->  

  5.         <shape>  

  6.             <size android:height="30dp" />  

  7.             <corners android:radius="10dp" />  

  8.             <solid android:color="@android:color/transparent" />  

  9.         </shape>  

  10.     </item>  

  11.     <!--下偏移30dp-->  

  12.     <item android:top="30dp">  

  13.         <shape>  

  14.             <corners android:radius="10dp" />  

  15.             <solid android:color="@android:color/white" />  

  16.         </shape>  

  17.     </item>  

  18.     <!--用 bitmap 标签来保持原大小-->  

  19.     <item>  

  20.         <bitmap  

  21.             android:gravity="center_horizontal|top"  

  22.             android:src="@mipmap/ic_sync" />  

  23.     </item>  

  24. </layer-list>  

layout 设置根节点背景 android:background="@drawable/bg_money_dialog"

[html] view plain copy

  1. <?xml version="1.0" encoding="utf-8"?><!--背景 bg_money_dialog-->  

  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  

  3.     android:layout_width="match_parent"  

  4.     android:layout_height="wrap_content"  

  5.     android:background="@drawable/bg_money_dialog"  

  6.     android:orientation="vertical">  

  7.   

  8.     <EditText  

  9.         android:layout_width="match_parent"  

  10.         android:layout_height="wrap_content"  

  11.         android:gravity="center_horizontal"  

  12.         android:hint="请输入提现金额" />  

  13.   

  14.     <EditText  

  15.         android:layout_width="match_parent"  

  16.         android:layout_height="wrap_content"  

  17.         android:gravity="center_horizontal"  

  18.         android:hint="请输入提现密码" />  

  19.   

  20.     <Button  

  21.         android:layout_width="wrap_content"  

  22.         android:layout_height="wrap_content"  

  23.         android:layout_gravity="center_horizontal"  

  24.         android:text="确认" />  

  25. </LinearLayout>  

dialogFragment代码

[java] view plain copy

  1. public class CheckoutMoneyDialog extends DialogFragment {  

  2.   

  3.     @Override  

  4.     public Dialog onCreateDialog(Bundle savedInstanceState) {  

  5.         AlertDialog.Builder builder = new AlertDialog.Builder(getActivity());  

  6.         LayoutInflater inflater = getActivity().getLayoutInflater();  

  7.         View view = inflater.inflate(R.layout.fragment_checkout_money_dialog, null);  

  8.         builder.setView(view);  

  9.         Dialog dialog = builder.create();  

  10.         return dialog;  

  11.     }  

  12. }  

效果不佳,可能需要把 EditText 设置一下 layout_marginTop 

layout_marginTop="100dp" 后确实图片没有叠在 EditText 之上,可顶部还是没有透明效果,这个原因是由于dialog背景引起的,需然layout透明,可dialog自身也是有背景的,我们把dialog背景透明一下

[java] view plain copy

  1. Dialog dialog = builder.create();  

  2. Window window = dialog.getWindow();  

  3. window.setBackgroundDrawableResource(android.R.color.transparent);  

  4. return dialog;  

原文链接:http://www.apkbus.com/blog-784586-61446.html

打开App,阅读手记
0人推荐
发表评论
随时随地看视频慕课网APP