【转】Android 图层引导帮助界面制作

2012-11-02 10:31 1979人阅读 评论(0) 收藏 举报

原文:http://www.cnblogs.com/beenupper/archive/2012/07/18/2597504.html

项目做完了,做了第一次启动,滑动的引导页了。

然后需求又要改成流行的图层图片引导了。如图:

大家一定也经常见吧,实现当然很简单了。FrameLayout上加一个图层就完了呗。让它点击后消失。

 嗯,可是那么多界面,难道所有界面布局都要改吗?改成根元素上再套一层FrameLayout?

这里看过我 DecorView浅析 的童鞋,一定很来感觉。setContentView载入的布局的父元素不就是FrameLayout吗?

那么我们直接往它上面加引导图层不就可以了吗? Very good!

方法:

1.

只需要解决怎么找到那个Framelayout,我这里想到的办法是给每个xml布局的根元素设置一个id,通过findViewById找到咋们通过setContentView设置上布局,

再通过View的view.getParent();得到它的父元素。它的父元素不就是咋们的要的FrameLayout吗?

然后创建一个ImageView设置上引导图片加到FrameLayout就可以了。

由于有很多Activity,咋们当然要将这公共的事放在你们所有Activity的父类那里。我这里是BasicActivity。在onStart中调用了添加引导图片的方法。

2.

由于引导过的界面就没必要再次引导了。所以得保存记录。这里采用偏好设置保存,如果该Activity被引导过了,就将它的类全名保存下。

由于偏好设置只能保存键值(key-value)对,所以保存多个类名,我采用|a|b|c这种形式保存为value。

代码:

main.xml中的根元素上添加了id

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:id="@id/my_content_view"
    >
<TextView
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:text="@string/hello"
    />
<Button
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:id="@+id/btn"
    android:text="open sub"
    />
</LinearLayout>

id定义在res/values下的 ids.xml中

<?xml version="1.0" encoding="utf-8"?>
<resources>
<item type="id" name="my_content_view"></item>
</resources>

BasicActivity代码:

package com.my.decorview.test;
import android.app.Activity;
import android.view.View;
import android.view.ViewGroup;
import android.view.ViewParent;
import android.widget.FrameLayout;
import android.widget.ImageView;

/**
 * @author 曙光城邦
 * http://www.cnblogs.com/beenupper/
 *
 */
public class BasicActivity extends Activity {
    private int guideResourceId=0;//引导页图片资源id
    @Override
    protected void onStart() {
        super.onStart();
        addGuideImage();//添加引导页
    }

    /**
     * 添加引导图片
     */
    public void addGuideImage() {
        View view = getWindow().getDecorView().findViewById(R.id.my_content_view);//查找通过setContentView上的根布局
        if(view==null)return;
        if(MyPreferences.activityIsGuided(this, this.getClass().getName())){
            //引导过了
            return;
        }
        ViewParent viewParent = view.getParent();
        if(viewParent instanceof FrameLayout){
            final FrameLayout frameLayout = (FrameLayout)viewParent;
            if(guideResourceId!=0){//设置了引导图片
                final ImageView guideImage = new ImageView(this);
                FrameLayout.LayoutParams params = new FrameLayout.LayoutParams(ViewGroup.LayoutParams.FILL_PARENT, ViewGroup.LayoutParams.FILL_PARENT);
                guideImage.setLayoutParams(params);          guideImage.setScaleType(ScaleType.FIT_XY);
                guideImage.setImageResource(guideResourceId);
                guideImage.setOnClickListener(new View.OnClickListener() {
                    @Override
                    public void onClick(View v) {
                        frameLayout.removeView(guideImage);
                        MyPreferences.setIsGuided(getApplicationContext(), BasicActivity.this.getClass().getName());//设为已引导
                    }
                });
                frameLayout.addView(guideImage);//添加引导图片

            }
        }
    }

    /**子类在onCreate中调用,设置引导图片的资源id
     *并在布局xml的根元素上设置android:id="@id/my_content_view"
     * @param resId
     */
    protected void setGuideResId(int resId){
        this.guideResourceId=resId;
    }
}

偏好设置代码:

package com.my.decorview.test;

import android.content.Context;

/**
 * @author 曙光城邦
 * http://www.cnblogs.com/beenupper/
 *
 */
public class MyPreferences {
    //偏好文件名
    public static final String SHAREDPREFERENCES_NAME = "my_pref";
    //引导界面KEY
    private static final String KEY_GUIDE_ACTIVITY = "guide_activity";

    /**
     * 判断activity是否引导过
     *
     * @param context
     * @return  是否已经引导过 true引导过了 false未引导
     */
    public static boolean activityIsGuided(Context context,String className){
        if(context==null || className==null||"".equalsIgnoreCase(className))return false;
        String[] classNames = context.getSharedPreferences(SHAREDPREFERENCES_NAME, Context.MODE_WORLD_READABLE)
                 .getString(KEY_GUIDE_ACTIVITY, "").split("\\|");//取得所有类名 如 com.my.MainActivity
         for (String string : classNames) {
            if(className.equalsIgnoreCase(string)){
                return true;
            }
        }
          return false;
    }

    /**设置该activity被引导过了。 将类名已  |a|b|c这种形式保存为value,因为偏好中只能保存键值对
     * @param context
     * @param className
     */
    public static void setIsGuided(Context context,String className){
        if(context==null || className==null||"".equalsIgnoreCase(className))return;
        String classNames = context.getSharedPreferences(SHAREDPREFERENCES_NAME, Context.MODE_WORLD_READABLE)
                 .getString(KEY_GUIDE_ACTIVITY, "");
        StringBuilder sb = new StringBuilder(classNames).append("|").append(className);//添加值
        context.getSharedPreferences(SHAREDPREFERENCES_NAME, Context.MODE_WORLD_READABLE)//保存修改后的值
        .edit()
        .putString(KEY_GUIDE_ACTIVITY, sb.toString())
        .commit();
    }
}

MainActivity中添加引导页

package com.my.decorview.test;

import android.content.Intent;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;

public class MainActivity extends BasicActivity {
    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);

        Button btn = (Button)findViewById(R.id.btn);
        btn.setOnClickListener(new View.OnClickListener(){
            @Override
            public void onClick(View v) {
                startActivity(new Intent(MainActivity.this, SubActivity.class));
            }

        });

        setGuideResId(R.drawable.yindao01);//添加引导页
    }
}

OK大功告成。只需要做两件事

1. 在BasicActivity的子类中的onCreate中调用 setGuideResId(int resId),设置引导图片资源id

2. 布局xml的根元素上添加android:id="@id/my_content_view"

【转】Android 图层引导帮助界面制作

时间: 2024-08-15 07:33:06

【转】Android 图层引导帮助界面制作的相关文章

android锁屏软件制作

转载请标明出处http://blog.csdn.net/mingyue_1128 一.首先要创建一个Service保证Service一直开启,同时不被一键清理掉. 二.屏蔽掉系统的锁屏 三.创建锁屏的Activity,在Activity中屏蔽掉back,menu,home键 四.保证自己的进程不在最近任务中出现 一.创建一个Service名字为LockService public class LockService extends Service{ private KeyguardManager

Android中如何自己制作su

本文原博客:http://hubingforever.blog.163.com/blog/static/171040579201372915716149/ 在Android源码的system\extras(比如Android4.0\system\extras)下新建一个目录,比如su_robin目录 在su_robin目录下包含以三个文件: su.h文件 #ifndef SU_h  #define SU_h 1 #ifdef LOG_TAG #undef LOG_TAG #endif #defi

iOS App初次启动时的用户引导页制作实例分享

iOS App初次启动时的用户引导页制作实例分享 作者:老初 字体:[增加 减小] 类型:转载 时间:2016-03-09我要评论 这篇文章主要介绍了iOS App初次启动时的用户引导页制作实例分享,其中判断程序是否是第一次或版本更新以后第一次启动是一个关键点,需要的朋友可以参考下 应用程序APP一般都有引导页,引导页可以作为操作指南指导用户熟悉使用:也可以展现给用户,让用户了解APP的功能作用.引导页制作简单,一般只需要一组图片,再把图片组展现出来就可以了.展示图片组常用UIScrollVie

kickstart及光盘引导镜像制作

一.kickstart简介使用kickstart可以完成系统的自动化安装,原理是把安装过程内装写到配置文件中,这个配置文件可以放在光盘和文件服务器上,下面只介绍光盘引导镜像的制作.二.光盘引导镜像制作过程  (1) 准备工作目录,例如这里使用/tmp/cdrom:   #mkdir /tmp/cdrom  (2) 挂载系统发行光盘,复制光盘所有内容至/tmp/cdrom:  #mount -r -t iso9660 /dev/cdrom /media/cdrom  #cp -r /media/c

使用android.support.v8.renderscript制作的特效

https://github.com/daimajia/AndroidViewHover 这事github上一个中国程序员做的一个特效,中国程序员高手还是挺牛的(不过牛逼的都跑国外去了,国内留不住). 这个小demo里面使用到的是Android支持库--RenderScript.支持这个jar包的目录在\sdk\build-tools\里面,(我是找了好一会才找到这个,android.support.v8.renderscript不得不说自己还是个菜鸟啊~很多东西不懂,不过我有种精神不错,懂得怎

Xamarin.Android之引导页的简单制作

0x01 前言 对于现在大部分的APP,第一次打开刚安装或更新安装的APP都会有几个引导界面,通常这几个引导页是告诉用户 APP有些什么功能或者修改了什么bug.新增了什么功能等等等. 下面就用Xamarin.Android来简单实现一下.主要用到的是ViewPager,当然也就离不开Xamarin.Android.Support.v4 如果遇到不能编译的问题,可以参考Xamarin.Android之简单的抽屉布局的出错处理方案. 0x02 页面布局编写 新建一个Android项目 添加几个简单

Android用户引导页实现,圆点实现动画效果

当前市面上比较流行的应用,用户引导页已经是一个必不可缺的功能点了,简单的介绍下应用的基础功能或者版本升级功能点介绍. 那么常用的用户引导页是如何实现的呢?这篇文章就说说我个人用到的,并且觉得使用不错的效果. 1.首先定义布局文件guide_layout.xml文件,主要使用ViewPager做页面显示,使用一个圆点布局显示圆点,圆点根据图片数目动态添加. guide_layout.xml文件的代码如下: <?xml version="1.0" encoding="utf

Android突击:FrameLayout制作霓虹灯效果

1,FrameLayout的层叠嵌套,类似于Photoshop的图层.可以实现类似霓虹灯的效果. 代码大致如下: 首先是main.xml: 主要是几个TextView用来填充,使用的是FrameLayout的布局. <?xml version="1.0" encoding="utf-8"?> <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android&quo

Android—9.png的制作和去除黑线

在开发中为了避免图片因为拉伸而失真我们会把背景图片设置为9.png图片,这篇博客介绍的是如何将图片设置为9.png的 1.首先在android—>sdk—>tools文件夹中打开下图所示文件 2.将要设置的图片直接拖拽进去 3.进行9.png制作,ctrl+s保存 这时候的9.png图片是带有黑线的,不美观,需要去掉黑线用到xUltimate-d9pc-x86,下载链接: https://yunpan.cn/cPit2vA6Aw3gQ  访问密码 7863 用法: 1.将需要去掉黑线的图片拷贝