フォームビジュアルデザイン

概要

プロジェクトファイルリストのVJSP フレームワークプロジェクト/src/main/static/フォルダ内で、プレビューが必要なHTMLフォームファイルを探します。該当ファイルを右クリックし、ポップアップメニューから【VJSP編集モード】オプションを選択します。システムは自動的にフォームフロントエンドプレビューウィンドウを開き、フォームのページスタイル、インタラクション効果、フィールドレイアウトをリアルタイムで表示し、開発者がフォームデザインを迅速に調整できるようにします。

上部機能エリア

1. 元に戻す: クリックして直前の操作を元に戻します
2. 保存: クリックして現在のフォーム設定を保存します
3. プロジェクト: クリックしてプロジェクトを開きます
4. ウィンドウ: クリックしてウィンドウを開きます
5. 実行: クリックして現在のページ設定を自動保存し、現在の設定効果を確認します
6. スクリプト生成: クリックしてスクリプト生成ページに移動し、スクリプト設定を行います
7. クリア: クリックして現在のページのすべてのレイアウト設定をクリアします
8. フォーマット: 「コードエディタ」、「スクリプトエディタ」、「スタイル編集」内のコードをフォーマットできます

右側機能エリア

1. ツールボックス

ツールボックス内でツールを選択し、ツールをデザイナー内にドラッグして、フォームページのスタイルページを編集します

2. 属性設定

デザイナー内のコンポーネントをクリックすると、右側に属性ページが開き、コンポーネントの属性を設定できます

3. イベント

右側ツールボックスの下部にある【イベント】タブをクリックして、コントロールのイベントを設定します

4. スタイル

右側ツールボックスの下部にある【スタイル】タブをクリックして、コントロールのスタイルを設定します

下部機能エリア

1. デザイナー: フォームページのスタイルをリアルタイムで表示し、変更を加えます
2. コードエディタ: クリックしてフォームコードエディタを開きます
3. スクリプトエディタ: クリックしてフォームスクリプトエディタを開きます
4. スタイル編集: クリックしてフォームスタイル編集を開きます
5. タグ: クリックしてフォームタグを表示し、フォームのタグを確認し、修正や削除の操作を行います