Android自定义底部带有动画的Dialog

Android自定义底部带有动画的Dialog

效果图

先看效果图，是不是你想要的呢

自定义Dialog

package …….view;

import android.app.Dialog;
import android.content.Context;
import android.view.Gravity;
import android.view.View;
import android.view.Window;
import android.view.WindowManager;
import android.widget.Button;

import com.bitmain.btccom.R;
import com.bitmain.btccom.interfaces.ShareOnClickListener;

/**
 * 分享框
 */
public class ShareDialog extends Dialog implements View.OnClickListener {

    private ShareOnClickListener mShareOnClickListener;

    public ShareDialog(Context context, ShareOnClickListener shareOnClickListener) {
        super(context, R.style.ShareDialog);
        initView();
        mShareOnClickListener = shareOnClickListener;
    }

    private void initView() {
        // 布局这里考虑只有分享到微信还有和朋友圈 所以没有用RecyclerView
        View view = View.inflate(getContext().getApplicationContext(), R.layout.view_share, null);
        // 初始化分享页面
        Button shareFriend = (Button) view.findViewById(R.id.share_friend);
        Button shareCirFriend = (Button) view.findViewById(R.id.share_cir_friend);
        Button cancel = (Button) view.findViewById(R.id.cancel);
        shareFriend.setOnClickListener(this);
        shareCirFriend.setOnClickListener(this);
        cancel.setOnClickListener(this);

        // 加载布局
        setContentView(view);
        // 设置Dialog参数
        Window window = getWindow();
        WindowManager.LayoutParams params = window.getAttributes();
        params.width = WindowManager.LayoutParams.MATCH_PARENT;
        params.height = WindowManager.LayoutParams.WRAP_CONTENT;
        params.gravity = Gravity.BOTTOM;
        window.setAttributes(params);
    }

    @Override
    public void onClick(View v) {
        switch (v.getId()) {
            case R.id.share_friend:
                mShareOnClickListener.onClickPosition(0);
                dismiss();
                break;
            case R.id.share_cir_friend:
                mShareOnClickListener.onClickPosition(1);
                dismiss();
                break;
            case R.id.cancel:
                dismiss();
                break;
        }
    }
}

布局

因为这里只有两个分享，项目为了赶进度，直接用了两个Button，没有使用RecyclerView

<?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="wrap_content"
    android:background="#FFF5F5F5">

    <TextView
        android:id="@+id/tip"
        android:layout_width="match_parent"
        android:layout_height="@dimen/y87"
        android:gravity="center"
        android:text="@string/send_and_share"
        android:textColor="#FF888888"
        android:textSize="@dimen/x24" />

    <LinearLayout
        android:id="@+id/share"
        android:layout_width="match_parent"
        android:layout_height="@dimen/y250"
        android:layout_below="@id/tip"
        android:orientation="horizontal"
        android:weightSum="4">

        <Button
            android:id="@+id/share_friend"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_marginBottom="@dimen/y40"
            android:layout_marginTop="@dimen/y30"
            android:layout_weight="1"
            android:background="@android:color/transparent"
            android:drawableTop="@drawable/selector_share_friend_icon"
            android:text="@string/share_friend"
            android:textColor="#FF888888"
            android:textSize="@dimen/x20" />

        <Button
            android:id="@+id/share_cir_friend"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_marginBottom="@dimen/y40"
            android:layout_marginTop="@dimen/y30"
            android:layout_weight="1"
            android:background="@android:color/transparent"
            android:drawableTop="@drawable/selector_share_cir_friend_icon"
            android:text="@string/share_cir_friend"
            android:textColor="#FF888888"
            android:textSize="@dimen/x20" />

    </LinearLayout>

    <Button
        android:id="@+id/cancel"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/share"
        android:background="#FFFFFFFF"
        android:text="@string/cancel"
        android:textColor="#FF888888"
        android:textSize="@dimen/x24" />

</RelativeLayout>

接口

这里我为了让Activity能够拿到点击的回调，我写了一个接口，大家可以参考，也可以根据自己的需求来写，灵活应用。

package …….interfaces;

public interface ShareOnClickListener {
    public void onClickPosition(int position);
}

自定义样式（重点）

重点来了，这个自定义的Dialog我们加载了一个自己的style

super(context, R.style.ShareDialog);

看一下我们自定义的样式是怎么实现的吧

• res/values/styles.xml

  <resources>
  
      ……
  
      <style name="AnimBottom" parent="@android:style/Animation">
          <item name="android:windowEnterAnimation">@anim/dialog_bottom_in</item>
          <item name="android:windowExitAnimation">@anim/dialog_bottom_out</item>
      </style>
  
      <style name="ShareDialog" parent="@android:style/Animation.Dialog">
          <item name="android:windowAnimationStyle">@style/AnimBottom</item>
          <item name="android:windowFrame">@null</item>
          <item name="android:windowIsFloating">true</item>
          <item name="android:windowIsTranslucent">true</item>
          <item name="android:windowNoTitle">true</item>
          <!-- 设置背景色 透明-->
          <item name="android:background">@android:color/transparent</item>
          <item name="android:windowBackground">@android:color/transparent</item>
          <!-- 设置是否显示背景 -->
          <item name="android:backgroundDimEnabled">true</item>
          <!-- 设置背景透明度 0 全透明 1 全不透明-->
          <item name="android:backgroundDimAmount">0.8</item>
          <!-- 设置点击空白消失 -->
          <item name="android:windowCloseOnTouchOutside">true</item>
      </style>
  
      ……
  
  </resources>

动画

• res/anim/dialog_bottom_in.xml

  <?xml version="1.0" encoding="utf-8"?>
  <set xmlns:android="http://schemas.android.com/apk/res/android">
      <!-- 自下向上滑入 -->
      <translate
          android:duration="500"
          android:fromYDelta="100%p"
          android:toYDelta="0" />
  </set>

• res/anim/dialog_bottom_out.xml

  <?xml version="1.0" encoding="utf-8"?>
  <set xmlns:android="http://schemas.android.com/apk/res/android">
      <!-- 自上向下滑出 -->
      <translate
          android:duration="500"
          android:fromYDelta="0"
          android:toYDelta="100%p" />
  </set>