ページへ戻る

− Links

 印刷 

Feathersのコンポーネント一覧と概要 :: NJF Wiki

xpwiki:Feathersのコンポーネント一覧と概要

ページ内コンテンツ
  • 初めに
    • Alert
    • AutoComplete
    • Button
    • ButtonGroup
    • Callout
    • Check
    • DateTimeSpinner
    • DefaultListItemRenderer and DefaultGroupedListItemRenderer
    • Drawers
    • GroupedList
    • Header
    • ImageLoader
    • Label
    • LayoutGroup
    • List
    • NumericStepper
    • PageIndicator
    • Panel
    • PanelScreen
    • PickerList
    • ProgressBar
    • Radio
    • Screen
    • ScreenNavigator
    • ScrollBar
    • ScrollContainer
    • ScrollScreen
    • ScrollText
    • SimpleScrollBar
    • Slider
    • SoundPlayer
    • SpinnerList
    • StackScreenNavigator
    • TabBar
    • TextArea
    • TextInput
    • ToggleButton
    • ToggleSwitch
    • WebView
    • VideoPlayer

初めに anchor.png[1] Edit [2]

Feathersのコンポーネントは便利だが、名前だけではどんなUIか少しわかりづらい。 公式ページに例もある[3]のだが、ひとつずつ確かめるのも面倒なので、簡単に説明した一覧表があれば便利かと作成中。

Page Top

Alert anchor.png[4] Edit [5]

アラート表示をポップアップする。

alert.png[6]

手軽だがPopUpManager編集[7]を使ったほうが柔軟性は高い

Page Top

AutoComplete編集[8] anchor.png[9] Edit [10]

テキストの自動補完。入力フィールドに数文字入れると候補を表示する。

autoComplete.png[11]

Page Top

Button anchor.png[12] Edit [13]

通常のボタン。 詳しくはStarling+Feathersでボタン[14]

Page Top

ButtonGroup編集[15] anchor.png[16] Edit [17]

ボタンをグループ化してくれる。グループ毎にレイアウトやボタンのデザイン、イベントの取得が可能になる。

詳しくはStarling+FeathersのButtonGroup[18]

Page Top

Callout anchor.png[19] Edit [20]

吹き出し

callOut.png

Page Top

Check anchor.png[21] Edit [22]

チェックボックス。ToggleButton編集[23]の見た目が変わっただけ。

Page Top

DateTimeSpinner編集[24] anchor.png[25] Edit [26]

日時選択用のスピナー

dateTimeSpinner.png

Page Top

DefaultListItemRenderer編集[27] and DefaultGroupedListItemRenderer編集[28] anchor.png[29] Edit [30]

リストなどの各項目を表示している部分。

listItem.png[31]

リストの各項目に背景、アイコンやテキスト、ボタンなど入れたいときに編集する

Starling+Feathersのリスト[32]などを参照のこと。

Page Top

Drawers anchor.png[33] Edit [34]

画面外から引き出しのようにウインドウをスライド・インさせる。

公式サンプルはこちら[35]

Page Top

GroupedList編集[36] anchor.png[37] Edit [38]

グループ化されたリスト

groupedList.png[39]

Page Top

Header anchor.png[40] Edit [41]

画面上部のヘッダー表示。テキストと左右にボタンが配置できるので、真ん中にタイトル、左に戻るボタン、右に設定ボタンというようなよくあるレイアウトが簡単にできる。 詳しくはStarling+Feathersのヘッダー[42]

Page Top

ImageLoader編集[43] anchor.png[44] Edit [45]

外部画像表示用のローダー。詳しくはStarling+FeathersのImageLoaderを使う[46]

Page Top

Label anchor.png[47] Edit [48]

テキスト表示ラベル。TextField編集[49]を直接使うよりもスキンの変更などに柔軟に対応できる。

Page Top

LayoutGroup編集[50] anchor.png[51] Edit [52]

描画オブジェクトの配置を制御する

Page Top

List anchor.png[53] Edit [54]

一覧を表示する。

list.png[55]

一覧表示ではたぶん一番使うUI。ほかのリストもこれを内部的に使っているので習得必須。 詳しくはStarling+Feathersのリスト[32]

Page Top

NumericStepper編集[56] anchor.png[57] Edit [58]

数値選択用のステッパー。 numricalStepper.png

Page Top

PageIndicator編集[59] anchor.png[60] Edit [61]

何ページ目かをグラフィカルに表示する。 pageIndicator.png

Page Top

Panel anchor.png[62] Edit [63]

ScrollContainer編集[64]にヘッダーとフッターがつけられるようになった物。

Page Top

PanelScreen編集[65] anchor.png[66] Edit [67]

PanelとScreenをあわせた物。画面遷移できるPanel

Page Top

PickerList編集[68] anchor.png[69] Edit [70]

ボタンを押すとリストが現れる、コンボボックス的なもの

Page Top

ProgressBar編集[71] anchor.png[72] Edit [73]

進行状況を表示する

Page Top

Radio anchor.png[74] Edit [75]

ラジオボタン。1つだけ選択するときに使う。

Page Top

Screen anchor.png[76] Edit [77]

画面。ScreenNavigator編集[78]を使うと画面遷移が容易に実装できる。

詳細はStarling+Feathersで画面遷移[79]を参照のこと。

Page Top

ScreenNavigator編集[78] anchor.png[80] Edit [81]

Screenと合わせて画面遷移の実装で使う

詳細はStarling+Feathersで画面遷移[79]を参照のこと。

Page Top

ScrollBar編集[82] anchor.png[83] Edit [84]

スクロールバー。単体でよりリストなどの一部として使うことが多い

Page Top

ScrollContainer編集[64] anchor.png[85] Edit [86]

スクロール領域。詳しくはStarling+FeathersのScrollContainerを使う[87]

Page Top

ScrollScreen編集[88] anchor.png[89] Edit [90]

画面全体がスクロール領域になっている。Screenの一種でScreenNavigator編集[78]で使うと画面遷移も行える。

Page Top

ScrollText編集[91] anchor.png[92] Edit [93]

スクロールするテキスト領域。 詳しくはStarling+Feathersのスクロールテキスト[94]

Page Top

SimpleScrollBar編集[95] anchor.png[96] Edit [97]

Page Top

Slider anchor.png[98] Edit [99]

音量などの上限と下限のある数値の入力で使う。見た目はスクロールバーと同じ

Page Top

SoundPlayer編集[100] anchor.png[101] Edit [102]

Page Top

SpinnerList編集[103] anchor.png[104] Edit [105]

選択領域つきのリスト

spinnerList.png

Page Top

StackScreenNavigator編集[106] anchor.png[107] Edit [108]

ScreenNavigator編集[78]と同様に画面遷移を管理出来るが、画面遷移をスタックしてくれるので、画面を戻る処理が楽になる。

Starling+FeathersでStackScreenNavigator[109]を参照のこと。

Page Top

TabBar編集[110] anchor.png[111] Edit [112]

よくスマホアプリにある、画面の上や下につけるタブボタン

Page Top

TextArea編集[113] anchor.png[114] Edit [115]

Page Top

TextInput編集[116] anchor.png[117] Edit [118]

テキスト入力ボックス。詳しくはStarling+Feathersでテキスト入力[119]

Page Top

ToggleButton編集[23] anchor.png[120] Edit [121]

選択・非選択状態のあるボタン。詳しくはStarling+Feathersでトグルボタン[122]

Page Top

ToggleSwitch編集[123] anchor.png[124] Edit [125]

Page Top

WebView編集[126] anchor.png[127] Edit [128]

ネイティブWebブラウザのラッパー。座標の調整とかがもとのWebView編集[126]より楽になる。

Page Top

VideoPlayer編集[129] anchor.png[130] Edit [131]


Last-modified: 2016-03-20 (日) 13:57:08 (JST) (2958d) by njf