Android 中自定义分享样式弹窗

开发过程中有很多弹窗需求,比如分享时弹窗,如下:

Android 中自定义分享样式弹窗_第1张图片

这其中就需要定义弹窗样式,位置等属性,要实现上述效果,可以通过两种比较常见的方式实现

1. 自定义dialog view 指定相关属性

2. 用dialog activity 去实现

上面实现的效果都会一样,总的来说就是要 一、自定义好view  二、控制弹出的位置

下面用dialog自定义的方式实现:

(1)定义view 的xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:background="@color/white"
    android:orientation="vertical" >

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="@dimen/common_margin_default1"
        android:orientation="horizontal" >

        <RelativeLayout
            android:id="@+id/view_share_pengyou"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1" >

            <ImageView
                android:id="@+id/share_icon"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_centerHorizontal="true"
                android:src="@drawable/bg_share_pengyou" />

            <TextView
                android:id="@+id/share_name"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_below="@id/share_icon"
                android:layout_centerHorizontal="true"
                android:layout_marginTop="@dimen/common_margin_small"
                android:text="@string/share_to_pengyou"
                android:textColor="@color/common_font_color_5"
                android:textSize="@dimen/common_font_size_6" />
        </RelativeLayout>

        <RelativeLayout
            android:id="@+id/view_share_weixin"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1" >

            <ImageView
                android:id="@+id/share_icon"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_centerHorizontal="true"
                android:src="@drawable/bg_share_weixin" />

            <TextView
                android:id="@+id/share_name"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_below="@id/share_icon"
                android:layout_centerHorizontal="true"
                android:layout_marginTop="@dimen/common_margin_small"
                android:text="@string/share_to_weixin"
                android:textColor="@color/common_font_color_5"
                android:textSize="@dimen/common_font_size_6" />
        </RelativeLayout>
    </LinearLayout>

    <View
        android:layout_width="fill_parent"
        android:layout_height="@dimen/common_divider_height"
        android:layout_marginTop="@dimen/common_margin_default1"
        android:background="@color/common_line_color_2" />

    <Button
        android:id="@+id/share_cancel_btn"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="@string/share_to_cancel" />

</LinearLayout>

(2)在dialog中inflater 自定义view

  private void showShareDialog() {
        L.d(TAG, "showShareDialog");

        View view = LayoutInflater.from(mContext).inflate(R.layout.layout_share_weixin_view, null);
        // 设置style 控制默认dialog带来的边距问题
        final Dialog dialog = new Dialog(this, R.style.common_dialog);
        dialog.setContentView(view);
        dialog.show();

        // 监听
        View.OnClickListener listener = new OnClickListener() {

            @Override
            public void onClick(View v) {
              
                switch (v.getId()) {

                    case R.id.view_share_weixin:
                        // 分享到微信
                        onShare2Weixin();
                        break;

                    case R.id.view_share_pengyou:
                        // 分享到朋友圈
                        onShare2Weixin();
                        break;

                    case R.id.share_cancel_btn:
                        // 取消
                        break;

                }

                dialog.dismiss();
            }

        };
        ViewGroup mViewWeixin = (ViewGroup) view.findViewById(R.id.view_share_weixin);
        ViewGroup mViewPengyou = (ViewGroup) view.findViewById(R.id.view_share_pengyou);
        Button mBtnCancel = (Button) view.findViewById(R.id.share_cancel_btn);
        mBtnCancel.setTextColor(R.color.common_font_color_2);
        mViewWeixin.setOnClickListener(listener);
        mViewPengyou.setOnClickListener(listener);
        mBtnCancel.setOnClickListener(listener);

        // 设置相关位置,一定要在 show()之后
        Window window = dialog.getWindow();
        window.getDecorView().setPadding(0, 0, 0, 0);
        WindowManager.LayoutParams params = window.getAttributes();
        params.width = LayoutParams.MATCH_PARENT;
        params.gravity = Gravity.BOTTOM;
        window.setAttributes(params);

    }

上面做了一个简易的实现,效果和上面差不多,如下:

Android 中自定义分享样式弹窗_第2张图片


遇到的问题:

1. 如何定义dialog的弹窗位置:

Android 中自定义分享样式弹窗_第3张图片


2.实现底部对齐充满屏幕属性后发现会有边距,这时候需要重新定义dialog style,默认情况下的style中是带有padiing的

 <!-- 默认的style -->
    <style name="common_dialog" parent="@android:style/Theme.Dialog">
        <item name="android:windowBackground">@android:color/transparent</item>
        <item name="android:windowNoTitle">true</item>
    </style>

然后在创建Dialog的时候指定theme就行。


即可完美实现。


你可能感兴趣的:(Android开发,分享,弹窗)