Skip to main content

ワイヤーフレーム

(Wireframe)

サンプル​

@startsalt
{+ **ログイン**
  .
  ユーザー名 | "ユーザ名を入力 "
  パスワード | "****      "
  .
  [ ログイン ] | [ キャンセル ]
  .
  <color:blue><u>パスワードを忘れた場合</u></color> | *
  .
}
@endsalt
PlantUML diagram

全体の設定​

タイトル​

タイトルを定義できます。

title 新基盤構築計画
PlantUML diagram

ヘッダ​

ヘッダを定義できます。

header 新基盤構築計画
PlantUML diagram

フッタ​

フッタを定義できます。

footer フッタ
PlantUML diagram

キャプション​

キャプションを定義できます。

caption キャプション
PlantUML diagram

すべて組み合わせると...​

PlantUML diagram

ボタン​

[ボタン]
PlantUML diagram

ラベル​

ラベル:
PlantUML diagram

テキストボックス​

"テキスト"
PlantUML diagram

ラジオボタン​

チェックなし​

() ラジオボタン
PlantUML diagram

チェックあり​

(X) ラジオボタン
PlantUML diagram

チェックボックス​

チェックなし​

[] チェックボックス
PlantUML diagram

チェックあり​

[X] チェックボックス
PlantUML diagram

ドロップダウン​

閉じた状態​

  ^閉じた状態^ |
PlantUML diagram

開いた状態​

  ^開いた状態　　　　　^^ item 1^^ item 2^ item 3^  |
PlantUML diagram

ツリー構造​

{T
 + ルートノード
 ++ サブノード1
 ++ サブノード2
 +++ サブノード2-1
 ++++ サブノード2-1-1
 ++ サブノード3
}
PlantUML diagram

スクロール​

両方​

{S
ノート1
.
some long text or somethings
}
PlantUML diagram

縦方向​

{SI
ノート1
.
some long text or somethings
}
PlantUML diagram

横方向​

{S-
ノート1
.
some long text or somethings
}
PlantUML diagram

タブ​

{/ 一般設定 | **セキュリティ** | その他 }
PlantUML diagram

ノート​

danger

現在、ワイヤーフレームではノートはサポートされていない模様です。

行コメント​

'から始まる行は行コメントとして扱われます。

ブロックコメント​

/*から*/まではブロックコメントとして扱われます。

warning

注意: ただし、行頭以外に/*を置いた場合にブロックコメントとして認識されないようです。
また行の途中で*/を記載してもその行の最後までブロックコメントとして処理されるようです。