一步一步学习使用LiveBindingsLiveBindings与具有动态呈现的TListView引言什么是LiveBindings在Delphi和CBuilder的RAD开发中LiveBindings是一种强大的数据绑定框架。简单来说它就像一根“魔法导线”能自动将数据源如数据库、对象列表、内存数据集与UI控件如TListView、TLabel连接起来。当你修改数据时UI会自动更新反之操作UI也能同步数据。这一切无需编写繁琐的同步代码。今天我们将聚焦于LiveBindings与TListView的结合并实现一个“动态呈现”的例子——即列表项不仅能显示文本还能动态显示图片、进度条等复杂元素。想象一下一个待办事项列表每项有标题、完成进度条和状态图标这都能通过LiveBindings轻松实现。## 准备工作创建项目并添加控件在开始前请确保你安装了Delphi或CBuilder推荐10.3版本。我们将创建一个新的FireMonkeyFMX应用支持跨平台并加入以下控件- 一个TListView用于展示数据- 一个TPrototypeBindSource原型绑定源作为数据源- 一个TBindingsList绑定管理器这些控件在“LiveBindings”组件面板中。## 第一步理解LiveBindings的核心概念LiveBindings的核心是“绑定表达式”。你可以将控件的属性如TListView的ItemAppearance与数据源的字段如Name、Progress关联。例如BindSource1.Name会映射到列表项的标题。对于TListView我们需要设置其ItemAppearance为“动态呈现”模式如ListItemShowDetail或自定义模板这样才能容纳多元素。## 第二步配置数据源TPrototypeBindSourceTPrototypeBindSource是一个虚拟数据源可以快速生成测试数据。我们用它来模拟一个任务列表。1. 从组件面板拖入一个TPrototypeBindSource1到窗体。2. 双击它在“字段编辑器”中添加三个字段 -TaskName字符串类型任务名称 -Progress整数类型进度百分比 -IsComplete布尔类型是否完成3. 点击“生成数据”按钮它会自动创建一些示例记录。## 第三步设置TListView的动态呈现TListView默认显示简单文本但通过修改ItemAppearance属性它可以支持复杂布局。1. 选中ListView1在对象检查器中找到ItemAppearance属性。2. 将其设置为ListItemShowDetail或ImageListItemBottomDetail等取决于你的需求。3. 勾选ShowCheckboxes如果希望有复选框和SearchVisible搜索栏。这样列表项就能显示标题、副标题和图标了。## 第四步使用LiveBindings连接数据这是最关键的步骤。我们将使用TBindingsList和TBindExpression来绑定数据。1. 从组件面板拖入一个TBindingsList1。2. 双击它打开绑定编辑器。3. 点击“添加绑定”选择“控件”为ListView1属性为ItemAppearance注意实际上我们需要绑定的不是ItemAppearance而是数据内容。正确的做法是绑定到ListView1的Items属性但LiveBindings提供了更高级的方式——通过TBindList。注意TListView的LiveBindings通常通过TBindList进行。在FMX中我们可以直接将TPrototypeBindSource拖拽到ListView1上Delphi会自动创建绑定。但为了学习我们手动操作1. 在对象树中右键点击ListView1选择“LiveBindings Wizard…”。2. 选择“绑定到PrototypeBindSource”。3. 在向导中将字段映射 -TaskName→Text列表项标题 -Progress→Detail列表项副标题 -IsComplete→ImageIndex但这里我们需要自定义图像所以稍后处理向导会生成一个TBindList和多个TBindExpression。## 第五步实现动态呈现——显示进度条和图标默认的ListItemShowDetail只显示文本要显示进度条我们需要自定义ItemAppearance或使用ItemAppearanceObjects。这里我们采用更简单的方法通过事件OnUpdateObjects来动态修改控件。代码示例1动态添加进度条到列表项delphi// 在ListView1的OnUpdateObjects事件中procedure TForm1.ListView1UpdateObjects(const Sender: TObject; const AItem: TListViewItem);var ProgressBar: TProgressBar;begin // 查找是否已有进度条控件 ProgressBar : AItem.Objects.FindObjectTTProgressBar(ProgressBar); if ProgressBar nil then begin // 创建进度条 ProgressBar : TProgressBar.Create(AItem); ProgressBar.Name : ProgressBar; ProgressBar.Parent : AItem; // 设置位置和大小基于列表项布局 ProgressBar.Align : TAlignLayout.Bottom; ProgressBar.Height : 20; ProgressBar.Margins.Left : 50; // 留出图标空间 ProgressBar.Margins.Right : 10; ProgressBar.Margins.Bottom : 5; end; // 从数据源获取进度值这里需要绑定数据 // 注意实际开发中应通过LiveBindings传递数据 ProgressBar.Value : 50; // 示例值end;解释此代码在每个列表项渲染时被调用。我们检查是否已有进度条如果没有则创建并设置布局。Align : Bottom使其固定在底部。但这里硬编码了进度值下一步要用LiveBindings动态获取。## 第六步高级绑定——将数据传递给动态控件真正的动态呈现需要将数据源的字段值传递给动态创建的控件。我们可以通过TBindExpression或手动从数据源读取。这里使用TBindList的OnGetValue事件。代码示例2使用OnGetValue动态设置进度条值delphi// 在TBindList的OnGetValue事件中procedure TForm1.BindList1GetValue(Sender: TObject; AFieldName: string; var Value: TValue; var Handled: Boolean);begin // 当字段名为Progress时返回实际数据 if AFieldName Progress then begin // 假设当前项的数据来自TPrototypeBindSource Value : TPrototypeBindSource1.Current.FieldByName(Progress).AsInteger; Handled : True; // 表示已处理 end;end;// 然后修改OnUpdateObjects以使用此值procedure TForm1.ListView1UpdateObjects(const Sender: TObject; const AItem: TListViewItem);var ProgressBar: TProgressBar; ProgressValue: Integer;begin // 获取进度条 ProgressBar : AItem.Objects.FindObjectTTProgressBar(ProgressBar); if ProgressBar nil then begin // 通过LiveBindings获取当前项的进度值 // 这里使用BindList的FindBinding或直接访问数据源 ProgressValue : TPrototypeBindSource1.Current.FieldByName(Progress).AsInteger; ProgressBar.Value : ProgressValue; end;end;解释OnGetValue让我们可以拦截字段值请求从数据源返回真实数据。然后OnUpdateObjects读取该值并设置进度条。这样列表滚动时每个项都能显示正确的进度。## 第七步添加动态图标——根据状态显示不同图标类似地我们可以根据IsComplete字段显示“完成”或“未完成”图标。代码示例3动态设置图标delphiprocedure TForm1.ListView1UpdateObjects(const Sender: TObject; const AItem: TListViewItem);var Image: TImage; IsComplete: Boolean;begin // 查找或创建图像控件 Image : AItem.Objects.FindObjectTTImage(StatusImage); if Image nil then begin Image : TImage.Create(AItem); Image.Name : StatusImage; Image.Parent : AItem; Image.Align : TAlignLayout.Left; Image.Width : 40; Image.Margins.Left : 10; end; // 从数据源获取状态 IsComplete : TPrototypeBindSource1.Current.FieldByName(IsComplete).AsBoolean; if IsComplete then Image.Bitmap : CheckmarkBitmap // 预加载的完成图标 else Image.Bitmap : UncheckedBitmap; // 未完成图标end;## 总结通过本文我们一步步学习了如何使用LiveBindings与TListView结合实现动态呈现的列表。关键点包括1.数据源配置TPrototypeBindSource提供测试数据字段映射到列表项属性。2.动态控件创建在OnUpdateObjects事件中按需创建TProgressBar、TImage等子控件。3.数据同步通过OnGetValue或直接访问数据源确保动态控件显示实时数据。4.灵活布局利用Align和Margins调整控件位置适应不同屏幕。LiveBindings的强大之处在于它自动处理了数据变化时的UI更新而动态呈现则让我们突破了纯文本列表的限制。你可以进一步扩展此模式比如添加按钮、评级控件等打造真正丰富的数据驱动界面。记住LiveBindings不是魔法而是优雅的架构。它让你专注于业务逻辑而把UI同步的重任交给框架。现在打开你的IDE动手尝试吧
一步一步学习使用LiveBindings（） LiveBindings与具有动态呈现的TListView
发布时间：2026/7/31 13:37:21
一步一步学习使用LiveBindingsLiveBindings与具有动态呈现的TListView引言什么是LiveBindings在Delphi和CBuilder的RAD开发中LiveBindings是一种强大的数据绑定框架。简单来说它就像一根“魔法导线”能自动将数据源如数据库、对象列表、内存数据集与UI控件如TListView、TLabel连接起来。当你修改数据时UI会自动更新反之操作UI也能同步数据。这一切无需编写繁琐的同步代码。今天我们将聚焦于LiveBindings与TListView的结合并实现一个“动态呈现”的例子——即列表项不仅能显示文本还能动态显示图片、进度条等复杂元素。想象一下一个待办事项列表每项有标题、完成进度条和状态图标这都能通过LiveBindings轻松实现。## 准备工作创建项目并添加控件在开始前请确保你安装了Delphi或CBuilder推荐10.3版本。我们将创建一个新的FireMonkeyFMX应用支持跨平台并加入以下控件- 一个TListView用于展示数据- 一个TPrototypeBindSource原型绑定源作为数据源- 一个TBindingsList绑定管理器这些控件在“LiveBindings”组件面板中。## 第一步理解LiveBindings的核心概念LiveBindings的核心是“绑定表达式”。你可以将控件的属性如TListView的ItemAppearance与数据源的字段如Name、Progress关联。例如BindSource1.Name会映射到列表项的标题。对于TListView我们需要设置其ItemAppearance为“动态呈现”模式如ListItemShowDetail或自定义模板这样才能容纳多元素。## 第二步配置数据源TPrototypeBindSourceTPrototypeBindSource是一个虚拟数据源可以快速生成测试数据。我们用它来模拟一个任务列表。1. 从组件面板拖入一个TPrototypeBindSource1到窗体。2. 双击它在“字段编辑器”中添加三个字段 -TaskName字符串类型任务名称 -Progress整数类型进度百分比 -IsComplete布尔类型是否完成3. 点击“生成数据”按钮它会自动创建一些示例记录。## 第三步设置TListView的动态呈现TListView默认显示简单文本但通过修改ItemAppearance属性它可以支持复杂布局。1. 选中ListView1在对象检查器中找到ItemAppearance属性。2. 将其设置为ListItemShowDetail或ImageListItemBottomDetail等取决于你的需求。3. 勾选ShowCheckboxes如果希望有复选框和SearchVisible搜索栏。这样列表项就能显示标题、副标题和图标了。## 第四步使用LiveBindings连接数据这是最关键的步骤。我们将使用TBindingsList和TBindExpression来绑定数据。1. 从组件面板拖入一个TBindingsList1。2. 双击它打开绑定编辑器。3. 点击“添加绑定”选择“控件”为ListView1属性为ItemAppearance注意实际上我们需要绑定的不是ItemAppearance而是数据内容。正确的做法是绑定到ListView1的Items属性但LiveBindings提供了更高级的方式——通过TBindList。注意TListView的LiveBindings通常通过TBindList进行。在FMX中我们可以直接将TPrototypeBindSource拖拽到ListView1上Delphi会自动创建绑定。但为了学习我们手动操作1. 在对象树中右键点击ListView1选择“LiveBindings Wizard…”。2. 选择“绑定到PrototypeBindSource”。3. 在向导中将字段映射 -TaskName→Text列表项标题 -Progress→Detail列表项副标题 -IsComplete→ImageIndex但这里我们需要自定义图像所以稍后处理向导会生成一个TBindList和多个TBindExpression。## 第五步实现动态呈现——显示进度条和图标默认的ListItemShowDetail只显示文本要显示进度条我们需要自定义ItemAppearance或使用ItemAppearanceObjects。这里我们采用更简单的方法通过事件OnUpdateObjects来动态修改控件。代码示例1动态添加进度条到列表项delphi// 在ListView1的OnUpdateObjects事件中procedure TForm1.ListView1UpdateObjects(const Sender: TObject; const AItem: TListViewItem);var ProgressBar: TProgressBar;begin // 查找是否已有进度条控件 ProgressBar : AItem.Objects.FindObjectTTProgressBar(ProgressBar); if ProgressBar nil then begin // 创建进度条 ProgressBar : TProgressBar.Create(AItem); ProgressBar.Name : ProgressBar; ProgressBar.Parent : AItem; // 设置位置和大小基于列表项布局 ProgressBar.Align : TAlignLayout.Bottom; ProgressBar.Height : 20; ProgressBar.Margins.Left : 50; // 留出图标空间 ProgressBar.Margins.Right : 10; ProgressBar.Margins.Bottom : 5; end; // 从数据源获取进度值这里需要绑定数据 // 注意实际开发中应通过LiveBindings传递数据 ProgressBar.Value : 50; // 示例值end;解释此代码在每个列表项渲染时被调用。我们检查是否已有进度条如果没有则创建并设置布局。Align : Bottom使其固定在底部。但这里硬编码了进度值下一步要用LiveBindings动态获取。## 第六步高级绑定——将数据传递给动态控件真正的动态呈现需要将数据源的字段值传递给动态创建的控件。我们可以通过TBindExpression或手动从数据源读取。这里使用TBindList的OnGetValue事件。代码示例2使用OnGetValue动态设置进度条值delphi// 在TBindList的OnGetValue事件中procedure TForm1.BindList1GetValue(Sender: TObject; AFieldName: string; var Value: TValue; var Handled: Boolean);begin // 当字段名为Progress时返回实际数据 if AFieldName Progress then begin // 假设当前项的数据来自TPrototypeBindSource Value : TPrototypeBindSource1.Current.FieldByName(Progress).AsInteger; Handled : True; // 表示已处理 end;end;// 然后修改OnUpdateObjects以使用此值procedure TForm1.ListView1UpdateObjects(const Sender: TObject; const AItem: TListViewItem);var ProgressBar: TProgressBar; ProgressValue: Integer;begin // 获取进度条 ProgressBar : AItem.Objects.FindObjectTTProgressBar(ProgressBar); if ProgressBar nil then begin // 通过LiveBindings获取当前项的进度值 // 这里使用BindList的FindBinding或直接访问数据源 ProgressValue : TPrototypeBindSource1.Current.FieldByName(Progress).AsInteger; ProgressBar.Value : ProgressValue; end;end;解释OnGetValue让我们可以拦截字段值请求从数据源返回真实数据。然后OnUpdateObjects读取该值并设置进度条。这样列表滚动时每个项都能显示正确的进度。## 第七步添加动态图标——根据状态显示不同图标类似地我们可以根据IsComplete字段显示“完成”或“未完成”图标。代码示例3动态设置图标delphiprocedure TForm1.ListView1UpdateObjects(const Sender: TObject; const AItem: TListViewItem);var Image: TImage; IsComplete: Boolean;begin // 查找或创建图像控件 Image : AItem.Objects.FindObjectTTImage(StatusImage); if Image nil then begin Image : TImage.Create(AItem); Image.Name : StatusImage; Image.Parent : AItem; Image.Align : TAlignLayout.Left; Image.Width : 40; Image.Margins.Left : 10; end; // 从数据源获取状态 IsComplete : TPrototypeBindSource1.Current.FieldByName(IsComplete).AsBoolean; if IsComplete then Image.Bitmap : CheckmarkBitmap // 预加载的完成图标 else Image.Bitmap : UncheckedBitmap; // 未完成图标end;## 总结通过本文我们一步步学习了如何使用LiveBindings与TListView结合实现动态呈现的列表。关键点包括1.数据源配置TPrototypeBindSource提供测试数据字段映射到列表项属性。2.动态控件创建在OnUpdateObjects事件中按需创建TProgressBar、TImage等子控件。3.数据同步通过OnGetValue或直接访问数据源确保动态控件显示实时数据。4.灵活布局利用Align和Margins调整控件位置适应不同屏幕。LiveBindings的强大之处在于它自动处理了数据变化时的UI更新而动态呈现则让我们突破了纯文本列表的限制。你可以进一步扩展此模式比如添加按钮、评级控件等打造真正丰富的数据驱动界面。记住LiveBindings不是魔法而是优雅的架构。它让你专注于业务逻辑而把UI同步的重任交给框架。现在打开你的IDE动手尝试吧
