テキスト入力でENTERキーを押したときに何かしたい

2008/10/31

こんにちは。きんくまです。
いやいや、WordPressさきほどアップグレードしようと思って、いろいろやってたらページが真っ白になって焦りましたよ。
以前にもアップグレードしたときに、うまくいかなくってそれまでの投稿(といっても数件)が消えちゃったんで、またか!と思っちゃいました。アップグレードしてもやはりFlash Player10のアップロード機能の仕様変更のためFlashを利用したアップロードは使えずです。

さて、今回はタイトルの件です。

テキスト入力でEnterキーをおしたときに何かはじめたいときはありますよね。googleとかyahooとかの検索フィールドで全て入力し終わったらEnter押して、検索開始したいです。

ここで、迷うところは日本語入力で確定を意味するENTERを押した場合は、イベントとして無効にするというところです。
で、Flash上でどうやるのか考えてみたら、上のような感じになりました。

ポイントは、以下の2点。
1.KeyboardEvent.KEY_UPはTextEvent.TEXT_INPUTよりもあとに必ずおきる。
2.TextEvent.TEXT_INPUTは日本語確定のEnterキーの場合、イベントが発生しない。

あと、検索してみたら、クジラ飛行机さんが既に同じことをしていました。
Flex2 で漢字の変換中にも、keyUp イベントが発生する件について
こちらは、KEY_UPでフラグをたててやってらっしゃる。私はクジラさんの本を何冊か読んで勉強したので師匠って感じです。

それから、疑問に思うのはFlashのムービープレビューだとTextEvent.textの日本語入力が、うまく拾えないことです。
こうやってブラウザを通したり、Playerを単体で動かすとうまくいくのに、ムービープレビューだと、確定した文字すべてがひろえなくて、最初の1文字しかみられないんです。
で、今回のソースです。Threadを使っています。

メインのスレッド

package
{
  import flash.display.MovieClip;
  import Main;
  import flash.events.KeyboardEvent;
  import flash.events.TextEvent;
  import org.libspark.thread.Thread;
  import org.libspark.thread.threads.tweener.TweenerThread;
  import org.libspark.thread.ThreadState;

  public class MainTread extends Thread
  {
    private var _main:Main;
    private var _addText:String;
    public var hit_mc:MovieClip;
    public var keyup_mc:MovieClip;
    private var _hitTw:TweenerThread;
    private var _keyupTw:TweenerThread;

    public function MainTread(_main:Main)
    {
      this._main = _main;
      hit_mc = _main.hit_mc;
      keyup_mc = _main.keyup_mc;
      hit_mc.visible = false;
      keyup_mc.visible = false;
    }

    override protected function run():void
    {
      next(lisenerInput);
    }

    private function lisenerInput():void
    {
      event(_main.input_txt, KeyboardEvent.KEY_UP, keyUpHd);
      event(_main.input_txt, TextEvent.TEXT_INPUT, textInputHd);
    }

    private function keyUpHd(e:KeyboardEvent):void
    {
      if (e.keyCode == 13 && _addText == "")
      {
        if (_hitTw != null && _hitTw.state != ThreadState.TERMINATED)
        {
          _hitTw.cancel();
        }
        hit_mc.alpha = 1;
        _hitTw = new TweenerThread(hit_mc, {
          show:true,
          alpha:0,
          time:0.5,
          transition:"easeInQuad"
        } );
        _hitTw.start();
      }else
      {
        if (_keyupTw != null && _keyupTw.state != ThreadState.TERMINATED)
        {
          _keyupTw.cancel();
        }
        _addText = "";
        keyup_mc.alpha = 1;
        _keyupTw = new TweenerThread(keyup_mc, {
          show:true,
          alpha:0,
          time:0.5,
          transition:"easeInQuad"
        } );
        _keyupTw.start();
      }
      next(lisenerInput);
    }

    private function textInputHd(e:TextEvent):void
    {
      _addText = e.text;
      _main.log_txt.text = "TEXT_INPUT は "" + _addText + """;
      next(lisenerInput);
    }
  }

}

ドキュメントクラス

package
{
  import flash.display.MovieClip;
  import flash.display.Sprite;
  import flash.text.TextField;
  import org.libspark.thread.EnterFrameThreadExecutor;
  import org.libspark.thread.Thread;

  public class Main extends Sprite
  {
    public var input_txt:TextField;
    public var hit_mc:MovieClip;
    public var keyup_mc:MovieClip;
    public var log_txt:TextField;

    public function Main()
    {
      init();
      trace("init");
    }

    private function init():void
    {
      if (!Thread.isReady) {
          Thread.initialize(new EnterFrameThreadExecutor());
      }
      var mainTread:MainTread = new MainTread(this);
      mainTread.start();
    }
  }

}
LINEで送る
Pocket

自作iPhoneアプリ 好評発売中!
フォルメモ - シンプルなフォルダつきメモ帳
ジッピー電卓 - 消費税や割引もサクサク計算!

ページトップへ戻る