/**
* 作者: 大柒
* 功能: 酷炫的悬浮窗界面
* 日期: 2019/04/08
* AJ版本: Auto.js 4.1.0 Alpha5(其他版本自行测试)
* 测试设备: 三星S8 安卓9.0
* BUG: 乐视手机6.0出现点击不到控件的BUG
* 添加页面方法:
* (1)在悬浮窗'页面'添加新页面
* (2)在悬浮窗'下方导航栏'添加下面代码 注意修改id名称
* <vertical id="导航_3" layout_weight="1" gravity="center">
<img w="{{14*v_win}}px" h="{{14*v_win}}px" src="#000000" circle="true" alpha="0.5" />
</vertical>
* (3)在悬浮窗'下方白色小圆球'添加下面代码
* <vertical w="{{15*v_win}}px" layout_weight="1" gravity="center" />
* (4)在'变量'-'可修改变量'区域修改 页面总数和页面信息
* (5)在模拟初始化事件-'界面信息'变量添加新页面视图信息
*
*/
/*
importClass(android.content.Context)
importClass(android.content.res.TypedArray)
importClass(android.graphics.Color)
importClass(android.util.AttributeSet)
importClass(android.view.MotionEvent)
importClass(android.graphics.drawable.GradientDrawable);
*/
importClass(java.lang.Runnable);
importClass(android.animation.ObjectAnimator)
importClass(android.animation.PropertyValuesHolder)
importClass(android.animation.ValueAnimator)
importClass(android.animation.AnimatorSet)
importClass(android.view.animation.AccelerateInterpolator)
importClass(android.view.animation.TranslateAnimation)
importClass(android.animation.ObjectAnimator)
importClass(android.animation.TimeInterpolator)
importClass(android.os.Bundle)
importClass(android.view.View)
importClass(android.view.Window)
importClass(android.view.WindowManager)
importClass(android.view.animation.AccelerateDecelerateInterpolator)
importClass(android.view.animation.AccelerateInterpolator)
importClass(android.view.animation.AnticipateInterpolator)
importClass(android.view.animation.AnticipateOvershootInterpolator)
importClass(android.view.animation.BounceInterpolator)
importClass(android.view.animation.CycleInterpolator)
importClass(android.view.animation.DecelerateInterpolator)
importClass(android.view.animation.LinearInterpolator)
importClass(android.view.animation.OvershootInterpolator)
importClass(android.view.animation.PathInterpolator)
importClass(android.widget.Button)
importClass(android.widget.ImageView)
importClass(android.widget.TextView)
/**
* 变量
*/
//不可操作变量
const logo_关闭="@drawable/ic_close_black_48dp"
const logo_笑脸="@drawable/ic_insert_emoticon_black_48dp"
const logo_装死="@drawable/ic_sentiment_very_dissatisfied_black_48dp"
const 白 = "#ffffff"
var win = {}//悬浮窗
const w = device.width//设备分辨率 宽高
const h = device.height
const w_win = 210//悬浮窗 原尺寸
const h_win = 420
const v_win = parseInt((w - 160) / w_win)//悬浮窗 放大比例(很重要!!悬浮窗的所有值都对应的这个参数放大尺寸)
var 当前界面 = 0//记录当前在哪个界面
var 切换动作 = true//动画动作真往前 假往后
var 界面数据 = [0,]//保存所有界面的动画数据
var 导航X差值 = 0//计算下方导航的X距离
var 点击界面 = 0//点击导航栏事件
//可操作变量
const 落款 = "D7-Woker"
const 动画时间 = 500;//动画播放时间
const 界面总数 = 4;//多界面的总数量
const 界面信息 = [
//在这里添加你的每个界面名称和界面颜色
["个人中心", "#188296"],
["第二页", "#ffa000"],
["第三页", "#C71585"],
["第四页", "#E37968"]
];
/**
* 悬浮窗构建
*/
win = floaty.rawWindow(
<frame w="{{w}}px" h="{{h}}px">
<frame id="关闭_0" w="{{40*v_win}}px" h="{{40*v_win}}px" marginTop="{{(h-(h_win*v_win))/2}}px" marginRight="{{(w-(w_win*v_win))/2}}px" layout_gravity="right" alpha="0">
<img id="关闭_bg" w="*" h="*" src="#1e88e5" circle="true" alpha="1" />
<img w="{{40*v_win}}px" h="{{40*v_win}}px" src="{{logo_笑脸}}" tint="#ffffff" circle="true" alpha="1" />
</frame>
<frame >
<card id="框架" w="{{w_win*v_win}}px" h="{{h_win*v_win}}px" cardCornerRadius="{{(20*v_win)}}px" cardBackgroundColor="{{界面信息[当前界面][1]}}"
layout_gravity="center" cardElevation="15dp" foreground="?selectableItemBackground" alpha="0">
<frame h="*">
<card w="{{100*v_win}}px" h="{{30*v_win}}px" cardCornerRadius="{{16*v_win}}px" marginTop="-{{15*v_win}}px" cardBackgroundColor="#000000"
layout_gravity="center_horizontal" cardElevation="-10dp" foreground="?selectableItemBackground" alpha="0.3" >
<frame layout_gravity="center|bottom" marginBottom="{{1*v_win}}px" w="auto" h="{{14*v_win}}px" >
<text text="{{落款}}" textSize="{{10*v_win}}px" textColor="#ffffff" textStyle="bold|italic" typeface="monospace" alpha="1" />
</frame>
</card>
//下方导航栏 导航栏宽度 w
<frame w="{{w_win*v_win-200}}px" h="auto" alpha="1" layout_gravity="center|bottom" >
//导航栏高度 h
<horizontal w="*" h="{{14*v_win}}px" marginBottom="{{14*v_win}}px" layout_gravity="center_horizontal" alpha="0" />
//导航小黑球
<horizontal w="*" h="*" layout_gravity="center_horizontal" alpha="0.5" >
<vertical h="*" id="导航_0" layout_weight="1" gravity="center" >
<img w="{{14*v_win}}px" h="{{14*v_win}}px" src="#000000" circle="true" alpha="0.5" />
</vertical>
<vertical h="*" id="导航_1" layout_weight="1" gravity="center" >
<img w="{{14*v_win}}px" h="{{14*v_win}}px" src="#000000" circle="true" alpha="0.5" />
</vertical>
<vertical h="*" id="导航_2" layout_weight="1" gravity="center">
<img w="{{14*v_win}}px" h="{{14*v_win}}px" src="#000000" circle="true" alpha="0.5" />
</vertical>
<vertical h="*" id="导航_3" layout_weight="1" gravity="center">
<img w="{{14*v_win}}px" h="{{14*v_win}}px" src="#000000" circle="true" alpha="0.5" />
</vertical>
//在这里添加 小黑球
</horizontal>
//下方白色小圆球 上方加导航了栏目 下方也要对应添加一个
<horizontal w="*" h="*" layout_gravity="center_horizontal" alpha="1" >
<vertical h="*" id="导航" layout_weight="1" gravity="center" >
<img w="{{14*v_win}}px" h="{{14*v_win}}px" src="#ffffff" circle="true" alpha="1" />
</vertical>
<vertical h="*" w="{{14*v_win}}px" layout_weight="1" gravity="center" alpha="0" />
<vertical h="*" w="{{14*v_win}}px" layout_weight="1" gravity="center" alpha="0" />
<vertical h="*" w="{{14*v_win}}px" layout_weight="1" gravity="center" alpha="0" />
//在这里添加 小白球
</horizontal>
</frame>
</frame>
//页面
<frame id="CD_0" alpha="1" >
<vertical w="*" h="auto" marginTop="{{20*v_win}}px" >
<vertical w="*" h="auto" gravity="center_horizontal" layout_gravity="center" >
<text w="auto" text="{{界面信息[0][0]}}" textSize="{{14*v_win}}px" textStyle="bold" typeface="monospace" />
<img w="{{100*v_win}}px" h="{{100*v_win}}px" marginTop="30" src="#ffffff" circle="true"
layout_gravity="center" alpha="0.5" />
<text w="auto"
text="你好,大柒!
滑动屏幕
点击下方导航
切换界面"
marginTop="{{40*v_win}}px" textSize="{{24*v_win}}px" textColor="{{白}}" gravity="center_horizontal" layout_gravity="center_horizontal" textStyle="bold" typeface="monospace" />
</vertical>
</vertical>
</frame>
<frame id="CD_1" alpha="0" >
<vertical w="*" h="auto" marginTop="{{20*v_win}}px" >
<text text="{{界面信息[1][0]}}" textSize="{{14*v_win}}px" gravity="center_horizontal" textStyle="bold" typeface="monospace" />
<img w="{{100*v_win}}px" h="{{100*v_win}}px" marginTop="30" src="#ffffff" circle="true" layout_gravity="center" alpha="0.5" />
</vertical>
</frame>
<frame id="CD_2" alpha="0" >
<vertical w="*" h="auto" marginTop="{{20*v_win}}px" >
<text text="{{界面信息[2][0]}}" textSize="{{14*v_win}}px" gravity="center_horizontal" textStyle="bold" typeface="monospace" />
<img w="{{100*v_win}}px" h="{{100*v_win}}px" marginTop="30" src="#ffffff" circle="true" layout_gravity="center" alpha="0.5" />
</vertical>
</frame>
<frame id="CD_3" alpha="0" >
<vertical w="*" h="auto" marginTop="{{20*v_win}}px" >
<text text="{{界面信息[3][0]}}" textSize="{{14*v_win}}px" gravity="center_horizontal" textStyle="bold" typeface="monospace" />
<img w="{{100*v_win}}px" h="{{100*v_win}}px" marginTop="30" src="#ffffff" circle="true" layout_gravity="center" alpha="0.5" />
</vertical>
</frame>
</card>
</frame>
<frame id="关闭_1" w="{{40*v_win}}px" h="{{40*v_win}}px" marginTop="{{(h-(h_win*v_win))/2}}px" marginRight="{{(w-(w_win*v_win))/2}}px" layout_gravity="right" alpha="0" >
<img id="关闭_bg_1" src="{{界面信息[当前界面][1]}}" circle="true" alpha="1" />
<img id="关闭_logo" w="*" h="*" margin="{{5*v_win}}px" src="{{logo_关闭}}" circle="true" alpha="1" />
<img id="关闭" src="{{界面信息[当前界面][1]}}" circle="true" alpha="0" />
</frame>
</frame>
)
/**
* 模拟初始化事件
*/
time_0 = setInterval(() => {
if (界面数据.length == 1 && win.框架.getY() > 0) {
界面数据 = [//添加每个页面的视图
win.CD_0,
win.CD_1,
win.CD_2,
win.CD_3
]
let w1 = win.框架.getWidth() / 2
let h1 = win.框架.getHeight() + w1
for (i = 0; i < 界面数据.length; i++) {
界面数据[i].setPivotX(w1)
界面数据[i].setPivotY(h1)
}
//win.框架.setPivotX(win.关闭.getLeft()+((win.关闭.getWidth()/2)+w1)+w1+w1)
win.框架.setPivotX(w1+(win.关闭.getWidth())+(win.关闭.getWidth()))
win.框架.setPivotY(h1-(h1-(win.关闭.getHeight()/2)))
导航X差值 = win.导航_1.getX() - win.导航_0.getX()
log("X差值" + 导航X差值)
进场动画();
}
}, 100)
time_1 = setInterval(() => {
}, 1000)
/**
* 导航栏触发事件
*/
win.导航_0.on("click", () => {
log("导航0")
if (当前界面 == 0) { return }
切换动作 = false
动画(0)
})
win.导航_1.on("click", () => {
log("导航1")
if (当前界面 == 1) { return }
if (当前界面 == 0) {
切换动作 = true
} else {
切换动作 = false
}
动画(1)
})
win.导航_2.on("click", () => {
log("导航2")
if (当前界面 == 2) { return }
if (当前界面 < 2) {
切换动作 = true
} else {
切换动作 = false
}
动画(2)
})
win.导航_3.on("click", () => {
log("导航3")
if (当前界面 == 3) { return }
if (当前界面 < 3) {
切换动作 = true
} else {
切换动作 = false
}
动画(3)
})
win.导航.on("click", () => {
log("导航")
})
win.关闭.on("click", () => {
log("关闭")
win.关闭_bg_1.attr("src",界面信息[当前界面][1])
退场动画()
})
/**
* ------------------下方代码无需修改--------------
* 触摸事件
*/
//记录按键被按下时的触摸坐标
var x = 0,
y = 0;
//记录按键被按下时的悬浮窗位置
var windowX, windowY; G_Y = 0
//记录按键被按下的时间以便判断长按等动作
var downTime; yd = false;
win.框架.setOnTouchListener(function (view, event) {
switch (event.getAction()) {
case event.ACTION_DOWN:
x = event.getRawX();
y = event.getRawY();
windowX = win.getX();
windowY = win.getY();
downTime = new Date().getTime();
return true;
case event.ACTION_MOVE:
if (!yd) {//如果移动的距离大于h值 则判断为移动 yd为真
if (Math.abs(event.getRawY() - y) < 300 && Math.abs(event.getRawX() - x) > 300) { yd = true }
}
return true;
case event.ACTION_UP: //手指弹起
//触摸时间小于 200毫秒 并且移动距离小于30 则判断为 点击
if (yd) {
if (event.getRawX() > x) {
切换动作 = false;
} else {
切换动作 = true;
}
动画(界面判定())
}
yd = false
return true;
}
return true;
});
/**
* 动画
*/
function 动画(A) {
log("\n当前界面" + 当前界面 + "\n置换到" + A)
Animator = ObjectAnimator.ofInt(//颜色处理动画
win.框架, "cardBackgroundColor",
colors.parseColor(界面信息[当前界面][1]),
colors.parseColor(界面信息[A][1]));
Animator0 = ObjectAnimator.ofFloat(//小白球移动动画
win.导航, "translationX",
(当前界面) * 导航X差值,
A * 导航X差值
);
Animatorx = ObjectAnimator.ofFloat(//小白球X缩放动画
win.导航, "scaleY", 1, 0.7, 0.5, 0.7, 1);
Animatory = ObjectAnimator.ofFloat(//小白球Y缩放动画
win.导航, "scaleX", 1, 2, 1.7, 1.4, 1);
if (切换动作) {//页面旋转动画
Animator1 = ObjectAnimator.ofFloat(界面数据[当前界面], "rotation", 0, -45)
Animator2 = ObjectAnimator.ofFloat(界面数据[A], "rotation", 45, 0)
} else {
Animator1 = ObjectAnimator.ofFloat(界面数据[当前界面], "rotation", 0, 45)
Animator2 = ObjectAnimator.ofFloat(界面数据[A], "rotation", -45, 0)
}
Animator3 = ObjectAnimator.ofFloat(界面数据[当前界面], "alpha", 1, 1)
Animator4 = ObjectAnimator.ofFloat(界面数据[A], "alpha", 1, 1)
set = new AnimatorSet();
set.playTogether(Animator2, Animator1, Animator3, Animator4, Animator0, Animatorx, Animatory)
set.setDuration(动画时间);
Animator.setDuration(动画时间);
Animator.setEvaluator(new android.animation.ArgbEvaluator());
Animator.start();
set.start();
当前界面 = A
}
function 进场动画(){
let A=win.关闭_0
let B=win.关闭_1
let C=win.框架
let D=win.关闭_logo
let time=0
//进场
圆进场 = ObjectAnimator.ofFloat(A, "translationX", w-A.getLeft(),0);
圆显示 = ObjectAnimator.ofFloat(A, "alpha", 1,1)
圆滚动 = ObjectAnimator.ofFloat(A, "rotation", 360, 0)
set = new AnimatorSet();
set.playTogether(圆进场,圆显示,圆滚动)
set.setDuration(1000);
//转换
圆翻转 = ObjectAnimator.ofFloat(A, "scaleX", 1,0)
圆翻转.setStartDelay(1000);
圆翻转.setDuration(250);
替身圆翻转 =ObjectAnimator.ofFloat(B, "scaleX", 0,1)
圆显示_0 = ObjectAnimator.ofFloat(A, "alpha", 0,0)
圆显示_1 = ObjectAnimator.ofFloat(B, "alpha", 1,1)
转换=new AnimatorSet();
转换.playTogether(替身圆翻转,圆显示_0,圆显示_1)
转换.setStartDelay(1250);
转换.setDuration(250);
//过渡_0
圆X1=ObjectAnimator.ofFloat(win.关闭_bg_1, "scaleX", 1,0)
圆Y1 = ObjectAnimator.ofFloat(win.关闭_bg_1, "scaleY", 1,0)
旋转1 = ObjectAnimator.ofFloat(B, "rotation", 0, 180)
过渡=new AnimatorSet();
过渡.playTogether(圆X1,圆Y1,旋转1)
过渡.setStartDelay(2000);
过渡.setDuration(500);
//界面显示
界面显示 = ObjectAnimator.ofFloat(C, "alpha", 1,1)
界面X = ObjectAnimator.ofFloat(C, "scaleX", 0, 1)
界面Y = ObjectAnimator.ofFloat(C, "scaleY", 0, 1)
旋转 = ObjectAnimator.ofFloat(B, "rotation", 180, -360)
圆X = ObjectAnimator.ofFloat(D, "scaleX", 1,0.5, 0.75)
圆Y = ObjectAnimator.ofFloat(D, "scaleY", 1,0.5, 0.75)
圆X2=ObjectAnimator.ofFloat(win.关闭_bg_1, "scaleX", 0,1)
圆Y2 = ObjectAnimator.ofFloat(win.关闭_bg_1, "scaleY", 0,1)
圆Z1 = ObjectAnimator.ofFloat(win.关闭_bg_1, "alpha", 1,1,1,0)
圆Z2 = ObjectAnimator.ofFloat(D, "alpha", 1,0.3)
显示=new AnimatorSet();
显示.playTogether(界面显示,界面X,界面Y,旋转,圆X,圆Y,圆X2,圆Y2,圆Z1,圆Z2)
显示.setStartDelay(2500);
显示.setDuration(700);
//结束
set.start()//1
圆翻转.start()//2
转换.start()//3
过渡.start()//4
显示.start()//5
}
function 退场动画(){
let A=win.关闭_0
let B=win.关闭_1
let C=win.框架
let D=win.关闭_logo
let time=0
//开始退场
//界面显示 = ObjectAnimator.ofFloat(C, "alpha", 1,1)
界面X = ObjectAnimator.ofFloat(C, "scaleX", 1, 0)
界面Y = ObjectAnimator.ofFloat(C, "scaleY", 1, 0)
旋转 = ObjectAnimator.ofFloat(B, "rotation", -360, 180)
圆X = ObjectAnimator.ofFloat(D, "scaleX", 0.75,0.5, 1)
圆Y = ObjectAnimator.ofFloat(D, "scaleY", 0.75,0.5, 1)
圆X2=ObjectAnimator.ofFloat(win.关闭_bg_1, "scaleX",1, 0)
圆Y2 = ObjectAnimator.ofFloat(win.关闭_bg_1, "scaleY",1, 0)
圆Z1 = ObjectAnimator.ofFloat(win.关闭_bg_1, "alpha", 1,1)
圆Z2 = ObjectAnimator.ofFloat(D, "alpha",0.3, 1)
显示=new AnimatorSet();
显示.playTogether(界面显示,界面X,界面Y,旋转,圆X,圆Y,圆X2,圆Y2,圆Z1,圆Z2)
显示.setStartDelay(time);
显示.setDuration(700);
time+=700
//过渡_0
圆X1=ObjectAnimator.ofFloat(win.关闭_bg_1, "scaleX",0, 1)
圆Y1 = ObjectAnimator.ofFloat(win.关闭_bg_1, "scaleY",0, 1)
旋转1 = ObjectAnimator.ofFloat(B, "rotation", 180, 0)
过渡=new AnimatorSet();
过渡.playTogether(圆X1,圆Y1,旋转1)
过渡.setStartDelay(time);
过渡.setDuration(500);
time+=500
//转换
替身圆翻转 =ObjectAnimator.ofFloat(B, "scaleX",1, 0)
圆显示_1 = ObjectAnimator.ofFloat(B, "alpha", 1,1)
转换=new AnimatorSet();
转换.playTogether(替身圆翻转,圆显示_1)
转换.setStartDelay(time);
转换.setDuration(250);
time+=250
圆显示_0 = ObjectAnimator.ofFloat(B, "alpha", 0,0)
圆显示_2 = ObjectAnimator.ofFloat(A, "alpha", 1,1)
圆翻转 = ObjectAnimator.ofFloat(A, "scaleX", 0,1)
转换1=new AnimatorSet();
转换1.playTogether(圆翻转,圆显示_0,圆显示_2)
转换1.setStartDelay(time);
转换1.setDuration(250);
time+=1000
//退场
animator = ObjectAnimator.ofFloat(A, "translationX", 0, w);
mTimeInterpolator = new AnticipateInterpolator();
animator.setInterpolator(mTimeInterpolator);
animator.setStartDelay(time);
animator.setDuration(500);
time+=500
animator.start();
/*
圆进场 = ObjectAnimator.ofFloat(A, "translationX",0, w-A.getLeft());
圆显示 = ObjectAnimator.ofFloat(A, "alpha", 1,1)
圆滚动 = ObjectAnimator.ofFloat(A, "rotation", 0, 360)
set = new AnimatorSet();
set.playTogether(圆进场,圆显示,圆滚动)
set.setStartDelay(time);
set.setDuration(1000);
*/
//结束
// set.start()//1
转换1.start()//2
转换.start()//3
过渡.start()//4
显示.start()//5
threads.start(function(){
sleep(time+500)
exit()
})
}
function 界面判定() {//正常滑动时判定下一个界面
if (切换动作) {
if (当前界面 == 界面总数 - 1) { return 0 }
return 当前界面 + 1
} else {
if (当前界面 == 0) { return 界面总数 - 1 }
return 当前界面 - 1
}
}
autojs免root脚本开发的酷炫的悬浮窗界面,悬浮模块悬浮代码悬浮区域典型案例
最新推荐文章于 2024-06-20 09:31:53 发布