前言

上一篇的文章中讲解了一部分的动作，让大家都有了一定的了解什么是krpano中的动作以及用来干什么，今天就来把剩下的几个动作也讲解了，然后就讲解krpano中比较重要的layer元素和hotspot元素

krpano动作解析

callwhen stopcallwhen for

1.callwhen

callwhen(id*, condition, actions)，callwhen在条件为真或变成真时执行指定的动作，条件不为真时callwhen()会一直等待条件变为真，callwhen执行之前会每一帧检查一次条件是否为真，callwhen与if动作有点类似，唯一不同的是，if只是执行一次判断，callwhen则无论如何都会一直判断

2.stopcallwhen

stopcallwhen(id),stopcallwhen动作会按照指定的id停止callwhen

3.for

for(startactions, condition, nextactions, loopactions)，for动作就是for循环，首先执行startactions中的动作，然后检查condition中的表达式，如果条件为真则执行loopactions，当loopactions执行完毕后，执行nextactions，之后再次检查condition，如果不为真则直接跳出for循环，执行for后面的动作

就相当于condition为true -> 执行loopactions -> 执行nextactions -> condition，直到condition为false结束循环

案例

在进入全景后，循环打变量在控制台上，并且如果进入全屏就在控制台输出

<events name="callwhen_events" keep="true" onnewpano="callwhen(FULLSCREEN,trace('全屏模式'));" />
<events name="for_event" keep="true" onnewpano="for(set(i,0), i LT 10, inc(i), trace('i=',i));" />

loop asyncloop renderloop

1.loop

loop(condition, loopactions)，当condition为真会重复调用loopactions

2.asyncloop

asyncloop(condition, loopactions, doneactions*)，普通的loop动作会在loop循环自身完成一次后继续接下来的动作。asyncloop则会立即执行接下来的动作，而对loopactions每一帧执行一次。当async循环最终完成，调用doneactions

3.renderloop

renderloop(loopactions)，渲染过程中每一帧都执行一次loopactions，通过stoprenderloop()来停止

案例

当鼠标悬停在元素上hovering属性会被设置为true，onover事件则会作出响应，asyncloop()调用，首先检查循环条件，如果为真则执行loopactions，然后在asyncloop()后面的代码将被执行，然后在下一帧里，asyncloop条件再次被检查，如果为真，则再次执行loopactions，否则执行doneactions部分

<layer name="loop_layer" type="image" keep="true" url="./vtourskin_hotspot.png" 
    onover.addevent="asyncloop(hovering,trace('loopactions'),trace('doneactions'));trace('otheraction')" />

终止循环动作

1.break

break()，停止/中断所有当前正在运行的actions，在for和loop中使用break只终止循环

2.exitcall

break()，可直接退出/停止当前动作调用

3.setinterval

setinterval(id, delay, actions)，以指定的间隔时间（delay）重复执行指定的动作（actions），清除延时调用使用clearinterval(id)

案例

每秒在控制台输出当前时间

<action autorun="onstart" name="kr_action">
  showlog();
  setinterval(time, 1.0,jsget(times, (new Date()).toLocaleTimeString(); );trace('现在时间是',times););
</action>

toggle switch callwith

1.toggle

toggle(variable)，toggle动作在指定的布尔值变量中切换true和false

2.switch

switch(variable, value1, value2, ...)，switch动作在不同的状态间切换指定变量的数值，指定了2个或以上的变量，则变量会按顺序在这些数值中进行切换

3.callwith

callwith(caller, actions)，调用特定的plugin / layer或hotspot元素执行动作，可用于对属性的直接访问或者模拟对这些元素的事件调用

案例

分别使用toggle和switch动作来切换全屏模式，并且使用callwith调用使用了toggle动作的layer元素的onclick事件来控制全屏模式

<layer name="toggle_layer" type="text" keep="true" html="toggle全屏" align="center" onclick="toggle(fullscreen);" />
<layer name="switch_layer" type="text" keep="true" html="switch全屏" y="50" align="center" onclick="switch(fullscreen);" />
<layer name="callwith_layer" type="text" keep="true" html="callwith调用layer元素执行动作" y="100" align="center" onclick="callwith(layer[toggle_layer],onclick);" />

assignstyle copyattributes

1.assignstyle

assignstyle(elementname,styles)，assignstyle动作可以将一个或多个style元素的属性复制到某个内置元素中

2.copyattributes

copyattributes(destobject, srcobject)，copyattributes动作可以复制一个对象（srcobject）的全部属性到另一个对象（destobject）中

3.events.dispatch

events.dispatch(eventname,instantly*)，立刻处理所有events元素中含有eventname的事件，当instantly设置为true时事件会立刻执行，当设置为false时事件将在当前执行中的动作之后调用

案例

在actoin动作中使用assignstyle动作将两个style元素的属性复制给layer元素，使用copyattributes动作将一个style元素的全部属性复制到另一个layer元素中，并且使用events.dispatch执行全部含有myevent的事件

<layer name="assignstyle_layer" type="container" keep="true" align="rightcenter" visible="true"></layer>
<layer name="copyattributes_layer" type="container" keep="true" bgalpha="1" bgcolor="0xff0000" align="leftcenter" visible="true"></layer>

<style name="assignstyle_style1" bgalpha="1" bgcolor="0x000000" />
<style name="assignstyle_style2" width="300" height="300" />

<events name="events1" keep="true" myevent="trace('myevent事件1');" />
<events name="events2" keep="true" myevent="trace('myevent事件2');" />

<action autorun="onstart" name="kr_action">
  assignstyle(layer[assignstyle_layer],'assignstyle_style1 | assignstyle_style2');
  copyattributes(get(layer[copyattributes_layer]),get(style[assignstyle_style2]));

  events.dispatch('myevent');
</action>

tolower toupper

1.tolower

tolower(dst*, src)，tolower动作将源变量（src）的值转化为小写并赋值给目标变量（dst），目标变量是可选的

2.toupper

toupper(dst*, src)，toupper动作则和tolower相反，是将源变量的值转换成大写

案例

<action autorun="onstart" name="kr_action">
    set(str,'HELLO WORLD');
    <!-- 转化成小写 -->
    tolower(str);
    trace('tolower:',str);
    <!-- 转化成大写 -->
    toupper(str);
    trace('toupper:',str);
</action>

txtadd subtxt indexoftxt

1.txtadd

txtadd(dst, txt1, txt2*, txt3*, …)，txtadd动作用于添加/相连若干个文本/数值到目标变量（dst），当只使用2个参数时文本会与目标变量的值添加，多个参数则会相连在一起重新赋值给目标变量

2.subtxt

subtxt(dstvar, srcvar, startpos, len)，subtxt动作提取一个文本（srcvar）开始位置（startpos）到结束的长度（len）的内容存储在目标变量中（dstvar）

3.indexoftxt

indexoftxt(dstvar, txt, searchtxt, startindex*)，indexoftxt动作从一个文本（searchtxt）中检查其中某个文本（txt）的下标，将下标存储在目标变量（dstvar）中，从起始位置（startindex，默认为0）开始，不存在则返回-1

案例

<action autorun="onstart" name="kr_action">
    <!-- 添加/相连文本 -->
    set(str,'HELLO WORLD');
    txtadd(str,' hello world');
    debug('txtadd添加:',str);
    txtadd(str2,'h','e','l','l','o');
    debug('txtadd相连:',str2);
    <!-- 提取文本 -->
    subtxt(str3,str,0,5);
    debug('subtxt:',str3);
    <!-- 检查文本 -->
    indexoftxt(index,get(str3),'LL');
    debug('indexoftxt:',index);
</action>

总结

以上就是常用的krpano动作了，下一篇就来讲讲krpano中的layer元素，作为krpano中最常用使用范围也最为广泛的元素之一，可以玩出什么花样

Krpano：打造全景漫游体验—基础(四)

前言