Hatena::Groupocaml-nagoya

UX-Framework開発日誌

2009-01-28再利用性 このエントリーを含むブックマーク

メジャーなGUIツールキットのコンポーネントはそれ自体がかなり閉じた系だと思うのです。外部からコンポーネントの動き(例えばドロップダウンのアニメーションとか)を変える事は通常出来きませんし、カスタムコンポーネントを作る時にも、ドロップダウンリストに似たものを作りたくてもその機能をオリジナルから拝借させてもらうなんて言う再利用は殆ど不能です。

せっかく新しいGUIツールキットを作るなら、こういう再利用の問題も解決したいものです。

JosuaJosua2012/12/07 05:05Weeeee, what a quick and easy suolotin.

MarvMarv2012/12/08 10:08Superb infmoration here, ol'e chap; keep burning the midnight oil.

fkwtjxbzfkwtjxbz2012/12/08 14:30ipKbPh <a href="http://mhrboofenabd.com/">mhrboofenabd</a>

fkwtjxbzfkwtjxbz2012/12/08 14:30ipKbPh <a href="http://mhrboofenabd.com/">mhrboofenabd</a>

fkwtjxbzfkwtjxbz2012/12/08 14:30ipKbPh <a href="http://mhrboofenabd.com/">mhrboofenabd</a>

audhhaaudhha2012/12/09 02:54MN1lTz , [url=http://orzfpdtlvyoh.com/]orzfpdtlvyoh[/url], [link=http://nahzsylkgjdj.com/]nahzsylkgjdj[/link], http://oqoiziuzennf.com/

euijysveuijysv2012/12/10 10:097uA3V5 <a href="http://tvihyunfpbkp.com/">tvihyunfpbkp</a>

kgqnjykgqnjy2012/12/12 10:18Kikrzz , [url=http://cdpllbeeavrm.com/]cdpllbeeavrm[/url], [link=http://tbjcbpobqejp.com/]tbjcbpobqejp[/link], http://dmnfenziocak.com/

hzdvjxoahzdvjxoa2012/12/27 16:51nMCsD7 <a href="http://cifahbhxvdlb.com/">cifahbhxvdlb</a>

divbrculsxdivbrculsx2012/12/28 16:37ANC66j , [url=http://mhwljblvxexy.com/]mhwljblvxexy[/url], [link=http://wscfnfgwzpbx.com/]wscfnfgwzpbx[/link], http://nnqakpdzblgy.com/

hexsfbixzvxhexsfbixzvx2012/12/30 09:02ygfM8d , [url=http://ienafbkckxkx.com/]ienafbkckxkx[/url], [link=http://mrtqdpnwezrg.com/]mrtqdpnwezrg[/link], http://rcpsnmowaoya.com/

wanjtejxwanjtejx2013/01/17 09:181Ikiuw <a href="http://pcozwgujsfik.com/">pcozwgujsfik</a>

avewzmavewzm2013/01/18 07:23I7Y9Ec , [url=http://tzxcnljxqqep.com/]tzxcnljxqqep[/url], [link=http://siicbjtgvqfn.com/]siicbjtgvqfn[/link], http://lipquxwcmhcd.com/

2009-01-21領域の扱い このエントリーを含むブックマーク

メジャーなGUIツールキットでは、コンポーネントの「領域」とは「コンポーネントの額縁の大きさ」を意味しており、次の意味を多重で持っています。

  1. 額縁の中に描画可能で、はみだせない。(クリッピング
  2. 額縁の大きさを変えても描画された内容は変わらない。(マトリックスが追従しない)
  3. 額縁の中がマウスに反応する領域である。(インタラクティブ領域)
  4. コンポーネントレイアウトする時の根拠となる。(レイアウト

一方でFlashのSpriteクラスは、悉くこの意味を覆してくれます。

  1. 額縁など初めから無いので、どこにでも描画可能。
  2. width, heightを変えると、マトリックスが自動的に変わって、描画された内容がスケールする。
  3. マウスに反応するのは、描画した領域かhitAreaという別の物。
  4. コンポーネントレイアウトに入れようとすると、描画されている領域とは異なった根拠が必要になる。

これだけ違うとUX-Frameworkで「領域」というものをどう扱えばいいのか途方に暮れてしまいそうです。しかし、無い頭で頑張って考えた結果、

  1. デフォルトクリッピングしない。フラグで切り替える。
  2. 通常はマトリックス追従しない。Scalableというコンポーネントでは、デフォルト追従して、フラグで切り替える。
  3. マウスの反応は、描画領域もしくはhitArea。
  4. レイアウト用の領域を別途独立に設定できるようにする。

とすれば、結構すっきりと解決できそうです。

[追記]

リポジトリにディレクトリ構造と空のファイルを少しだけコミットしておきました。

http://code.google.com/p/ux-framework/

EddieEddie2012/04/08 04:40Action requires kwnoldege, and now I can act!

hnfujghtxhnfujghtx2012/04/08 14:19OsdXUV <a href="http://ejuiwapueyql.com/">ejuiwapueyql</a>

snnamjpspcmsnnamjpspcm2012/04/08 16:26gVZW6y <a href="http://yosypwworbnj.com/">yosypwworbnj</a>

lsgxgqraslnlsgxgqrasln2012/04/10 06:56m0Qisn <a href="http://trlkhxwkuwut.com/">trlkhxwkuwut</a>

2009-01-19Eventチェーンについて

[Event][flash9]Eventチェーンについて

20:24 |  [Event][flash9]Eventチェーンについて - UX-Framework開発日誌 を含むブックマーク はてなブックマーク -  [Event][flash9]Eventチェーンについて - UX-Framework開発日誌

EventDispatcherクラスのインスタンスではaddEventListener や removeEventListener メソッドを使ってEventListenerを管理します。

しかし、defaultの振る舞い(TextFieldがTEXT_INPUTイベント時に文字を入力するとか) は別で管理しているらしく、その動作を直接removeしたり上書きしたりすることはできないようでした。そのかわりにpreventDefault()というメソッドがEventインスタンスにあり、これを呼べばdefaultの動作を起こさないということができます。


また、子コンポーネントで(MOUSE_DOWNやKEY_DOWN等の)イベントが発生した時には、子だけでなく、その親や先祖のコンポーネントにもイベントが伝わるようです。Eventインスタンスには stopPropagation() というメソッドがあり、このメソッドを呼べば、親以上にイベントは伝わらないようにすることができます。また、複数の同じタイプのEventListenerを追加した場合に、あるEventListenerの途中で、それ以上他のEventListenerにはイベントを伝わらなくすることもできます。そのためにはstopImmediatePropagation() というメソッドを呼べばいいそうです。


試しにTextFieldクラスをextendsして Emacsのように Ctrl-f でキャレットを一つ前に、 Ctrl-b で一つ後ろに動かすTextAreaクラスを作って見ました。

Ctrlが押されているときにはキーがinputされても文字を入力しないようにpreventDefault()メソッドを使っています。

import flash.text.TextField;
import flash.text.TextFieldType;
import flash.events.KeyboardEvent;
import flash.events.TextEvent;

class TextArea extends TextField {
	
	var is_ctrl_down : Bool;
	
	public function new () {
		super();
		this.type = TextFieldType.INPUT;
		this.border = true;
		this.multiline = true;
		this.wordWrap = true;
		this.addEventListener(KeyboardEvent.KEY_DOWN, onKeyDown);
		this.addEventListener(KeyboardEvent.KEY_UP, onKeyUp);
		this.addEventListener(TextEvent.TEXT_INPUT, onTextInput);
		this.is_ctrl_down = false;
	}
	
	private function onKeyDown (e : KeyboardEvent) {
		if (e.ctrlKey) {
			switch String.fromCharCode (e.charCode) {
					case "f": {
						var next = this.caretIndex + 1;
						this.setSelection (next, next);
					}
					case "b": {
						var prev = this.caretIndex - 1;
						this.setSelection (prev, prev);
					}
				}
			is_ctrl_down = true;
		}
	}
	
	private function onKeyUp (e : KeyboardEvent) {
		if (e.ctrlKey) is_ctrl_down = false;
	}
	
	private function onTextInput (e : TextEvent) {
		if (is_ctrl_down) e.preventDefault();
	}
	
}

JanayeJanaye2011/07/21 04:06Woot, I will crtaeinly put this to good use!

LaineyLainey2011/07/22 02:01If my problem was a Death Star, this article is a photon tropdeo.

iepzdqhvldiepzdqhvld2011/07/22 18:18Iav0IQ <a href="http://krfvmkgokkbz.com/">krfvmkgokkbz</a>

ovtknddueovtknddue2011/07/23 00:019dOuPc , [url=http://dkrhuxauldqk.com/]dkrhuxauldqk[/url], [link=http://jpzfcbjzmgai.com/]jpzfcbjzmgai[/link], http://hgquqdhuvnms.com/

fjhmugdfxcfjhmugdfxc2011/07/24 21:29duVohc <a href="http://ktzvxssqijgh.com/">ktzvxssqijgh</a>

aerlbyjvnaerlbyjvn2011/07/25 01:58npHo7q , [url=http://pweqvdopdpqv.com/]pweqvdopdpqv[/url], [link=http://ihjdungaiacx.com/]ihjdungaiacx[/link], http://zgxbkpqqjjlj.com/

ElouiseElouise2012/12/07 07:17Wow I must cofness you make some very trenchant points.

hrgwxlbmfhxhrgwxlbmfhx2012/12/09 20:42aHjBTv , [url=http://iioznkljwvbu.com/]iioznkljwvbu[/url], [link=http://hsfvodiumgbv.com/]hsfvodiumgbv[/link], http://yyrxoqvrpxib.com/

lqyzuslqyzus2012/12/10 10:35vguSbK <a href="http://qevulrtzcaby.com/">qevulrtzcaby</a>

zoueyytodirzoueyytodir2012/12/12 10:44flib7t , [url=http://apaoxkbyltch.com/]apaoxkbyltch[/url], [link=http://zpgawflhyclb.com/]zpgawflhyclb[/link], http://cxfbddokvzvi.com/

ufbeaunawvdufbeaunawvd2013/01/18 11:09n4Y9V6 , [url=http://hrqrwatfuttj.com/]hrqrwatfuttj[/url], [link=http://acmpubagmpjd.com/]acmpubagmpjd[/link], http://soprdlsoytop.com/

2009-01-16フォーカスチェーンの管理とその階層

フォーカスチェーンの管理とその階層

| 18:30 | フォーカスチェーンの管理とその階層 - UX-Framework開発日誌 を含むブックマーク はてなブックマーク - フォーカスチェーンの管理とその階層 - UX-Framework開発日誌

ボタンやチェックボックスなどを実装する上で重要なフォーカスの概念とその連鎖の設計を考える上で、既存のTextFieldなどのFocusの挙動を無視できないので調べてみました。

flash9ではSpriteやTextFieldクラスの親であるInteractiveObjectクラスにtabEnabledプロパティやtabIndexプロパティがあり、フォーカスを設定できます。しかし、tabキーを押して遷移するフォーカスチェーンは一つの階層しか存在しないようでした。

flash8以前ではTextFieldクラスやMovieClipクラスがtabEnabledプロパティやtabIndexプロパティを直接もっていました。フォーカスチェーンの概念はflash9と同様の用です。

2009-01-15動的ロード このエントリーを含むブックマーク

前回のエントリでは、swfファイルを静的にリンクしていましたが、これでは柔軟性に欠けます。そこで、flash.display.Loaderクラスを使ったswfファイルの動的ロードを試してみて、無事確認できました。ただ、この方法はflash9の方法なので、flash8の方法も確認しておく必要があるでしょう。

あと、今日分かった事。

  1. AsWing素晴しい。レイアウトもちゃんとあるので、要調査。ただ、AsWing AS3はAS2とは袂を分けている様子。
  2. Tweenerはflash8,9のどちらでも問題なさそう。