Android UI设计--半透明效果对话框及activity(可做遮罩层)

下面是style的一些属性及其解释

    <style name="dialog_translucent" parent="@android:style/Theme.Dialog">

        <item name="android:windowFrame">@null</item><!-- 边框 -->

        <item name="android:windowIsFloating">true</item><!-- 是否悬浮在activity上 -->

        <item name="android:windowIsTranslucent">false</item><!-- 半透明 -->

        <item name="android:windowNoTitle">true</item><!-- 无标题 -->

        <item name="android:windowBackground">@android:color/transparent</item><!-- 背景透明 -->

        <item name="android:backgroundDimEnabled">false</item><!-- 模糊 -->

        <item name="android:backgroundDimAmount">0.6</item><!-- 灰度 -->

        <item name="android:windowContentOverlay">@null</item><!-- 对话框是否有遮盖 -->

        <item name="android:windowAnimationStyle">@style/dialog_animation</item><!-- 弹出或者进入时的动画效果 -->

        <item name="android:colorBackgroundCacheHint">@null</item><!-- 背景缓存颜色 -->

        

    </style>

自定义对话框效果如下

Android UI设计--半透明效果对话框及activity(可做遮罩层)

styles.xml

     <style name="popupDialog" parent="@android:style/Theme.Dialog">

        <item name="android:windowNoTitle">true</item>

        <item name="android:windowBackground">@drawable/filled_box</item>

        <item name="android:backgroundDimEnabled">false</item>

        <item name="android:windowIsTranslucent">false</item>

        <item name="android:backgroundDimAmount">0.6</item>

        <item name="android:windowAnimationStyle">@style/dialog_animation</item>

    </style>

filled_box.xml

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

<shape xmlns:android="http://schemas.android.com/apk/res/android" >

    <solid android:color="#9000"/>

    <stroke android:width="3dp" color="#ffff8080"/>

    <corners android:radius="30dp"/>

    <padding 

        android:left="10dp"

        android:top="10dp"

        android:right="10dp"

        android:bottom="10dp"/>

</shape>

dialog_animation.xml

    <style name="dialog_animation">

        <item name="android:windowEnterAnimation">@anim/fading_in</item>

        <item name="android:windowExitAnimation">@anim/fading_out</item>

    </style>

在anim目录下创建fading_in.xml,进入时候的淡入效果

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

<set 

    xmlns:android="http://schemas.android.com/apk/res/android">

    <alpha 

        android:duration="500"

        android:fromAlpha="0.1"

        android:toAlpha="1.0"

        />

</set>

fading_out.xml淡出效果

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

<set 

    xmlns:android="http://schemas.android.com/apk/res/android">

    <alpha 

        android:duration="500"

        android:fromAlpha="1.0"

        android:toAlpha="0.1"

        />

</set>

showVerify方法,效果如上面图所示

  private void verifyDialog(String msg)

        {

            final Dialog dialog = new Dialog(MainActivity.this, R.style.popupDialog);

            dialog.setContentView(R.layout.verify_dialog);

            dialog.setCanceledOnTouchOutside(false);

            dialog.setCancelable(false);

            TextView message = (TextView)dialog.getWindow().findViewById(R.id.messageTxt);

            Button okBtn = (Button)dialog.getWindow().findViewById(R.id.dismissBtn);

            message.setText(msg);

            okBtn.setOnClickListener(new OnClickListener() {

                

                @Override

                public void onClick(View v) {

                    if(dialog!=null && dialog.isShowing())

                    {

                        dialog.dismiss();

                    }

                }

            });

            if(dialog!=null && !dialog.isShowing())

            {

                dialog.show();

            }

        }

 如果是想把整个activity做成类似于微博的new feature透明背景样式,如图

Android UI设计--半透明效果对话框及activity(可做遮罩层)

上面的图是透明背景,透明颜色可以自己定义

styles.xml

    <style name="activity_translucent">

        <item name="android:windowBackground">@drawable/filled_activity_bg</item>

        <item name="android:backgroundDimEnabled">false</item>

        <item name="android:windowNoTitle">true</item>

        <item name="android:windowIsTranslucent">false</item>

        <item name="android:windowContentOverlay">@null</item>

        <item name="android:windowAnimationStyle">@style/dialog_animation</item>

        <item name="android:colorBackgroundCacheHint">@null</item>

        <item name="android:backgroundDimAmount">0.6</item><!-- 灰度 -->

    </style>

如果想设置的不是纯透明,改成灰色透明度的,可以设置windowBackground背景,下面是filled_activity_bg.xml,这样就是灰色的透明背景,类似于第一张图片

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

<shape xmlns:android="http://schemas.android.com/apk/res/android" >

    <solid android:color="#9000"/>

    <stroke color="#ffff8080"/>

</shape>

如果不做任何灰度处理,效果如上图,可以设置背景色为透明

    <style name="activity_translucent">

        <item name="android:windowBackground">@android:color/transparent</item>

        <item name="android:backgroundDimEnabled">false</item>

        <item name="android:windowNoTitle">true</item>

        <item name="android:windowIsTranslucent">false</item>

        <item name="android:windowContentOverlay">@null</item>

        <item name="android:windowAnimationStyle">@style/dialog_animation</item>

        <item name="android:colorBackgroundCacheHint">@null</item>

    </style>

显示activity,代码如下。可以通过类似的原理制作遮罩层,其他的半透明能效果,例如popup菜单半透明效果等

Dialog dialog = new Dialog(MainActivity.this, R.style.activity_translucent);

                dialog.setContentView(R.layout.transparent_layout);

                dialog.show();

 

你可能感兴趣的:(android ui)