概述
今天有个群友问 Android 图片凸出 效果怎么弄,早以前有过类似的需求,整个项目的提示框都是一个背景,背景上方有凸出半张图片,所以用layer-list写了一个背景来实现
随便画了一下比较丑,大概就是这个样子了,从上图中应该不难看出,有三个部分,顶部为透明的,底部是有色值的,那个六角星就是凸出来的图片。
那么就来动手呗,新建一个资源文件,用layer-list属性,里面用三个item,第一个item设置高度为30dp,第二个item设置top为30dp,就刚好是个垂直布局,第三个item包含一个bitmap标签,作用是为了保持图片的原大小。
代码
layer-list背景
[html] view plain copy
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<!--30dp 透明-->
<shape>
<size android:height="30dp" />
<corners android:radius="10dp" />
<solid android:color="@android:color/transparent" />
</shape>
</item>
<!--下偏移30dp-->
<item android:top="30dp">
<shape>
<corners android:radius="10dp" />
<solid android:color="@android:color/white" />
</shape>
</item>
<!--用 bitmap 标签来保持原大小-->
<item>
<bitmap
android:gravity="center_horizontal|top"
android:src="@mipmap/ic_sync" />
</item>
</layer-list>
layout 设置根节点背景 android:background="@drawable/bg_money_dialog"
[html] view plain copy
<?xml version="1.0" encoding="utf-8"?><!--背景 bg_money_dialog-->
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@drawable/bg_money_dialog"
android:orientation="vertical">
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:hint="请输入提现金额" />
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:hint="请输入提现密码" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:text="确认" />
</LinearLayout>
dialogFragment代码
[java] view plain copy
public class CheckoutMoneyDialog extends DialogFragment {
@Override
public Dialog onCreateDialog(Bundle savedInstanceState) {
AlertDialog.Builder builder = new AlertDialog.Builder(getActivity());
LayoutInflater inflater = getActivity().getLayoutInflater();
View view = inflater.inflate(R.layout.fragment_checkout_money_dialog, null);
builder.setView(view);
Dialog dialog = builder.create();
return dialog;
}
}
效果不佳,可能需要把 EditText 设置一下 layout_marginTop
layout_marginTop="100dp" 后确实图片没有叠在 EditText 之上,可顶部还是没有透明效果,这个原因是由于dialog背景引起的,需然layout透明,可dialog自身也是有背景的,我们把dialog背景透明一下
[java] view plain copy
Dialog dialog = builder.create();
Window window = dialog.getWindow();
window.setBackgroundDrawableResource(android.R.color.transparent);
return dialog;
共同学习,写下你的评论
评论加载中...
作者其他优质文章