這篇教程講述了一個通用解決方案,就是使用一個通用的窗體來適應不同窗體情況(例如iPhone和iPad),而不是每個窗體情況使用不同的窗體。
在FireMonkey Mobile Form Designer中,你可以預覽用戶界面,而不需要在Device上運行應用程序-只需要在右上角的下拉框中更改一下Device或排列方向:
每個FireMonkey組件都有一個Owner,Parent或Children
首先,每個FireMonkey組件都有Owner,Parent,Children。如果你在窗體上放了一個組件,那麼這個窗體就成了組件的Owner和Parent。
如果你添加了組件(例如,Button,Label,或其他控件)到其他組件上(例如ToolBar),那麼這個ToolBar就是Button,Label和其他控件的Parent和Owner。你可以在Structure View的TreeView中以圖形方式呈現的父子關係圖。
子控件的佈局是相對於它的父控件而言的。在下圖中,Label1是ToolBar1的子控件,Label1的佈局是相對於ToolBar1的。
使用FireMonkey控件常用的Layout相關屬性
使用Align屬性
控件的Align屬性決定了當父控件的四條邊,或中心,全部初始或父控件重新調整過尺寸時,控件是否自動重新排列或/重新調整尺寸。Align屬性的默認值爲alNone,意味着不自動計算:控件永遠停留在原來的地方。
Align屬性的典型值如下(藍色的區域表示是子控件):
如果你使用alTop,alBottom,alLeft,alRight,其他組件的Align屬性使用剩餘的區域。
剩餘區域的大小和形狀(alClient)也隨着設備的排列方向而改變,也基於窗體類型(iPhone或iPad)。
下圖展示了當你有兩個組件使用alTop,一個組件使用alClient的情況下,橫放(水平)和豎放(垂直)的佈局。
使用Margins屬性
Margins確保控件由父控件自動排列時與各控件之間的距離。
在下圖中,左路邊的組件(alClient)使用Margins屬性來確定組件四周的空隙。
使用Padding屬性
Padding設置父控件內容盒子的邊距。在ObjectInspector,你可以爲Padding設置值(像素):
- Left
- Right
- Bottom
- Top
在下圖中,父組件(包含兩個區域)使用Padding屬性來確保內部的邊距:
使用Anchors屬性
如果你在ToolBar的上方有一個Edit控件,你可能想要在Edit控件的右邊和窗體的邊(ToolBar)保持固定的距離。Anchors能讓你來指定控件相對於父控件的邊保持固定的距離。
如果你想要Edit控件與ToolBar(它的父控件)保持相應的位置,你可以設置Anchros屬性爲akLeft,akTop,akRight。當ToolBar調整過尺寸時,Edit控件也會根據Anchors設置來調整大小:
Button控件的Anchors屬性
如果在ToolBar的右邊有一個Button控件,你可能想要按鈕控件的右邊和Form的邊之間保持相同的距離。然而,你可能不想要保存按鈕控件左邊和Form左邊保持相同的距離。在這種情況下,你可以設置Anchors屬性爲akTop,akRight(取消選擇akLeft),以便於Button控件與ToolBar(父控件)上邊和右邊保持相同的距離。
使用TLayout組件
TLayout,是一個在運行時不可見的組件,可以用來將子控件分組,並可以將它們作爲一個整體來操作。例如,你可以只需要設置Layout的Visible屬性就可以設置一組控件的可視性。TLayout不會自動設置子控件的任意屬性。
要選擇TLayout的子控件,請使用Structure View。
選中你想要移動的控件。然後拖動這些控件到父控件上,然後放開。在Structure View中,這些控件現在是它們的新父控件的子控件了:
你可以使用Align,Padding,Margins,Anchors,以及TLayout的其他屬性來定義一個指定區域的Layout。你可以像在HTML中的DIV標記一樣來使用TLayout組件。
處理複雜界面:使用TVertScrollBox組件
通常,你不需要你的窗體有太多東西,這可能要求用戶來滾動界面。很多情況下,你可以使用TabControl的多個分頁來以免使用滾動。
如果你需要放很多東西在你的窗體上,你可以使用TVertScrollBox組件來定義一個滾動區域,如下描述:
1.在FireMonkey MobileForm Designer中選擇Custom Device。
2.通過拖動設計器的邊框來達到你想要的形狀和尺寸。
3.拖一個TVertScrollBox組件,設置它的Align屬性爲alClient。這會讓TVertScrollBox填滿整個客戶區。
4.將組件放在TVertScrollBox上:
當你在運行時用手指滑動界面的時候就可以滾動這個窗體。