Android利用浮動窗口提示用戶操作
更新時間：2016年11月06日 09:09:45 作者：Reoger
這篇文章主要為大家詳細介紹了Android利用浮動窗口提示用戶操作的相關資料,具有一定的參考價值，感興趣的小伙伴們可以參考一下
上次我們實現了利用viewpager實現對新用戶的功能性介紹，今天我們來顯示利用浮動窗口對用戶進行操作的引導。先看效果圖。
雖然界面比較丑，但是可以看到我們還是可以實現對用戶進行比較好的操作提示，下面介紹怎么實現這種效果。
集成環(huán)境
這個項目中，我采用的是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("我們繼續(xù)往下走..."))
.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("我們繼續(xù)往下走..."))
.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組合式自定義控件實現購物車加減商品操作，具有一定的參考價值，感興趣的小伙伴們可以參考一下2018-11-11
android手機有自帶的照相機和圖庫，我們做的項目中有時用到上傳圖片到服務器，今天做了一個項目用到這個功能，所以把我的代碼記錄下來和大家分享,有需求的朋友可以參考下2012-12-12
Android TextView的TextWatcher使用案例詳解
這篇文章主要介紹了Android TextView的TextWatcher使用案例詳解,本篇文章通過簡要的案例,講解了該項技術的了解與使用,以下就是詳細內容,需要的朋友可以參考下2021-08-08
本篇文章通過實例給大家講解了Android自定義控件的使用技巧和需要注意的地方，跟著學習參考下吧。2017-12-12
Android 中出現java.net.BindException: bind failed: EADDRINUSE 問
這篇文章主要介紹了Android 中出現java.net.BindException: bind failed: EADDRINUSE 問題解決辦法的相關資料,需要的朋友可以參考下2017-04-04
本文實現了Android刮刮樂示例分析，刮獎在生活中常常見到，網上現在也有各種各樣的抽獎活動，下面我們就要實現一個刮刮樂程序。2016-10-10
這篇文章主要為大家詳細介紹了Android自定義FloatingText仿點贊+1特效，具有一定的參考價值，感興趣的小伙伴們可以參考一下2018-03-03
Android 沉浸式改變小米魅族狀態(tài)欄顏色的實例代碼
這篇文章主要介紹了Android 沉浸式改變小米魅族狀態(tài)欄顏色的實例代碼,非常不錯，具有參考借鑒價值，需要的朋友可以參考下2017-02-02
Android 動態(tài)顯示和隱藏狀態(tài)欄詳解及實例
這篇文章主要介紹了Android 動態(tài)顯示和隱藏狀態(tài)欄的相關資料,需要的朋友可以參考下2017-06-06
Android基準配置文件Baseline?Profile方案提升啟動速度
這篇文章主要為大家介紹了Android基準配置文件Baseline?Profile方案提升啟動速度示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2023-02-02