先日、Twitterの公式ツイートボタンが発表されましたね。
それにともなって、KAYACさんの
たった3行!Flashで公式Tweetボタンをつくる | エントリー | _level0.KAYAC | flash ActionScript blog
の記事でFlash用公式Tweetボタンの作り方の説明が紹介されてました。
インスパイアされて、公式Tweetボタンのブックマークレット版を作ってみました。(非公式だけど)
先日、Twitterの公式ツイートボタンが発表されましたね。
それにともなって、KAYACさんの
たった3行!Flashで公式Tweetボタンをつくる | エントリー | _level0.KAYAC | flash ActionScript blog
の記事でFlash用公式Tweetボタンの作り方の説明が紹介されてました。
インスパイアされて、公式Tweetボタンのブックマークレット版を作ってみました。(非公式だけど)
みなさまおひさしぶりです
”おひさしぶり” なんて言わず日々投稿しなきゃとは思うんですけども、
まあマイペースに。
今、思いつきでブックマークレット作ったので紹介しておきます。 more…
1, removeChild や visible = false; されたMCはMouseEventは効かなくなるけど、ENTER_FRAMEとかは効いたまま。
2, Flash IDE 上で配置したMCとかは、ドキュメントクラス配下になる。
3, Event.ENTER_FRAME とかってのは定数で、実際の中身は “enterFrame” とか文字列が入ってる。
なにか気づいたら追記するかも。
すごくベーシックなことだけど、Flash初心者としてはとても大事なのでメモメモ。
昔習った三角関数とか全然覚えて無くて、
色々試してみた。
今回は直角三角形の辺の長さから角度を求めるっていうのを使ってみた。[/javascript]
青い矢印の座標を基準に、青い矢印の座標とマウスの座標を結ぶ直線と斜辺とみなした直角三角形を使ってます。
(説明がヘタクソですね。。)
Flashにマウスをのせると、マウスの方向に矢印が向きます
ソースは以下のとおり(一部)
var dx:int = mouseX - arrow.x; var dy:int = mouseY - arrow.y; arrow.rotation = Math.atan2(dy,dx) * 180 / Math.PI;
このソースをENTER_FRAMEで回してます。
Math.atan2が便利すぎる!
昔の数学(算数?)の記憶をたどりつつ、
思い出せずにググりつつで、ピタゴラスの定理(三平方の定理)を使ったFlashをさくっと作ってみました。
青いマルをドラッグしてみてください
どこにピタゴラスの定理を使っているかというと、
大きい円の大きさの可変部分のロジックです。
Flashの中心点から青いマルまでのx軸での距離をA辺、Flashの中心点から青いマルまでのy軸での距離をB辺、
Flashの中心点と青いマルを結ぶ直線を直角三角形のC辺とみなし、
A2 × B2 = C2
っていう公式を使って、C辺の長さ(Flashの中心点と青いマルを結ぶ直線の長さ)を求めています。
ソースは以下です。
package {
import flash.display.MovieClip;
import flash.events.MouseEvent;
import flash.events.Event;
public class Main extends MovieClip{
var ball:MovieClip;
var circle:MovieClip;
public function Main() {
ball = ball_mc; //ドラッグ対象のmc
circle = circle_mc; //大きさの変わる円のmc
ball.addEventListener(MouseEvent.MOUSE_DOWN, startDragHandler);
ball.addEventListener(MouseEvent.MOUSE_UP, stopDragHandler);
}
public function startDragHandler(e:MouseEvent):void {
e.target.startDrag();
stage.addEventListener(MouseEvent.MOUSE_MOVE,circleTraceForm)
}
public function stopDragHandler(e:MouseEvent):void {
e.target.stopDrag();
stage.removeEventListener(MouseEvent.MOUSE_MOVE,circleTraceForm)
}
public function circleTraceForm(e:MouseEvent):void {
//ドラッグ対象のmcの座標から、中心点からの距離を計算
var sideA:int = ball.y - stage.height / 2;
var sideB:int = ball.x - stage.width / 2;
//ピタゴラスの定理にて、直角を挟む辺a,bの長さから斜辺の長さを出すには a*a + b*b = c*cとなるので
var sideC:int = Math.sqrt(sideA * sideA + sideB * sideB);
circle.width = sideC * 2;
circle.height = sideC * 2;
}
}
}
まずはiframeのsrcの値を疑え!!!
ってわけで、今日お仕事中に久々ハマったのでメモメモ。
(同じコトで再度ハマるとかいかんですね)
https環境で、IE6でiframeのsrcの値が空だと怒られます。
「このページにはセキュリティで保護されている項目と保護されていない項目が含まれています。
保護されていない項目を表示しますか?」
って怒られます。
ごめんなさいいい
これどういう場合に起きやすいかというと、
JavaScriptでiframe生成して、srcに値セットする前にうっかりappnedChildでノード追加しちゃうとなります。
(まさに今回がそうでした)
なので、ちゃんとsrcの値セットしてからappendChildしましょーねと。
そういう話なのでした。
JavaScriptでアコーディオンとかのアニメーションとかを再現したい場合、伸びる要素を最初display:none;にしておいて、ポチしたらdisplay:block;とかにして、heightとか伸ばしてやると思うんだけど、そのdisplay:none;をスタイルシートに書いちゃうとJavaScriptを無効にしてる人が情報を見れなくなっちゃうので、JavaScript側でdisplay:none;にしたいよって時のメモ。(説明が長いな
会社の先輩から聞いて目から鱗だったのでメモメモ。
普通にJavaScriptで
obj.css.dipslay = "none";
とかやるのはイケてない。
これやるにはHTMLのノード拾わなきゃだからwindow.onload後じゃないといけないし、
そうすると環境によっては一瞬ちらっと見えちゃったり、要素が一瞬出て消えるのでガタっとなるかもしれない
そこで、一枚スタイルシートを別で用意して、それにdisplay.none;の記述だけしておく。
そいつをJavaScriptでonload前にリンクさせる。
ここは普通に下記のような感じでいいかなと。
document.write('<link rel="stylesheet" href="/css/hoge.css" type="text/css" /> ');
もしあれだったらdocument.headの有無のチェックとか入れておくのがいいのかも?
まとめると、
みたいな感じかと。
スタイルシートを別で足さなくても、直書きでheadにスタイル書いてもいいかもだけど、
管理しやすいってことで別スタイルシートにしたほうがいいかなと。
API使って色々したいって時に、JavaScriptにてXMLのパースを初めてやってみたので、
ちょいメモメモ。
CDATAセクションの扱いとかも勉強になった。
XMLがこんな感じだったとする
<?xml version="1.0" encoding="UTF-8"?> <content> <ID><![CDATA[001]]></ID> </content>
で、IDの中身の値 001 を取得したい。
とりあえず今回は大枠の content タグの取得からノードを辿ってみる。
//まずレスポンスのxmlを変数に。
var xml = xmlhttp.responseXML;
//content ノードの取得。getElementsByTagName使ったから、 HTML Collectionで返ってくるので [0] でノード指定。
var node_content = xml.getElementsByTagName("content")[0];
//ID ノードの取得。firstchildでもいけるし、getElementsByTagNameでもいい。
var node_ID = node_content.childNodes[0];
//最後に値の取得。CDATAセクションも一つのノードなので childNode[0] でアクセス。nodeValueで値を取得
var node_ID_value = node_ID.childNodes[0].nodeValue;
基本的にはノードの辿り方はHTMLのノード辿るのと大差ないみたい。
初めてやってみたので、これ以外で何か素敵な方法とか、こうするのがベターとかあったら是非とも教えていただきたいです。
参考サイト : Ajax/JavaScriptのXML parser
http://www.nikep.net/srdpty/index.php?/archives/21-AjaxJavaScriptXML-parser.html
iPadのリーク・発表から発売した現在までに、
自分の中でiPadに対する考えが色々変わった部分が多いのでまとめてみる。
そこでiPad。
需要のある用途に機能を限定しつつ、その用途に特化したサイズとインターフェイスは
「ちょっとググりたい」
「ちょっとネットで買い物したい」
にすごくピッタリで
デバイスとしての魅力以上に、
そのデバイスがある生活に魅力を感じることができる。
それってものすごくベーシックなことでもあり、
すごく難しい部分でもあるんだけど、
Appleは今回もそれをやってのけた。
iPodの時みたいに。
さすがApple!
というわけで今僕はとってもiPadが欲しいのです。
今日はエイプリルフール!
ということで個人的に秀逸だと思ったサイトを挙げておきます。
※当然2010/4/1限定サイトが多いと思うので、あしからず