仿IOS底部弹出效果

最近在做项目时看到旁边ios的孩子实现的从手机底部弹出一个对话框的效果很不赖,自己也想着实现一下,然后回来查了下资料,基本实现了,不过这个只能每次使用时都写一遍,最想实现的还是可以动态添加数据的,而不是写死的。现在把过程记录下来,以便以后时常拿出来看看,加深记忆。

步骤如下:

  1. 布局文件的准备
  2. shape资源
  3. 动画的准备
  4. style.xml中引用动画
  5. Java代码

布局文件,popupwindow.xml

<?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="wrap_content"
android:orientation="vertical">

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_margin="8dp"
    android:background="@drawable/popup_shape"
    android:orientation="vertical">

    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:padding="16dp"
        android:text="请选择照片"
        android:textColor="#666"
        android:textSize="20sp" />

    <View
        android:layout_width="match_parent"
        android:layout_height="0.1px"
        android:background="#888" />

    <TextView
        android:id="@+id/tv_pick_phone"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:padding="16dp"
        android:text="从手机相册选择"
        android:textColor="#118"
        android:textSize="18sp" />

    <View
        android:layout_width="match_parent"
        android:layout_height="0.1px"
        android:background="#888" />

    <TextView
        android:id="@+id/tv_pick_zone"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:padding="16dp"
        android:text="拍照"
        android:textColor="#118"
        android:textSize="18sp" />
</LinearLayout>

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_margin="8dp"
    android:background="@drawable/popup_shape">

    <TextView
        android:id="@+id/tv_cancel"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:padding="16dp"
        android:text="取消"
        android:textColor="#118"
        android:textSize="18sp"
        android:textStyle="bold" />
</LinearLayout>
</LinearLayout>

shape资源的生产popup_shape.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
<corners android:radius="5dp" />
<solid android:color="#88ffffff" />
</shape>

进入动画和退出动画的准备,popup_in.xml和popup_out.xml

`<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/accelerate_interpolator"
android:fromYDelta="100%" android:toYDelta="0"
android:duration="200"/>`


<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/accelerate_interpolator"
android:fromYDelta="0" android:toYDelta="100%"
android:duration="200"/>

在style.xml中引用动画

 <!--弹窗动画-->
<style name="PopupWindow">
    <item name="android:windowEnterAnimation">@anim/popup_in</item>
    <item name="android:windowExitAnimation">@anim/popup_out</item>
</style>

Java代码的书写

`public class MainActivity extends AppCompatActivity implements View.OnClickListener, PopupWindow.OnDismissListener {

private PopupWindow popupWindow;
private int navigationHeight;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    Button btn_open_action_sheet = (Button) findViewById(R.id.btn_open_action_sheet);
    btn_open_action_sheet.setOnClickListener(this);

    int resourceId = getResources().getIdentifier("navigation_bar_height", "dimen", "android");
    navigationHeight = getResources().getDimensionPixelSize(resourceId);
}

@Override
public void onClick(View v) {
    switch (v.getId()) {
        case R.id.btn_open_action_sheet:
            openPopupWindow(v);
            break;
        case R.id.tv_pick_phone:
            openPictures();
            popupWindow.dismiss();
            break;
        case R.id.tv_pick_zone:
            openCammer();
            popupWindow.dismiss();
            break;
        case R.id.tv_cancel:
            popupWindow.dismiss();
            break;
    }
}

@Override
public void onDismiss() {
    setBackgroundAlpha(1);
}

//打开ActionSheet的方法
private void openPopupWindow(View v) {
    //防止重复按按钮
    if (popupWindow != null && popupWindow.isShowing()) {
        return;
    }
    //设置PopupWindow的View
    View view = LayoutInflater.from(this).inflate(R.layout.popupwindow, null);
    popupWindow = new PopupWindow(view, RelativeLayout.LayoutParams.MATCH_PARENT, RelativeLayout.LayoutParams.WRAP_CONTENT);
    //设置背景
    popupWindow.setBackgroundDrawable(new BitmapDrawable());
    //设置点击弹窗外退出
    popupWindow.setFocusable(true);
    popupWindow.setOutsideTouchable(true);
    //设置动画
    popupWindow.setAnimationStyle(R.style.PopupWindow);
    //设置显示的位置
    popupWindow.showAtLocation(v, Gravity.BOTTOM, 0, navigationHeight);
    //设置消失监听
    popupWindow.setOnDismissListener(this);
    //设置PopupWindow的View点击事件
    setOnPopupViewClick(view);
    //设置背景透明度
    setBackgroundAlpha(0.5f);
}

private void setOnPopupViewClick(View view) {
    TextView tv_pick_phone, tv_pick_zone, tv_cancel;
    tv_pick_phone = (TextView) view.findViewById(R.id.tv_pick_phone);
    tv_pick_zone = (TextView) view.findViewById(R.id.tv_pick_zone);
    tv_cancel = (TextView) view.findViewById(R.id.tv_cancel);
    tv_pick_phone.setOnClickListener(this);
    tv_pick_zone.setOnClickListener(this);
    tv_cancel.setOnClickListener(this);
}

//设置屏幕背景透明效果
public void setBackgroundAlpha(float alpha) {
    WindowManager.LayoutParams lp = getWindow().getAttributes();
    lp.alpha = alpha;
    getWindow().setAttributes(lp);
}

//打开系统照相机
private void openCammer() {
   String state = Environment.getExternalStorageState();
    if (state.equals(Environment.MEDIA_MOUNTED)) {
        Intent intent = new Intent(MediaStore.ACTION_IMAGE_CAPTURE);
        File outDir = Environment.getExternalStoragePublicDirectory(Environment.DIRECTORY_PICTURES);
        if (!outDir.exists()) {
            outDir.mkdirs();
        }
        outFile = new File(outDir, System.currentTimeMillis() + ".jpg");
        intent.putExtra(MediaStore.EXTRA_OUTPUT, Uri.fromFile(outFile));
        intent.putExtra(MediaStore.EXTRA_VIDEO_QUALITY, 1);
        startActivityForResult(intent, PHOTO_REQUEST_TAKEPHOTO);
    } else {
        Log.e("CAMERA", "请确认已经插入SD卡");
    }
}

//打开系统相册
private void openPictures() {
    Intent intent = new Intent(Intent.ACTION_GET_CONTENT, android.provider.MediaStore.Images.Media.EXTERNAL_CONTENT_URI);
    //Intent intent = new Intent(Intent.ACTION_PICK, android.provider.MediaStore.Images.Media.EXTERNAL_CONTENT_URI);
    intent.setType("image/*");
    startActivityForResult(intent,2);
}}

`

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值