タイポグラフィ その2

フォントの埋め込みをすれば、文字をフツーにアウトラインで扱えることを知りました(いまさら)。ちょっと複雑なタイポグラフィをASでやってみました。


お好きな文字を入力してみてください。

以前、ActionScriptと文字情報だけでタイポグラフィを作ろうとしてましたが、_rotationや、_alphaなどの属性を操作できずに、ハマっていました。
フとまた今日、必要にせまられたのでマニュアルを熟読したところ、フォントの埋め込みをすれば、何も考えずに文字をアウトラインで扱えることを知りました。下のように、マスクもうまくいきます。



やり方は、テキストフィールドのプロパティで「埋め込み」をするだけ。一文字単位で埋め込みできます。日本語全部とか入れると、swfのサイズがでっかくなってしまいますので注意が必要です(それでも1MB程度)。



な~んだ、スッキリした!
きっと常識なんでしょうw・・お恥ずかしい・・

文字にリンクしたクラス

いつものパターンです。落下後モヤっとはねかえるようにしました。

dynamic class Typo extends MovieClip{
 var y_speed = 0;
 var x_speed = 0;
 var y_accel = 1;
 var v_rot = 0;
 var ground = 240;
 var onground = false;
 var _stop = false;

 function onEnterFrame(){
  if( _stop ) return;
  if( _alpha < 10 ) this.removeMovieClip();
  if( !onground ){
   if( this._y >= this.ground ){
     this.y_speed = -this.y_speed*0.3;
     this.v_rot = ( this._x - 200 )/30;
     this.x_speed = ( this._x - 200 )/100;
     this.onground = true;
   }else{
     this.y_speed = this.y_accel + this.y_speed;
   }
  }else{
    this._alpha-= 2;
    this._xscale+= 5;
    this._yscale+= 5;
    this._rotation+= this.v_rot;
    this._x+= this.x_speed;
  }
  this._y+= this.y_speed;
 }
}

文字列から動く文字を生成

setIntervalを使って、時間差で文字が出現するようにしています。

var intId;

goTypo("welcome!");

function goTypo(str){
 clearInterval(intId);
 intId = setInterval( createTypo, 10 , str, 0 );
}
function createTypo(str,index){
 clearInterval(intId);
 if( index < str.length ){
   var c = str.charAt(index);
   attachMovie("typo","typo"+index,
     _root.getNextHighestDepth(), { letter:c } );
   intId = setInterval( createTypo,500,str,index+1);
 }
}

コメント

コメントしてください

closed.