火猴之产品组成热点图编程（firemonkey）

最新推荐文章于 2025-10-23 16:18:49 发布

原创最新推荐文章于 2025-10-23 16:18:49 发布 · 725 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#dji #机甲大师 #tms #hotspots #firemonkey

FMX 专栏收录该内容

24 篇文章

订阅专栏

本文介绍了一种使用TMSFMXHotSpotImage和TMSFMXHTMLText组件实现产品组成热点区域交互的方法，以机甲大师为例，详细讲解了如何设置热点区域并关联产品各部分名称。

效果图：

用途：

地图、产品组成

举例：

以产品组成为例，如最近最火的机甲大师：

思路：

1、组件：TMSFMXHotSpotImage1+TMSFMXHTMLText1

2、加载背景+编辑热点区域+代码

操作：

1）右键窗体，打开编辑热点窗口：

2）加载背景：

3）画出热点区域:

4）换一个组件，重复第三步。

设置：

1）设置TMSFMXHotSpotImage1

2）设置 TMSFMXHTMLText1

代码：

procedure TForm1.TMSFMXHotSpotImage1HotSpotClick(Sender: TObject; HotSpot: TTMSFMXHotSpot);
begin
  if HotSpot.ID = 1 then
    self.TMSFMXHTMLText1.Text := '前盖';
  if HotSpot.ID = 2 then
    self.TMSFMXHTMLText1.Text := '后引擎盖';
  if HotSpot.ID = 3 then
    self.TMSFMXHTMLText1.Text := '左侧感应器';
  if HotSpot.ID = 6 then
    self.TMSFMXHTMLText1.Text := '左前轮';

end;