Android利用浮动窗口提示用户操作_Android

上次我们实现了利用viewpager实现对新用户的功能性介绍，今天我们来显示利用浮动窗口对用户进行操作的引导。先看效果图。

虽然界面比较丑，但是可以看到我们还是可以实现对用户进行比较好的操作提示，下面介绍怎么实现这种效果。

集成环境

这个项目中，我采用的是TourGuide开源项目，可以直接进入github地址进行学习与下载，这里我们只是简单的介绍怎么使用他来实现浮动界面的引导效果。首先是添加引用：
在你的gradle file中添加以下依赖，然后点击sync将依赖添加到自己的项目中就可以直接使用了。

repositories {
 mavenCentral()
 maven(){
  url "https://oss.sonatype.org/content/repositories/snapshots"
 }
}
compile ('com.github.worker8:tourguide:1.0.17-SNAPSHOT@aar'){
 transitive=true
}

最简单的使用.

Button button = (Button)findViewById(R.id.button);
TourGuide mTourGuideHandler = TourGuide.init(this).with(TourGuide.Technique.Click)
   .setPointer(new Pointer())
   .setToolTip(new ToolTip().setTitle("Welcome!").setDescription("Click on Get Started to begin..."))
   .setOverlay(new Overlay())
   .playOn(button);

通过这几行代码就可以实现对引导的效果。下面对其中的参数做一个简答的介绍：

* setPointer() -设置指示器，关于如何改变外观（效果图中那个提示用户去点击的白点），参考我后面的代码，如果不想要pointer，可以直接传入null。
* setToolTip - 设置提示的内容，关于如何改变其样式，参考我后面的代码，如果不想要tooltip，可以传入null。
* setOverlay - 设置覆盖层的样式，关于如果改变其样式，参考我后面的代码，如果不想要可以传入null。
* with -目前使用的是 TourGuide.Technique.Click ，以后可以能会去掉。
* mTourGuideHandler - 返回的handler类型，用户去掉提示信息。

自定义提示样式

自定义ToolTip样式，代码中的注释比较详细，应该可以看懂。

 Button button = (Button) findViewById(R.id.id_but);
  //设置文本的动画效果
  Animation animation = new TranslateAnimation(0f, 0f, 200f, 0f);//转化动画
  animation.setDuration(1000);//时间间隔
  animation.setFillAfter(true);//设置停留在动画完成后的位置
  animation.setInterpolator(new BounceInterpolator());//设置动画变化的速率

  ToolTip toolTip = new ToolTip()//设置文字提示的风格
    .setTitle("欢迎使用")//设置标题
    .setDescription("下面来介绍怎么使用把..")//设置内容提示
    .setTextColor(Color.parseColor("#bdc3c7"))//设置字体颜色
    .setBackgroundColor(Color.parseColor("#e74c3c"))//设置背景色
    .setShadow(true)//设置是否有阴影效果
    .setGravity(Gravity.CENTER)//设置相对于父布局位置
    .setEnterAnimation(animation);//设置动画效果

  mTourGuideHandler1 = TourGuide.init(this).with(TourGuide.Technique.Click)
    .setPointer(new Pointer())//提示指向的按钮
    .setToolTip(toolTip)//设置提示的内容
    .setOverlay(new Overlay())//设置覆盖效果
    .playOn(button);//设置绑定的控件
  button.setOnClickListener(new View.OnClickListener() {
   @Override
   public void onClick(View v) {
    mTourGuideHandler1.cleanUp();//关闭引导界面
    initSecondeButton();
   }
  });

自定义overlay和pointer样式。

{
  Pointer pointer = new
    Pointer().setColor(Color.RED)//设置指示器的颜色
    .setGravity(Gravity.BOTTOM);//设置指示器对于父容器的位置

  Overlay overlay = new Overlay()
    .setBackgroundColor(Color.parseColor("#AAFF0000"))//设置覆盖层的颜色
    .disableClick(true)//设置不可以点击
    .setStyle(Overlay.Style.Rectangle);//设置覆盖的风格

  Button bu2 = (Button) findViewById(R.id.second_but);
   mTourGuideHandler2 = TourGuide.init(this).with(TourGuide.Technique.Click)
     .setPointer(pointer)
     .setToolTip(new ToolTip().setTitle("点击他").setDescription("我们继续往下走..."))
     .setOverlay(overlay)
     .playOn(bu2);
  bu2.setOnClickListener(new View.OnClickListener() {
   @Override
   public void onClick(View v) {
    mTourGuideHandler2.cleanUp();
   }
  });
 }

相信代码已经注释的比较清楚了。
最后，将整个项目的代码copy上来。

package students.userfloatdemo;

import android.graphics.Color;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.Gravity;
import android.view.View;
import android.view.animation.Animation;
import android.view.animation.BounceInterpolator;
import android.view.animation.TranslateAnimation;
import android.widget.Button;

import tourguide.tourguide.Overlay;
import tourguide.tourguide.Pointer;
import tourguide.tourguide.ToolTip;
import tourguide.tourguide.TourGuide;

public class MainActivity extends AppCompatActivity {

 private TourGuide mTourGuideHandler1;
 private TourGuide mTourGuideHandler2;

 @Override
 protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  setContentView(R.layout.activity_main);

  initFisrtButton();

 }

 //第二个按钮的
 private void initSecondeButton() {
  Pointer pointer = new
    Pointer().setColor(Color.RED)//设置指示器的颜色
    .setGravity(Gravity.BOTTOM);//设置指示器对于父容器的位置

  Overlay overlay = new Overlay()
    .setBackgroundColor(Color.parseColor("#AAFF0000"))//设置覆盖层的颜色
    .disableClick(true)//设置不可以点击
    .setStyle(Overlay.Style.Rectangle);//设置覆盖的风格

  Button bu2 = (Button) findViewById(R.id.second_but);
   mTourGuideHandler2 = TourGuide.init(this).with(TourGuide.Technique.Click)
     .setPointer(pointer)
     .setToolTip(new ToolTip().setTitle("点击他").setDescription("我们继续往下走..."))
     .setOverlay(overlay)
     .playOn(bu2);
  bu2.setOnClickListener(new View.OnClickListener() {
   @Override
   public void onClick(View v) {
    mTourGuideHandler2.cleanUp();
   }
  });
 }

 private void initFisrtButton() {
  Button button = (Button) findViewById(R.id.id_but);

  //设置文本的动画效果
  Animation animation = new TranslateAnimation(0f, 0f, 200f, 0f);//转化动画
  animation.setDuration(1000);//时间间隔
  animation.setFillAfter(true);//设置停留在动画完成后的位置
  animation.setInterpolator(new BounceInterpolator());//设置动画变化的速率

  ToolTip toolTip = new ToolTip()//设置文字提示的风格
    .setTitle("欢迎使用")//设置标题
    .setDescription("下面来介绍怎么使用把..")//设置内容提示
    .setTextColor(Color.parseColor("#bdc3c7"))//设置字体颜色
    .setBackgroundColor(Color.parseColor("#e74c3c"))//设置背景色
    .setShadow(true)//设置是否有阴影效果
    .setGravity(Gravity.CENTER)//设置相对于父布局位置
    .setEnterAnimation(animation);//设置动画效果

  mTourGuideHandler1 = TourGuide.init(this).with(TourGuide.Technique.Click)
    .setPointer(new Pointer())//提示指向的按钮
    .setToolTip(toolTip)//设置提示的内容
    .setOverlay(new Overlay())//设置覆盖效果
    .playOn(button);//设置绑定的控件
  button.setOnClickListener(new View.OnClickListener() {
   @Override
   public void onClick(View v) {
    mTourGuideHandler1.cleanUp();//关闭引导界面
    initSecondeButton();
   }
  });

 }

}

xml文件中的代码

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
 xmlns:android="http://schemas.android.com/apk/res/android"
 xmlns:tools="http://schemas.android.com/tools"
 android:layout_width="match_parent"
 android:layout_height="match_parent"
 android:orientation="vertical"
 android:paddingBottom="@dimen/activity_vertical_margin"
 android:paddingLeft="@dimen/activity_horizontal_margin"
 android:paddingRight="@dimen/activity_horizontal_margin"
 android:paddingTop="@dimen/activity_vertical_margin"
 tools:context="students.userfloatdemo.MainActivity">

 <Button
  android:id="@+id/id_but"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:text="第一步"
 />
 <Button
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:text="第二步"
 android:id="@+id/second_but"/>
</LinearLayout>

最后的最后，奉上源码：https://github.com/Reoger/StartUITest

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持。

以上是小编为您精心准备的的内容，在的博客、问答、公众号、人物、课程等栏目也有的相关内容，欢迎继续使用右上角搜索按钮进行搜索android
浮动窗口
android 浮动窗口、android 弹出浮动窗口、android 顶层浮动窗口、android 显示浮动窗口、android 视频浮动窗口，以便于您获取更多的相关知识。

时间： 2024-11-03 15:52:36

Android利用浮动窗口提示用户操作_Android的相关文章

Android利用浮动窗口提示用户操作

上次我们实现了利用viewpager实现对新用户的功能性介绍,今天我们来显示利用浮动窗口对用户进行操作的引导.先看效果图. 虽然界面比较丑,但是可以看到我们还是可以实现对用户进行比较好的操作提示,下面介绍怎么实现这种效果. 集成环境 这个项目中,我采用的是TourGuide开源项目,可以直接进入github地址进行学习与下载,这里我们只是简单的介绍怎么使用他来实现浮动界面的引导效果.首先是添加引用: 在你的gradle file中添加以下依赖,然后点击sync将依赖添加到自己的项目中就可以直接使

Android利用Intent实现读取图片操作_Android

本文实例演示如何从图库(Gallery)中读取图像并用ImageView将它显示出来,供大家参考,具体内容如下 运行本示例前,需要先利用相机模拟拍摄一些图片到图库中. 1.运行截图    2.主要设计步骤 (1)添加ch1203_ReadGallery.axml <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.androi

jquery guide插件实现页面引导提示用户操作

适用浏览器:IE8.360.FireFox.Chrome.Safari.Opera.傲游.搜狗.世界之窗,效果如下 js页面代码    代码如下 复制代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://w

Android仿QQ列表滑动删除操作_Android

这篇山寨一个新版QQ的列表滑动删除,上篇有说到QQ的滑动删除,推测原理就是ListView本身每个item存在一个Button,只不过普通的状态下隐藏掉了,检测到向左的滑动事件的时候弹出隐藏的Button,不过再切换Button状态的时候会给Button一个出现和隐藏的动画.下面实现这个ListView.  首先有个难点就是通过ListView获取它某个item的View,对于ViewGroup,可以直接调用getChildAt()方法获取对应的子view,但是在ListView直接使用getC

Android利用动画实现背景逐渐变暗_Android

前言 之前写了一篇Android-实现底部弹出PopupWindow并让背景逐渐变暗,介绍利用Handler动态改变背景透明度从而达到变暗的效果.现在补充一种方法,使用动画来实现相同的效果. ValueAnimator 和 Interpolator 今天的主角就是这俩,关于ValueAnimator和Interpolator(插值器)的概念请各位自行补充,这里主要讲述怎么用到我们这里来(因为我也不很懂(捂脸)). 效果 跟之前没有太大区别,只是为了演示变暗.变亮的过程 ↓ 代码 AnimUtil

Android利用Fragment实现Tab选项卡效果_Android

利用Fragment实现Tab选项卡效果:  将RadioGroup与Fragment集合,实现tab选项卡效果,这里面最关键的几个文件:  1.FragmentTabAdapter类: /** *@Description: *@Author:Nate Robinson *@Since:2015-2-12 */ public class FragmentTabAdapter implements RadioGroup.OnCheckedChangeListener { private List<

关于后台action进行逻辑判断后，要弹出窗口提示用户。

问题描述 情况是这样,当在一个很有很多张单的jsp页面对应一张单点击按钮"删除",那么在struts2的action里面我会判断这张单,是否能删除.如果能删除,则返回原先的页面如果不能删除,我希望实现返回原先的页面,并用js实现弹出一个窗口来.哪位来指点一下如何实现? 解决方案 交你一个快捷的方法:在body的第一行,放一个struts2的标签,<s:actionmessage cssStyle="list-style-type:none;" escape=&

Android利用Intent实现读取图片操作

本文实例演示如何从图库(Gallery)中读取图像并用ImageView将它显示出来,供大家参考,具体内容如下 运行本示例前,需要先利用相机模拟拍摄一些图片到图库中. 1.运行截图 2.主要设计步骤 (1)添加ch1203_ReadGallery.axml <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.c

微软将弹出警告窗口提示XP用户进行系统升级

微软现在正使用一切能够使用的方法催促Windows XP用户进行系统升级,国外媒体最新消息称微软即将通过弹出警告窗口提示用户将系统升级至更新版本.Windows XP受微软官方支持的截止时间是4月8日,有关升级通知的部署即将在下周执行.3月8日,在Windows Update常规更新后,仍在使用Windows XP的用户 就会开始收到微软的弹出式警告窗口,通知信息中会提供微软将结束对Windows XP提供支持页面的链接.此后每个月的8号,XP用户都会收到这一通知,当然用户也可选择"不再显示该信