FireMonkey(簡稱FMX)是一個跨平台的應用程序設計框架,這個框架其實不再將開發的重心放在PC端,畢竟Windows PC上還有強大的VCL框架。FMX重心還是在移動端多一些,而移動端的小屏設備使用Grid的場景很少,屏小數據多,體驗應該並不佳,使用ListView這種列表式控件就非常常見。
為了測試ListView的外觀,常常需要測試數據,好在LiveBidings有一個原型綁定源,可以輕鬆拿捏測試數據。
跟着下面的步驟開始吧,先開啓你的Delphi 12.3。
1. 單擊主菜單中的 File > New > Multi-Device Application - Delphi > Blank Application ,創建一個新的多設備應用程序。
建議立即單擊工具欄上的Save All按鈕,將單元文件保存為uMainForm.pas,將項目保存為LiveBinding_BindToListView.dproj。
你的項目結構應該像這樣:
2. 從工具面板,拖一個TListView控件,一個TPrototypeBindSource控件到主窗口。
在主窗口上選中ListView1控件,然後在屬性面板上指定其Align屬性為Client,設置其SearchVisible屬性為True,窗體看起來像下面這樣:

除了上述設置,還需設置ListView1控件的ItemAppearance.ItemAppearance屬性為ImageListItemRightButton,這樣ListView控件將會呈現為一個圖片,右側一個按鈕,中間是ListView項的文本。

注意: 當設置不同的ItemAppearance屬性後,ListView的可綁定的屬性也會相應的發生一些變化。
2. 右鍵單擊主窗口的PrototypeBindSource1控件,選擇“Fields Editor”菜單項,這將打開一個字段編輯窗口,在這裏可以像設置一個內存表一樣設置字段。
在Fields Editor的工具欄面板上單擊“Add”按鈕,將彈出一個包含數據的字段列表,按住Ctrl鍵,分別選擇ColorNames,Bitmaps和Currency字段數據,單擊“OK”按鈕完成原型數據的添加。

3. 準備好了控件和數據,接下來在任意位置右擊鼠標,從彈出的菜單中選擇“Bind Visually”菜單項,進入到LiveBindings Designer設計器。
- 從PrototypeBindSource1中選擇ColorsName1到ListView1的Item.Text。
- 從PrototypeBindSource1中選擇Bitmap1到ListView1的Item.Bitmap。
- 從PrototypeBindSource1中選擇CurrencyField1到ListView1的Item.ButtonText。

做完這幾步,在主窗體上,毫不意外一個TBindingList控件被添加來了。ListView已經可以預覽到測試數據,並且可以看到ListView的外觀呈現效果。

4. 最後給ListView1添加一個單擊事件,在主窗體中選中ListView1控件,然後進入到屬性面板,切換到Events標籤頁,找到OnButtonClick右側的文本框雙擊一下,Delphi會切換到代碼視圖,一個單擊事件的骨架代碼已經生成好。

注意:在生成代碼骨架後,建議在代碼中添加一行註釋,否則在下一次保存時,這個骨架代碼會被IDE給收回去。
請在代碼編輯器中輸入如下的代碼:
procedure TForm1.ListView1ButtonClick(const Sender: TObject;
const AItem: TListItem; const AObject: TListItemSimpleControl);
begin
const LItem = AItem as TListViewItem; //得到當前的單擊項。
//顯示當前選中的Item信息。
ShowMessage(LItem.Text + ' ' + LItem.ButtonText + ' 被單擊了.');
end;
5.現在就完成了所有的工作,萬事皆備,只欠一Run了,按下F9,或者是主菜單的“Run > Run”菜單項,一個漂亮的列表視圖出現了,它包含一個搜索框,單擊右邊的按鈕還能彈出詳細信息,可以滿足很多應用上的需求了。

在這一節中,學到了TListView和TProtoTypeBindingSource控件的用法,這為下一步繼續深入LiveBindings打下了堅實的基礎。