使用 IntraWeb (5) - 頁面布局之 TFrame

IW 對 TFrame(還是之前那個), 這在頁面布局中很有用.

如果多個頁面都有一個共同的部分(譬如頁眉、頁腳、菜單、邊欄等), 可以將這些共同的部分放在一個 TFrame 中, 從而方便統一與修改.

IW 也對 TMainMenu 提供了支持, 本例就做一個共享的菜單吧.

---

新建工程后, 添加一個 New Frame:

---

---

新建的 TIWFrame1 中, 已自動添加了一個 IWFrameRegion(TIWRegion), 先選一下 IWFrameRegion(控件要放在它上面);

然后分別添加 TIWMenu、TMainMenu(TMainMenu 要附加在 TIWMenu 使用).

---

---

之后的工作在設計時完成比較簡單, 這里全部是用代碼實現的.

雙擊 Frame 窗體寫代碼(因為 TFrame 沒有 OnCreate 事件, 所以它使用的是 IWFrameRegion.OnCreate):

---

unit Unit2;

interface

uses
  SysUtils, Classes, Controls, Forms, IWVCLBaseContainer, IWColor, IWContainer, IWRegion, Vcl.Menus,
  IWVCLBaseControl, IWBaseControl, IWBaseHTMLControl, IWControl, IWCompMenu, IWHTMLContainer, IWHTML40Container;

type
  TIWFrame1 = class(TFrame)
    IWFrameRegion: TIWRegion;
    IWMenu1: TIWMenu;
    MainMenu1: TMainMenu;
    procedure IWFrameRegionCreate(Sender: TObject);
    procedure MyOnClick(Sender: TObject);
  private
    { Private declarations }
  public
    { Public declarations }
  end;

implementation

{$R *.dfm}

uses IWInit; //為使用 WebApplication

{給子菜單准備的點擊事件}
procedure TIWFrame1.MyOnClick(Sender: TObject);
begin
  WebApplication.ShowMessage(TMenuItem(Sender).Caption);
end;

procedure TIWFrame1.IWFrameRegionCreate(Sender: TObject);
var
  mItemA, mItemB, mItem: TMenuItem;
begin
  {提前設定這個 Frame 在其他容器中的位置與大小}
  Align := alTop;
  Height := IWMenu1.Height;

  {設置 IWMenu1}
  IWMenu1.Align := alTop;
  IWMenu1.AttachedMenu := MainMenu1; //關鍵代碼

  IWMenu1.SubMenuStyle.BGColor := clWebWHITESMOKE;
  IWMenu1.SubMenuStyle.BorderColor := clWebWHITESMOKE;
  IWMenu1.SubMenuStyle.ItemBGColor := clWebWHITESMOKE;
  IWMenu1.SubMenuStyle.DisabledItemBGColor := clWebWHITESMOKE;
  IWMenu1.SubMenuStyle.SelectedItemBGColor := clWebWHEAT;

  {設置 IWFrameRegion}
  IWFrameRegion.ClipRegion := False; //關鍵代碼
  IWFrameRegion.Height := IWMenu1.Height;

  {建立菜單, 這在設計時很容易}
  mItemA := MainMenu1.CreateMenuItem;
  mItemA.Caption := 'Menu A';
  MainMenu1.Items.Add(mItemA);

  mItemB := MainMenu1.CreateMenuItem;
  mItemB.Caption := 'Menu B';
  mItemB.OnClick := MyOnClick;
  MainMenu1.Items.Add(mItemB);

    mItem := MainMenu1.CreateMenuItem;
    mItem.Caption := 'Menu A1';
    mItem.OnClick := MyOnClick;
    mItemA.Add(mItem);

    mItem := MainMenu1.CreateMenuItem;
    mItem.Caption := '-';
    mItemA.Add(mItem);

    mItem := MainMenu1.CreateMenuItem;
    mItem.Caption := 'Menu A2';
    mItemA.Add(mItem);

      mItemA := mItem;
      mItem := MainMenu1.CreateMenuItem;
      mItem.Caption := 'Menu A21';
      mItem.OnClick := MyOnClick;
      mItemA.Add(mItem);

      mItem := MainMenu1.CreateMenuItem;
      mItem.Caption := 'Menu A22';
      mItem.OnClick := MyOnClick;
      mItemA.Add(mItem);
end;

end.

---

按下面圖示操作, 把剛才制作的 Frame 添加到 Tool Palette 以方便其他窗口(頁面)調用.

---

---

然后就和添加其他控件一樣, 從 Tool Palette 把剛剛制作的 TIWFrame1Template 添加到頁面就成了.

---

---