• ベストアンサー

Scriptで色と透明度を変化させるには?。

ある矩形をフレーム上に配置し、モーショントゥイーンを使って透明度と色の変化をつけようとしましたが、透明度は出来ても色の変化が出来ません。 そこで、Scriptを利用してと思い、下記のScriptを記述しました。 onClipEvent(load) {  var my_color:Color = new Color(aa);  var STform:Object = new Object();  STform.ra = 255;  STform.rb = 154;  STform.ga = 50  STform.gb = 128;  STform.ba = 50;  STform.bb = 106;  STform.aa = 50;  STform.ab = 0;  my_color.setTransform(STform) ; } onClipEvent(enterFrame) {  this._alpha += 1 ;  if(STform.rb < 300) {    STform.rb += 1;  }  if(STform.gb < 145) {    STform.gb += 1;  }  if(STform.bb > 80) {    STform.bb -= 1;  }  my_color.setTransform(STform) ; } 各値はデタラメです。(色と透明度の変化だけを確認したかったので。) 結果は、透明度(Alpha値)は正しく変化しましたが、色が 変わりません。どこに問題があるのでしょうか?。 どうぞ宜しく御願い致します。

  • Flash
  • 回答数2
  • ありがとう数0

質問者が選んだベストアンサー

  • ベストアンサー
  • DPE
  • ベストアンサー率85% (666/776)
回答No.2

Color.setTransform は、ムービークリップのカラー効果の「詳細」( MX では「高度な設定」)と同様の機能です。ActionScript でなくてもモーショントゥイーンと「詳細」を利用して、色とアルファが同時に変化するアニメを作ることはできます。 ただし、思い通りの色を作るのはなかなか難しく、「詳細」の設定パネルでスライダを調節しながらやっても、全く変化していないように見えることはよくあります。 setTransform および「詳細」では、元の色のRGB値と変換用のパラメータを元に計算が行われ、新しいRGB値が決まります。 ra のように”a”で終わる数値は元の値をどのくらいにするかの割合で、値の範囲は -100 ~ 100 です。ご質問文のスクリプトでは ra に 255 と範囲外の値を渡しているため、変換が失敗しているのではないでしょうか。 このあたりの動作原理や詳しい計算式は以前回答したことがありますので、よろしければご参照ください。  ・setTransform()で設定した色をgetRGB()で取得するのは無理でしょうか   http://okweb.jp/kotaeru.php3?q=784847 setTransform は色調補正のような意味が強く、ムービークリップで使用されている全ての色に影響を及ぼします。 例えば、黒で輪郭線を描いた絵に setTransform をかけると、輪郭線の色が純粋な黒ではなく色合いが変わったり、あるいは全く違う色になってしまうことがあります。 Flash MX には、Color オブジェクトを使って車のボディカラーを変化させるというサンプルが付いていました。 RGBそれぞれを調節して色を作れるようになっているのですが、車の輪郭線やハイライトの色は全く変化しないにもかかわらず、陰影はボディカラーとともに微妙に変化しているのが不思議で、どうやっているのかと思ったものですが、そのカラクリのタネはといいますと。 車の大まかな形を、単色で線のないムービークリップで作り、このムービークリップの色を Color.setRGB で変化させます。 車の細部や陰影は、モノトーンで半透明・透過情報を加えたPNG画像として別に作っておき、ムービークリップの上に重ねてあっただけでした。PNG 画像側のアルファ値が 100 %ならムービークリップの色が透けないため、変化しません。色が変化すると困る輪郭線やハイライトはアルファが100%になっています。半透明の時は、下にあるムービークリップの色とのアルファブレンドが行われるので、ボディの色の影響を受ける陰影はアルファを利用したグラデーションで付けられていたというわけです。 とても単純な、それでいて賢い方法で、なるほどと思ったサンプルでした。 setRGB は setTransform に比べて扱いが簡単で、処理も軽いです。 無理に setTransform を使わずとも、こんな方法もあるということで、ご参考までに。

その他の回答 (1)

  • mat-21
  • ベストアンサー率56% (91/162)
回答No.1

回答ではありませんが、モーショントゥイーンでできますよ。キーフレームからキーフレームにモーショントゥイーン設定し、設定変更したいキーフレーム上のオブジェクトを選択してプロパティの「カラー」の「高度な設定」でできます。数値的にややこしいので、やり方としては、「高度な設定」ではなく、「着色」で一旦色を設定し、次に「高度な設定」を選択し、「設定」ボタンをクリックします。すると、「着色」の時の色がそのまま設定されていますので、あとは「アルファ」の数値を設定すれば、色も設定でき、アルファ値も同時に設定できます。 ちなみにこの設定はFlashMXを参考に説明しています。

関連するQ&A

  • それぞれの表記の色を変えるには?

    先日、日数カウンターの代わりに、表記を変えるには という質問をして、お答えを頂き、無事解決したのですが、また新たな壁にぶつかってしまいました・・・ <script type="text/javascript"> <!-- var tday=new Date(); var bday=new Date(2013,2-1,4); var days=Math.floor((tday.getTime()-bday.getTime())/(24*60*60*1000));if(days>=301){document.write("良く出来ました");} else if(days>=100){document.write("あともう少し");} else if(days>=51){document.write("この調子で");} else {document.write("頑張りましょう");} // --> </script> というプログラムで、 以下のように変更して、文字の色を変える事はできたのですが <font color="#0000ff"><script type="text/javascript"> <!-- var tday=new Date(); var bday=new Date(2013,2-1,4); var days=Math.floor((tday.getTime()-bday.getTime())/(24*60*60*1000));if(days>=301){document.write("良く出来ました");} else if(days>=100){document.write("あともう少し");} else if(days>=51){document.write("この調子で");} else {document.write("頑張りましょう");} // --> </script></font></td> 以下のように、その表記別に色を変える方法が分かりません 良く出来ました   赤 font color="#ff0000 あともう少し     青 font color="#0000ff この調子で     黄色 font color="#ffff00 どなたか、分かる方がいらっしゃいましたら、どうか宜しくお願い致します。

  • アクションスクリプトについて

    今、毎月決まった日になったら表示させるというのをやりたくて がんばってみたのですがいまいちわかりません。 スクリプトは onClipEvent(load){  stop();  function update(){   var nowDate = new Date();   var Day = nowDate.getDate();   if (Day == 1){    this.gotoAndStop("today");   }else if(Day == 16){    this.gotoAndStop("today");   }else    this.gotoAndStop("a");   } } onClipEvent(enterFrame){ update(); } こんな感じです。(まったく自身がありません。) いまいち変数のところがわかりません。オブジェクトの生成とか・・・ PCの日付の方は変えてありますが、表示がされません。 今後は「次回の何回目は後何日」って感じに出来たらと思っています。 これについてもよかったら何かアドバイスお願いします。

  • スクリプトでフェードさせるには?

    環境:flash8 A:■ ←box1とします。 リンク文字 ←t_button2とします。 説明 リンク文字をクリックしたらA:■のボックスを_alpha:0から_alpha:50まで徐々にフェードするようなスクリプトを書くにはどうしたらいいのでしょうか? t_button2.onRelease = function() { var obj1 = _root.box1; if(obj1._alpha <= 50){ obj1._alpha += 10; } } 一応いろいろとスクリプトを書いてはみたのですが、どうもうまくいきません。どうぞよろしくお願いします。

    • ベストアンサー
    • Flash
  • アクションスクリプトを簡素化したいです。

    myMovieClipというムービークリップのカラーをmy_btn01、my_btn02、my_btn03という3つのボタンで 変化させるシミュレーターを作っています。下に書いたようにすれば動くのですが共通する文言が 多いのですっきりと簡素化したいです。実際はボタンが16個あり、色を変えるパーツも20くらいある のでファイルサイズも考慮して少しでも簡素化したいです。基礎的な質問で申し訳ないですが何卒 ご指導宜しくお願いいたします。 //以下アクションスクリプト タイムラインにべた書きしています(これもクラス?とかにできればと。) import flash.geom.ColorTransform; import flash.geom.Transform; my_btn01.addEventListener( MouseEvent.CLICK , onClick01 ); function onClick01( event:MouseEvent ) { var trans:Transform = new Transform(myMovieClip); var colorTrans:ColorTransform = new ColorTransform(1,1,1,1,0,0,0,0); colorTrans.redOffset = 250; colorTrans.greenOffset = 30; colorTrans.blueOffset = 0; trans.colorTransform = colorTrans; } my_btn02.addEventListener( MouseEvent.CLICK , onClick02 ); function onClick02( event:MouseEvent ) { var trans:Transform = new Transform(myMovieClip); var colorTrans:ColorTransform = new ColorTransform(1.15,1.05,0.85,1,0,0,0,0); colorTrans.redOffset = 244; colorTrans.greenOffset = 60; colorTrans.blueOffset = -178; trans.colorTransform = colorTrans; } my_btn03.addEventListener( MouseEvent.CLICK , onClick03 ); function onClick03( event:MouseEvent ) { var trans:Transform = new Transform(myMovieClip); var colorTrans:ColorTransform = new ColorTransform(1,2,1,1,0,0,0,0); colorTrans.redOffset = 0; colorTrans.greenOffset = 0; colorTrans.blueOffset = 0; trans.colorTransform = colorTrans; }

    • ベストアンサー
    • Flash
  • アクションスクリプトでのフレーム移動について

    FlashCS3 actionscript2.0で画像が1枚ずつフェードインしてきてサムネイル一覧になるようなものを作っています。 それぞれの写真をレイヤーに分けていれ、ラベルをつけています。 全ての写真インスタンスに飛び先のラベル名だけど変更して、下記のようにアクションスクリプトを記述しました。 ―――――――――――――――――――――――――――――― onClipEvent (load) { this._alpha = 0; } onClipEvent (enterFrame) { if(this._alpha < 100){ this,_alpha += 2; } if(this._alpha >= 80){ _root.gotoAndStop("pic02"); } } ―――――――――――――――――――――――――――――― が、1つめの写真と2つめの写真はフェードインしてきて表示されるのですが、3つめの写真以降が読み込まれません。 ラベルの番号をずらすと、その一の写真は読み込むのですが、次のラベルにはジャンプしてくれません。 原因が分かる方がいらっしゃいましたら、ぜひおしえてください。 よろしくおねがいします。

    • ベストアンサー
    • Flash
  • Flashで、スクリプトによるカラーの変化を表現

    Flashで、setRGBを使って、 あるカラーから、あるカラーへ徐々に色を変化させることは可能でしょうか。 例えば、紫から緑や、紫から赤など、 一つの色からの変化を何通りも実現できれば最高です。 それをスクリプトで自由に表現できればと思っています。 色が徐々に変わるようにしたいのですが、それは可能でしょうか。 宜しくお願いします。

  • URLのパラメータを取得するスクリプトは?

    初心者です。 無謀にもURLのパラメータを取得するためのスクリプトを作成していますが、 どうしても分からなく・・。 例えば「http://pekepeke.com/sample.html?AA=1234&BB=9876」のURLから、「AA」「BB」の パラメータ「1234」「9876」を取得し表示したいと考えています。 色々調べながら・・・下記を作成したのですが、表示が1項目のみしかされません。。 (素人・・と笑われるかもしれませんが・・) どうしたら2つ(目標は10項目ぐらいですが)を項目別に行別に表示できるのかを教えて 下さい。。 ---------------サンプル <html> <head> <title>JS test</title> </head> <body> <script> function getUrlVars() { var vars = [], hash; var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&'); for(var i = 0; i <hashes.length; i++) { hash = hashes[i].split('='); vars.push(hash[0]); vars[hash[0]] = hash[1]; } return vars; } var tag1 = null; var hash = getUrlVars(); var tag1 = 'AA ' +hash['AA'] var tag2 = null; var hash = getUrlVars(); var tag2 = 'BB ' +hash['BB'] document.write(tag1); document.write(tag2); </script> </body> </html> ------------------------------------------------ どうぞよろしくお願いします。

  • 効果付きの画像変化

    画像を効果を付けて変化をさせて、三回変化したら、変化を終了させたいんですけど、下の記述に何を加えたら良いか分かりましたら教えて下さい。お願いします。 img#img1 { filter: progid:DXImageTransform.Microsoft.RandomDissolve(Duration=2.0); } --> </style> <script language="JavaScript"> <!-- function SymError() { return true; } window.onerror = SymError; var SymRealWinOpen = window.open; function SymWinOpen(url, name, attributes) { return (new Object()); } window.open = SymWinOpen; //--> </script> <script type="text/javascript"> <!-- var ie = navigator.userAgent.indexOf("MSIE "); var verIE = 0, winIE = -1; if(ie >= 0) { verIE = parseFloat(navigator.userAgent.substr(ie + 5)); winIE = navigator.userAgent.indexOf("Windows"); } var photo = new Array("aki1.jpg", "aki2.jpg", "aki3.jpg"); var i = 0; function transImage2 () { var trans = 0; var img = document.images['img1']; if(verIE >= 5.5 && winIE >= 0) { if(img.filters) trans = img.filters[0]; } if(img.complete) { i++; if(i >= photo.length) i = 0; if(trans) trans.apply(); img.src = photo[i]; if(trans) trans.play(); } setTimeout("transImage2()", 4000); } //--> </script> </head> <body onload="setTimeout('transImage2()', 4000);"> <table> <tr> <td> <img name="img1" id="img1" src="aki1.jpg" width="240" height="180" alt=""> </td> </body>

  • [AS2.0]別レイヤー上にある複数のMCを乗算で色変更したい

    [AS2.0]別レイヤー上にある複数のMCを乗算で色変更したい こちらのサイトからFlashをお借りして、mcの色を変更しようと思っています。 http://hakuhin.jp/as/color.html#COLOR_01 ・乗算のみを使って、色を変更したい。 ・別レイヤー上にある複数のMCに、同時に色を反映させたい。 以上のことをやりたいと思っております。 教えていただきたいこと。 ・使わないアルファと加算(aa.value, rb.value, gb.value, bb.value, ab.value)を削除すると、 正常に動かなくなってしまうのは何故か。 ・複数のMCに、一括してASを適応させることは可能か。 色々と検索したのですが、解決法を見付けられませんでした。 あまり詳しくないので、質問が上手く伝わるか心配です。 AS2.0に詳しい方がいらっしゃいましたら、よろしくお願い致します。

    • ベストアンサー
    • Flash
  • javascriptでクリックするごとにセルの色を変えたい

    javascript初心者です。 現在テーブルの作成を行っており、マウスを乗せたら色が変わるやクリックして指定の色に変えるなどは実現いたしましたが、クリックするごとに色が変わる(赤→青→赤→青・・・など)ものができません。 現在下記のように作っていますがエラーが起きてしまいます。 どのように直せばよいかご教授願います。 <script type="text/javascript"> <!-- var color1 = "#ff0000"; var color2 = "#0000ff"; function onC(obj){ if (obj.style.backgroundColor = color1){ obj.style.backgroundColor = color2; } else if (obj.style.backgroundColor = color2){ obj.style.backgroundColor = color1; } } //--> </script> <body> <table border="1" cellpadding=20> <tr> <td onClick = "onC(this)"><br> </td> </tr> </table> </body>

専門家に質問してみよう