4: 2016-02-24 (水) 09:13:54 njf[6] [7] [8] | 現: 2016-03-20 (日) 21:57:08 njf[6] [9] [10] | ||
---|---|---|---|
Line 1: | Line 1: | ||
*初めに [#hbaf93e1] | *初めに [#hbaf93e1] | ||
Feathersのコンポーネントは便利だが、名前だけではどんなUIか少しわかりづらい。 | Feathersのコンポーネントは便利だが、名前だけではどんなUIか少しわかりづらい。 | ||
- | [[公式ページに例もある:http://feathersui.com/examples/components-explorer/]]のだが、ひとつずつ確かめるのも面倒なので、簡単に説明した一覧表があれば便利かと作成中。 | + | [[公式ページに例もある:http://feathersui.com/examples/]]のだが、ひとつずつ確かめるのも面倒なので、簡単に説明した一覧表があれば便利かと作成中。 |
**Alert [#e267427c] | **Alert [#e267427c] | ||
- | アラート表示をポップアップする。手軽だがPopUpManagerを使ったほうが柔軟性は高い | + | アラート表示をポップアップする。 |
+ | |||
+ | &ref(alert.png,mw:480,mh:360); | ||
+ | |||
+ | 手軽だがPopUpManagerを使ったほうが柔軟性は高い | ||
**AutoComplete [#dcd53a02] | **AutoComplete [#dcd53a02] | ||
Line 18: | Line 22: | ||
**ButtonGroup [#z7c33461] | **ButtonGroup [#z7c33461] | ||
+ | |||
+ | ボタンをグループ化してくれる。グループ毎にレイアウトやボタンのデザイン、イベントの取得が可能になる。 | ||
+ | |||
+ | 詳しくは[[Starling+FeathersのButtonGroup]] | ||
**Callout [#yb948543] | **Callout [#yb948543] | ||
Line 26: | Line 34: | ||
**Check [#q1befe13] | **Check [#q1befe13] | ||
+ | |||
+ | チェックボックス。ToggleButtonの見た目が変わっただけ。 | ||
**DateTimeSpinner [#n46dc7b4] | **DateTimeSpinner [#n46dc7b4] | ||
Line 35: | Line 45: | ||
**DefaultListItemRenderer and DefaultGroupedListItemRenderer [#k11ea6c3] | **DefaultListItemRenderer and DefaultGroupedListItemRenderer [#k11ea6c3] | ||
- | リストなどの各項目を表示している部分。リストの各項目にアイコンやテキスト、ボタンなど入れたいときに編集する | + | リストなどの各項目を表示している部分。 |
+ | |||
+ | &ref(listItem.png,mw:480,mh:360); | ||
+ | |||
+ | リストの各項目に背景、アイコンやテキスト、ボタンなど入れたいときに編集する | ||
+ | |||
+ | [[Starling+Feathersのリスト]]などを参照のこと。 | ||
**Drawers [#j011b648] | **Drawers [#j011b648] | ||
+ | |||
+ | 画面外から引き出しのようにウインドウをスライド・インさせる。 | ||
+ | |||
+ | [[公式サンプルはこちら:http://feathersui.com/examples/drawers-explorer/]] | ||
**GroupedList [#mc59e2dd] | **GroupedList [#mc59e2dd] | ||
Line 46: | Line 66: | ||
**Header [#s97d7c44] | **Header [#s97d7c44] | ||
+ | |||
+ | 画面上部のヘッダー表示。テキストと左右にボタンが配置できるので、真ん中にタイトル、左に戻るボタン、右に設定ボタンというようなよくあるレイアウトが簡単にできる。 | ||
+ | 詳しくは[[Starling+Feathersのヘッダー]]。 | ||
**ImageLoader [#s6b2f89d] | **ImageLoader [#s6b2f89d] | ||
Line 53: | Line 76: | ||
**Label [#f586c583] | **Label [#f586c583] | ||
- | テキスト表示ラベル。見出しなどの用途に応じて大きさなどが変えられる。 | + | テキスト表示ラベル。TextFieldを直接使うよりもスキンの変更などに柔軟に対応できる。 |
**LayoutGroup [#m291cf18] | **LayoutGroup [#m291cf18] | ||
+ | |||
+ | 描画オブジェクトの配置を制御する | ||
**List [#u3b459b5] | **List [#u3b459b5] | ||
Line 64: | Line 89: | ||
一覧表示ではたぶん一番使うUI。ほかのリストもこれを内部的に使っているので習得必須。 | 一覧表示ではたぶん一番使うUI。ほかのリストもこれを内部的に使っているので習得必須。 | ||
- | 詳しくは[[Staring+Feathersのリスト]]。 | + | 詳しくは[[Starling+Feathersのリスト]]。 |
**NumericStepper [#h6155bde] | **NumericStepper [#h6155bde] | ||
Line 77: | Line 102: | ||
**Panel [#ya9f6042] | **Panel [#ya9f6042] | ||
+ | |||
+ | ScrollContainerにヘッダーとフッターがつけられるようになった物。 | ||
**PanelScreen [#xfe01bfd] | **PanelScreen [#xfe01bfd] | ||
+ | |||
+ | PanelとScreenをあわせた物。画面遷移できるPanel | ||
**PickerList [#g9198967] | **PickerList [#g9198967] | ||
Line 89: | Line 118: | ||
**Radio [#j3a3f206] | **Radio [#j3a3f206] | ||
+ | |||
+ | ラジオボタン。1つだけ選択するときに使う。 | ||
**Screen [#m474700b] | **Screen [#m474700b] | ||
画面。ScreenNavigatorを使うと画面遷移が容易に実装できる。 | 画面。ScreenNavigatorを使うと画面遷移が容易に実装できる。 | ||
+ | |||
+ | 詳細は[[Starling+Feathersで画面遷移]]を参照のこと。 | ||
**ScreenNavigator [#kd11a50f] | **ScreenNavigator [#kd11a50f] | ||
Screenと合わせて画面遷移の実装で使う | Screenと合わせて画面遷移の実装で使う | ||
+ | |||
+ | 詳細は[[Starling+Feathersで画面遷移]]を参照のこと。 | ||
**ScrollBar [#x48e6e4c] | **ScrollBar [#x48e6e4c] | ||
+ | |||
+ | スクロールバー。単体でよりリストなどの一部として使うことが多い | ||
**ScrollContainer [#l564639b] | **ScrollContainer [#l564639b] | ||
+ | |||
+ | スクロール領域。詳しくは[[Starling+FeathersのScrollContainerを使う]]。 | ||
**ScrollScreen [#ff0905c5] | **ScrollScreen [#ff0905c5] | ||
+ | |||
+ | 画面全体がスクロール領域になっている。Screenの一種でScreenNavigatorで使うと画面遷移も行える。 | ||
**ScrollText [#g4541d17] | **ScrollText [#g4541d17] | ||
スクロールするテキスト領域。 | スクロールするテキスト領域。 | ||
- | 詳しくは[[Staring+Feathersのスクロールテキスト]] | + | 詳しくは[[Starling+Feathersのスクロールテキスト]] |
**SimpleScrollBar [#c79cbdf3] | **SimpleScrollBar [#c79cbdf3] | ||
**Slider [#h648d69e] | **Slider [#h648d69e] | ||
+ | |||
+ | 音量などの上限と下限のある数値の入力で使う。見た目はスクロールバーと同じ | ||
**SoundPlayer [#lec59958] | **SoundPlayer [#lec59958] | ||
Line 123: | Line 166: | ||
**StackScreenNavigator [#g588c176] | **StackScreenNavigator [#g588c176] | ||
- | 画面遷移をスタックしてくれるので、画面を戻る処理が楽になる | + | ScreenNavigatorと同様に画面遷移を管理出来るが、画面遷移をスタックしてくれるので、画面を戻る処理が楽になる。 |
+ | |||
+ | [[Starling+FeathersでStackScreenNavigator]]を参照のこと。 | ||
**TabBar [#a9001bb6] | **TabBar [#a9001bb6] | ||
+ | |||
+ | よくスマホアプリにある、画面の上や下につけるタブボタン | ||
**TextArea [#j0dd26f5] | **TextArea [#j0dd26f5] | ||
Line 131: | Line 178: | ||
**TextInput [#a41e048f] | **TextInput [#a41e048f] | ||
- | テキスト入力ボックス。詳しくは[[Staring+Feathersでテキスト入力]] | + | テキスト入力ボックス。詳しくは[[Starling+Feathersでテキスト入力]] |
**ToggleButton [#ef9fd924] | **ToggleButton [#ef9fd924] | ||
+ | 選択・非選択状態のあるボタン。詳しくは[[Starling+Feathersでトグルボタン]] | ||
**ToggleSwitch [#q6929fd8] | **ToggleSwitch [#q6929fd8] | ||
**WebView [#rab46f04] | **WebView [#rab46f04] | ||
+ | |||
+ | ネイティブWebブラウザのラッパー。座標の調整とかがもとのWebViewより楽になる。 | ||
**VideoPlayer [#tb5acf42] | **VideoPlayer [#tb5acf42] |
(This host) = https://njf.jp