启动界面的手绘提示

参考：http://blog.csdn.net/sunmanzth/article/details/6902458

现在大部分app第一次使用的时候都会给一个手绘提示，这个给人感觉灰常好啊，所以决定仿造一个。。。供大伙学习，转载请注明出处。【元子_speed】

先上图！

（声明：这里手绘图背后的activity的控件其实假的，我只是在activity里设置了背景图片，对应的背景图片是从网上download,这里借用充实下，如有冒用，请谅解，我随后删除）

首先分析下这个界面的组成，最顶上那个手绘图是一个Dialog，大家都知道Dialog是在Activity之上，而且能够屏蔽了下面的Activity,所以我们只需要把这个activity设置成半透明状态就好了，剩下就是那些透明图像的制作，两种方式，直接做一张透明图像，按比例把界面提示做好，另一种就是各个部分做一个图片，然后用RelativeLayout组合即可

步骤

1：制作半透明的资源文件

在values\colors.xml

<?xml version="1.0" encoding="UTF-8"?> <resources>     <color name="transparent">#9000</color> </resources>

这里据说是9/16 差不多一半的透明度，大家可以换个数字试试

 

2：制作样式资源文件

在values\styles.xml

<?xml version="1.0" encoding="UTF-8"?> <resources> <style name="Dialog_Fullscreen">     <item name="android:windowBackground">@color/transparent</item>     <item name="android:windowNoTitle">true</item>     <item name="android:windowIsTranslucent">true</item>     <item name="android:windowContentOverlay">@null</item>     <item name="android:windowAnimationStyle">@style/Dialog_Anim</item>     <item name="android:colorBackgroundCacheHint">@null</item> </style>   <style name="Dialog_Anim">     <item name="android:windowEnterAnimation">@anim/fading_in</item>     <item name="android:windowExitAnimation">@anim/fading_out</item> </style> </resources>

 

我们看到这里还需要一个动画文件

在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>

同时anim/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>

 

这里动画效果大家可以发挥想象去丰富吧

 

3：制作Dialog的layout文件 我这里命名为welcome.xml

<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"     android:background="@android:color/transparent"     android:padding="0.0dip"     android:layout_width="fill_parent"     android:layout_height="fill_parent">         <ImageView         android:id="@+id/ivNavigater_top"         android:layout_width="wrap_content"         android:layout_height="wrap_content"         android:src="@drawable/top_tran"         android:layout_alignParentTop="true"         android:layout_centerHorizontal="true" />     <ImageView         android:id="@+id/ivNavigater_center"         android:layout_width="wrap_content"         android:layout_height="wrap_content"         android:src="@drawable/center_tran"         android:layout_centerInParent="true" />     <ImageView         android:id="@+id/ivNavigater_clickable"         android:padding="0.0dip"         android:layout_width="wrap_content"         android:layout_height="wrap_content"         android:layout_margin="0.0dip"         android:src="@drawable/click2_tran"         android:layout_alignParentLeft="true"         android:layout_alignParentBottom="true" />     <ImageView         android:id="@+id/ivNavigater_bottom"         android:layout_width="wrap_content"         android:layout_height="wrap_content"         android:layout_margin="0.0dip"         android:src="@drawable/skip_tran"         android:adjustViewBounds="true"         android:layout_alignParentRight="true"         android:layout_alignParentBottom="true" /> </RelativeLayout>

我这里采用的是几个图用RelativeLayout组合而成的，感觉比较快，绘制一个图，当心不够准确~比较不是文艺青年。。。

 

 

4：最后一步啦，显示

package com.ylf;   import android.app.Activity; import android.app.Dialog; import android.os.Bundle; import android.view.View; import android.view.View.OnClickListener; import android.view.Window; import android.widget.ImageView;   public class MainActivity extends Activity implements OnClickListener{         ImageView view = null;      Dialog dlg = null;     @Override     public void onCreate(Bundle savedInstanceState) {         super.onCreate(savedInstanceState);         getWindow().requestFeature(Window.FEATURE_NO_TITLE);         setContentView(R.layout.main);                 dlg = new Dialog(this,R.style.Dialog_Fullscreen);         dlg.setContentView(R.layout.welcome);        //这里不是单击所有地方都能退出这个对话框，而是用那个喊着“click me ”的贱按钮         view = (ImageView)dlg.findViewById(R.id.ivNavigater_clickable);         view.setOnClickListener(this);         dlg.show();             }         @Override     public void onClick(View v) {        dlg.dismiss();     }   }

 

大功告成！

 

 

最后解决一个问题，如何让该界面只在第一次启动的时候才显示，以后都不显示呢，很简单，往SharedPreference里面记录一个flag判断是不是第一次登陆即可