 |
|
|
|
|
|
|
楽々FrameworkII はアプリケーションの画面のデザインをより柔軟に行なうために、メ
ッセージファイル・スタイルシート・テンプレートといった機能をサポートしています。
ここではテンプレートについての説明及びその使用方法を示します。
テンプレート機能は、デザインに関する定義をプログラムに直接組み込まずに、別途HTML
ファイルに定義して規定のフォルダに保存するだけで、デザインを簡単に変更することが
出来ます。あらかじめ画面のイメージをHTML タグで記述したテンプレートを規定のディ
レクトリに保存することで、画面のレイアウトを変更します。
テンプレート自身は画面表示のデザインであって、テンプレート内でロジックを実装す
ることはできません。但しプログラム内で変数を定義し、テンプレート内にその変数をキーワードとして呼び出すことができますので、プログラム内で動的に発生した値をテンプレート
で利用することが可能です。
|
|
|
| |
（例１）詳細表示画面を変更 |
|
|
|
|
テンプレート
|
|
%%HEADER
%%TITLE
%%TEMPLATE result1
<TABLE BORDER="1">
<TR BGCOLOR="#ADD8E6" ALIGN="left">
<TH>%userid:name%</TH><TH>%usernm:name%</TH><TH>%pwpre_pw:name%</TH>
</TR>
<TR>
<TD>%userid%</TD><TD>%usernm%</TD><TD>%pwpre_pw%</TD>
</TR>
<TR BGCOLOR="#ADD8E6" ALIGN="left">
<TH COLSPAN = 2>%pwnew_pw:name %</TH><TH>%password_pw2:name%</TH>
</TR>
<TR>
<TD COLSPAN = 2>%pwnew_pw%</TD><TD>%password_pw2%</TD>
</TR>
</TABLE>
<BR>
%%END
%%PRINT page
%%FOOTER
|
|
|
|
|
|
適用前
|
|
|
|
|
|
|
|
適用後
|
|
|
|
|
|
| |
（例２）ログイン画面の変更 |
|
|
|
|
テンプレート
|
|
%%TITLE
%msg%
%form%
<CENTER>
<TABLE BORDER="0" WIDTH="25%" CELLSPACING="0" CELLPADDING="0">
<TR>
<TD ALIGN="center">
<FONT color="red">%errmsg%</FONT>
<TABLE BORDER="0" CELLSPACING="0" CELLPADDING="1" BGCOLOR="#3366CC">
<TR>
<TD>
<TABLE BORDER="0" BGCOLOR="#FFFFFF">
<TR>
<TD>
<TABLE BORDER="0" BGCOLOR="#3366CC">
<TR>
<TD>
<TABLE BORDER="0" BGCOLOR="#FFFFFF">
<TR ALIGN="center">
<TD COLSPAN="2" ALIGN="center">
<IMG SRC="/img/text1.gif" BORDER="0" WIDTH="265"
HEIGHT="31"><BR>
<IMG SRC="/img/none.gif" BORDER="0" WIDTH="1"
HEIGHT="12><BR>
</TD>
</TR>
<!-- ユーザID or Mailaddress -->
<TR>
<TD ALIGN="right" WIDTH="40%">ID</TD>
<TD ALIGN="left" WIDTH="80%">%userid%</TD>
</TR>
<!-- パスワード -->
<TR>
<TD ALIGN="right" WIDTH="40%">パスワード</TD>
<TD ALIGN="left" WIDTH="80%">%passwd%</TD>
</TR>
<!-- ログインボタン -->
<TR ALIGN="center">
<TD COLSPAN="2" ALIGN="center">
<BR><INPUT TYPE="image" SRC="/img/btn_login.gif"
NAME="SUBMIT" VALUE="ログイン" BORDER="0"><BR>
</TD>
</TR>
<!-- 新規登録 -->
<TR ALIGN="center">
<TD COLSPAN="2" ALIGN="center">
<IMG SRC="/img/line.gif" BORDER="0" WIDTH="268"
HEIGHT="8"><BR><BR>
<IMG SRC="/img/text2.gif" BORDER="0" WIDTH="265"
HEIGHT="31"><BR>
<IMG SRC="/img/btn_entry.gif" BORDER="0" WIDTH="97"
HEIGHT="21"><BR><BR>
</TD>
</TR>
</TABLE>
</TD>
</TR>
</TABLE>
</TD>
</TR>
</TABLE>
</TD>
</TR>
</TABLE>
<P>
</TD>
</TR>
</TABLE>
<IMG SRC = "img/none.gif" ALT ="" WIDTH="1" HEIGHT="28" BORDER="0"><BR>
</CENTER>
%footer%
|
|
|
|
|
|
適用前
|
|
|
|
|
|
|
|
適用後
|
|
|
|
|
|
|
|
|
|
|
|
|
