UIの設計

詳細アイコン 詳細

  1. エディタ・ウィンドウで、上部のJSFページ・アイコン Login.jsp」タブを選択して、ページを手前に表示します。
  2. コンポーネント・パレットで、ドロップダウン・リストからJSFページを選択し、「HTML」パネルを開きます。
    詳細アイコン 詳細
  3. 入力テキスト・アイコン 入力テキスト」をクリックしてビジュアル・エディタにドラッグし、空白ページにドロップして入力テキスト・フィールドを追加します。
    詳細アイコン 詳細
  4. コマンド・ボタン・アイコン コマンド・ボタン」をクリックしてページにドラッグし、追加した入力フィールドの横にドロップします。プロパティ・インスペクタの「共通」セクションで「値」フィールドをクリックし、デフォルト・テキストをLoginに変更します。
  5. エディタ・ウィンドウで、上部のJSFページ・アイコン Success.jsp」タブを選択して、ページを手前に表示します。
  6. コンポーネント・パレットで、出力テキスト・アイコン 出力テキスト」をビジュアル・エディタの空白ページにドラッグ・アンド・ドロップします。プロパティ・インスペクタの「共通」セクションで、「値」フィールドをクリックして、デフォルト・テキストをYou have successfully logged inに変更して[Enter]を押します。
  7. エディタ・ウィンドウで、上部のJSFページ・アイコン Failure.jsp」タブを選択して、ページを手前に表示します。出力テキストの値にLogin has failedを使用してステップ6を繰り返します。
  8. 「すべて保存」アイコン すべて保存」をクリックして作業を保存します。
    詳細アイコン IDE表示の詳細説明
キュー・カード・アイコン 次のステップ