Yahoo!ウィジェットで簡単アニメーション スライダーさせてみる

スライダーオブジェクトを使ってスワロフスキーフリスクケースが開閉する簡単なアニメーションサンプルを作ってみます。

<?xml version="1.0" encoding="UTF-8"?>
<widget minimumVersion="4.0">
<settings>
  <setting name="allowCustomObjectAttributes" value="true"/>
  <setting name="debug" value="on"/>
</settings>
<window title="Yahooウィジェットスライダーアニメーションサンプル">
    <name>mainWindow</name>
    <height>300</height>
    <width>600</width>
    <visible>true</visible>
</window>
  <action trigger="onLoad">
  <![CDATA[
    var myFrame     = new Frame(mainWindow);
    var buttomImage = new Image();
    var topImage    = new Image();
    
    myFrame.addSubview(buttomImage);
    myFrame.addSubview(topImage);
    setFrameAttributes(buttomImage, 50, 0, null, null, "./Images/buttom.gif");
    setFrameAttributes(topImage, 30, 0, null, null, "./Images/top.gif");
    
    buttomImage.onClick=function () {
      animator.start(close);
    }
    topImage.onClick=function () {
      animator.start(open);
    }
    var open = new MoveAnimation(buttomImage, 5, 0, 1000, animator.kEaseOut,function(){print("open")});
    var close = new MoveAnimation(buttomImage, 50, 0, 1000, animator.kEaseOut,function(){print("close")});
    
    function setFrameAttributes(obj, hOffset, vOffset, width, height, src)
    {
      if(hOffset != null) obj.hOffset = hOffset;
      if(vOffset != null) obj.vOffset = vOffset;
      if(width != null)   obj.width   = width;
      if(height != null)  obj.height  = height;
      if(src != null)     obj.src     = src;
    }
  ]]>
  </action>
</widget>

こんだけのコードで、とりあえず動くウィジェットができます〜
上のウィジェットで使った画像です。
トップカバー画像（top.gif）

スライド画像（buttom.gif）

しかし検索してもあんまりヤフーウィジェットヒットしないな〜
あんまり需要ないのかな。。。。