self-confidence,the source of all the power

导航

透明activity来实现悬浮蔗罩

第一步, activity的代码, 关键代码是进出动画采用淡入淡出方式,让蔗罩出现消失更自然,全屏

public class RobotGuidceV2Activity extends RoboActivity implements View.OnClickListener {

    @InjectView(R.id.iv_iknow)
    private ImageView mIvIknow;

    private Context context;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        requestWindowFeature(Window.FEATURE_NO_TITLE);   //全屏
        setContentView(R.layout.activity_robot_guidcev2);

        context = this;
        mIvIknow.setOnClickListener(this);

        overridePendingTransition(R.anim.fadein, R.anim.fadeout);  //动画
    }

    @Override
    public void onClick(View v) {
        switch (v.getId()) {
            case R.id.iv_iknow:
                PreferencesUtils.putBoolean(context, AppConst.ROBOT2_ASKTIMES_GUIDCE_OPENED, true);
                finish();
                overridePendingTransition(R.anim.fadein, R.anim.fadeout);
                break;
        }
    }
}

动画布局,fadein.xml, fadeout.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <alpha
        android:duration="300"
        android:fromAlpha="0.0"
        android:toAlpha="1.0" />
</set>
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <alpha
        android:duration="300"
        android:fromAlpha="1.0"
        android:toAlpha="0.0" />
</set>

第二步, 界面布局文件,背景采用带透明度的颜色背景

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/rel_msg_popup_container"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#aa000000">     //透明背景

    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@android:color/transparent">

        <ImageView
            android:id="@+id/iv_iknow"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_below="@id/rel_vp_container"
            android:layout_centerInParent="true"
            android:layout_gravity="center"
            android:layout_marginBottom="20dp"
            android:layout_marginTop="10dp"
            android:background="@android:color/transparent"
            android:src="@drawable/btn_iknow" />

        <ImageView
            android:id="@+id/iv_left"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_below="@id/rel_vp_container"
            android:layout_gravity="bottom"
            android:layout_marginBottom="2dp"
            android:layout_marginLeft="25dp"
            android:src="@drawable/oval1" />

        <ImageView
            android:id="@+id/iv_arraw1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom"
            android:layout_marginBottom="70dp"
            android:layout_marginLeft="80dp"
            android:src="@drawable/arrow1" />

        <ImageView
            android:id="@+id/iv_text1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom"
            android:layout_marginBottom="220dp"
            android:layout_marginLeft="30dp"
            android:src="@drawable/text1" />

        <ImageView
            android:id="@+id/iv_arraw2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom|right"
            android:layout_marginBottom="70dp"
            android:layout_marginRight="80dp"
            android:src="@drawable/arrow2" />

        <ImageView
            android:id="@+id/iv_text2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom|right"
            android:layout_marginBottom="120dp"
            android:layout_marginRight="30dp"
            android:src="@drawable/text2" />

        <ImageView
            android:id="@+id/iv_right"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom|right"
            android:layout_marginBottom="2dp"
            android:layout_marginRight="20dp"
            android:src="@drawable/oval2" />
    </FrameLayout>
</RelativeLayout>

静态效果图

第三步, 在androidmanifest.xml文件配置Activity属性这一步很关键,第二次搞这个效果的时候,我就在在这一步被坑了很久,所以才决心做个笔记。activity必须指定一个透明的style,否则布局中的透明设置不生效

<activity
            android:name=".android.activity.robotqa.RobotGuidceV2Activity"
            android:screenOrientation="portrait"
            android:theme="@android:style/Theme.Translucent.NoTitleBar.Fullscreen" />
        <activity

带translucent的theme基本上都有透明效果

posted on 2016-11-28 11:28  漩涡鸣人  阅读(741)  评论(0编辑  收藏  举报