1. Delphi FMX 控件属性速查为什么总在布局阶段卡住做 Delphi FMX 界面开发的人大概率都经历过这样的场景拖了一个 TLayout 上去设了Align Client结果旁边的按钮被挤没了或者给 TImage 设了Align Fit图片是居中了但左右留白怎么调都不对。问题不在于属性本身难而在于 FMX 的属性语义和 VCL 差别很大而且 Align、Anchors、Margins、Padding 这几个属性会互相影响单看某一个属性的文档根本推不出最终布局。这篇内容面向的是正在用 Delphi FMX 做跨平台界面的开发者尤其是需要频繁查属性、调布局、又想让 AI 帮忙生成配置片段的人。核心检索词就是 Delphi FMX 控件常见属性速查我会把 Align 的十几个取值、Anchors 的四个锚点、Margins 与 Padding 的区别、以及 StyleLookup 这类样式相关属性讲清楚同时给出可复制的配置片段。更关键的一点当你把属性配置交给 AI 辅助生成时需要一个稳定的模型调用入口。我用 TaoToken 的统一 Key 来打通这个环节下面会把接入步骤和验证动作都写出来你可以直接跟着做。先说清楚 FMX 布局的一个基本事实控件的最终位置和大小是父容器的可用区域、控件自身的 Align、Anchors、Margins、Padding、Position、Size 共同作用的结果。Align 决定的是「在父控件里怎么占位」Anchors 决定的是「父控件尺寸变化时哪些边距保持不变」Margins 是「控件外边界到父控件或相邻控件的距离」Padding 是「控件内边界到子控件的距离」。这四个概念混在一起就是布局调试反复出问题的根源。我试过在同一个 TLayout 里放三个按钮分别设 Align 为 Top、Client、Bottom结果 Client 那个把 Bottom 的按钮盖住了。原因就是 Align 的排列顺序和控件在父容器里的声明顺序有关Client 会吃掉剩余空间如果它排在 Bottom 前面后面的控件就没位置了。这类坑在 FMX 里非常常见速查表能帮你快速定位但真正调通还是得理解属性之间的优先级。2. TaoToken 统一 Key 接入让 AI 辅助生成 FMX 属性配置2.1 为什么 FMX 属性配置适合用 AI 辅助FMX 的属性组合非常多Align 有近二十个取值Anchors 有四个布尔位再加上 Margins、Padding、StyleLookup手工一个个试效率很低。AI 辅助的价值在于你描述清楚「我要一个顶部工具栏、中间内容区、底部状态栏」这样的布局意图让模型直接生成对应的属性配置片段你复制到 IDE 里验证即可。但这里有个前提模型调用要稳定、Key 要统一管理。如果每个工具都配一套 Key切换起来很麻烦。TaoToken 的做法是提供一个统一的 API 入口Base URL 固定Key 统一模型 ID 按需切换。这样你在 Delphi 里写一个 HTTP 请求或者在支持自定义 API 的编辑器插件里配置都能复用同一个 Key。2.2 接入前的准备拿到统一 Key你需要先有一个 TaoToken 的 API Key。获取路径是控制台里的 API Keys 页面登录后创建即可。这个 Key 后面会用在两个地方一是直接在 Delphi 代码里发 HTTP 请求调用模型二是在支持 OpenAI 兼容接口的编辑器或插件里配置。控制台地址https://taotoken.net/console?utm_sourcetaotoken_aicg_blog_endutm_mediumcsdnutm_campaignrewriteutm_contentAPI Keys 页面https://taotoken.net/api-keys?utm_sourcetaotoken_aicg_blog_endutm_mediumcsdnutm_campaignrewriteutm_content注意 API 的基础地址是 https://taotoken.net/api 这个地址不加 UTM 参数直接用于请求。模型对话入口在 https://taotoken.net/models?utm_sourcetaotoken_aicg_blog_endutm_mediumcsdnutm_campaignrewriteutm_content 你可以在那里先测试模型是否正常响应。2.3 在 Delphi 里配置 HTTP 调用Delphi FMX 自带 THTTPClient可以直接发 POST 请求。下面是一个可复制的调用片段用于让模型生成 FMX 属性配置。注意把YOUR_API_KEY替换成你实际的 Key。uses System.Net.HttpClient, System.Net.URLClient, System.NetEncoding, System.JSON, System.Classes; function AskAIForFMXLayout(const Prompt: string): string; var Client: THTTPClient; Request: TStringStream; Response: IHTTPResponse; JsonBody: TJSONObject; Messages: TJSONArray; Msg: TJSONObject; begin Client : THTTPClient.Create; try JsonBody : TJSONObject.Create; try JsonBody.AddPair(model, claude-3-5-sonnet); Messages : TJSONArray.Create; Msg : TJSONObject.Create; Msg.AddPair(role, user); Msg.AddPair(content, Prompt); Messages.AddElement(Msg); JsonBody.AddPair(messages, Messages); JsonBody.AddPair(max_tokens, 1024); Request : TStringStream.Create(JsonBody.ToString, TEncoding.UTF8); try Client.CustomHeaders[Authorization] : Bearer YOUR_API_KEY; Client.CustomHeaders[Content-Type] : application/json; Response : Client.Post(https://taotoken.net/api/v1/messages, Request); Result : Response.ContentAsString(TEncoding.UTF8); finally Request.Free; end; finally JsonBody.Free; end; finally Client.Free; end; end;这段代码的关键点Base URL 用https://taotoken.net/api路径按你调用的模型接口补全Authorization 头用 Bearer 加 Key请求体是标准的 messages 格式。返回的 JSON 里会包含模型生成的属性配置文本你解析出来就能用。2.4 在编辑器插件里配置统一 Key如果你用的是支持自定义 API 的编辑器或 AI 插件配置项通常有三件套Base URL、API Key、Model ID。以常见的 OpenAI 兼容配置为例{ base_url: https://taotoken.net/api, api_key: YOUR_API_KEY, model: claude-3-5-sonnet }这三项填对插件就能正常调用。Model ID 可以根据你的需求切换比如需要长上下文选支持长上下文的模型需要快速响应选轻量模型。Coding Plan 适合长期编码和 Agent 场景入口在 https://taotoken.net/coding-plan?utm_sourcetaotoken_aicg_blog_endutm_mediumcsdnutm_campaignrewriteutm_content 。3. 可复制的 FMX 属性配置片段3.1 Align 取值速查与配置示例Align 是 FMX 布局里最核心的属性它决定控件在父容器中的占位方式。下面用表格对照常用取值然后给出一个三栏布局的配置片段。Align 取值行为说明Top顶部充满父控件宽度高度不变Bottom底部充满父控件宽度高度不变Left左侧充满父控件高度宽度不变Right右侧充满父控件高度宽度不变Client填满剩余空间会受其他 Align 控件影响Content充满父控件不考虑剩余空间Center居中大小可调但不随父控件缩放Fit自适应填满保持长宽比可能留白FitLeft / FitRight靠左或靠右填满保持比例Horizontal / Vertical水平或垂直方向填满另一方向可调HorzCenter / VertCenter水平或垂直居中另一方向填满Scale保持比例随父控件比例变化None位置和大小都可自由调整一个典型的三栏布局顶部工具栏 AlignTop底部状态栏 AlignBottom中间内容区 AlignClient。配置片段如下你可以直接复制到 FMX 的窗体设计器里或者用代码设置。procedure TFormMain.SetupLayout; begin // 顶部工具栏 ToolBar.Align : TAlignLayout.Top; ToolBar.Height : 48; ToolBar.Margins.Top : 0; ToolBar.Margins.Bottom : 0; // 底部状态栏 StatusBar.Align : TAlignLayout.Bottom; StatusBar.Height : 28; // 中间内容区填满剩余空间 ContentLayout.Align : TAlignLayout.Client; ContentLayout.Margins.Left : 8; ContentLayout.Margins.Right : 8; ContentLayout.Margins.Top : 4; ContentLayout.Margins.Bottom : 4; end;注意顺序先设 Top 和 Bottom最后设 Client。如果 Client 先设它会先占满整个父容器后面的 Top 和 Bottom 就会覆盖在它上面视觉上看起来像被遮挡。3.2 Anchors 与 Margins、Padding 的配合Anchors 决定父控件尺寸变化时控件的哪些边距保持不变。四个锚点 akLeft、akTop、akRight、akBottom 分别对应左、上、右、下。如果四个都设为 True控件会随父控件缩放如果只设 akLeft 和 akTop控件位置固定大小不变。Margins 是控件外边界到父控件的距离Padding 是控件内边界到子控件的距离。这两个属性经常被混淆。举个例子一个 TLayout 设了 Margins.Left20表示它距离父容器左边 20 像素设了 Padding.Left20表示它里面的子控件距离它左边 20 像素。procedure TFormMain.SetupAnchors; begin // 右下角固定按钮父容器缩放时保持右下边距 BtnOK.Align : TAlignLayout.None; BtnOK.Anchors : [TAnchorKind.akRight, TAnchorKind.akBottom]; BtnOK.Margins.Right : 16; BtnOK.Margins.Bottom : 16; BtnOK.Width : 96; BtnOK.Height : 32; // 内容面板四边锚定随父容器缩放 PanelContent.Align : TAlignLayout.Client; PanelContent.Anchors : [TAnchorKind.akLeft, TAnchorKind.akTop, TAnchorKind.akRight, TAnchorKind.akBottom]; PanelContent.Padding.Left : 12; PanelContent.Padding.Top : 12; PanelContent.Padding.Right : 12; PanelContent.Padding.Bottom : 12; end;3.3 StyleLookup 与样式相关属性StyleLookup 用来指定控件使用的样式名称。FMX 的样式系统比较特殊控件的视觉表现由样式对象控制StyleLookup 就是告诉控件去用哪个样式。比如按钮可以设 StyleLookup 为transparentbutton或cornerbutton具体取决于你的样式库。Stylename 和 StyleLookup 容易混。Stylename 是控件自身的样式名StyleLookup 是查找样式时用的键。实际开发中改 StyleLookup 就能切换控件外观改 Stylename 一般用于自定义样式注册。procedure TFormMain.SetupStyles; begin // 切换按钮样式 BtnPrimary.StyleLookup : cornerbutton; BtnSecondary.StyleLookup : transparentbutton; // 设置透明度 PanelOverlay.Opacity : 0.85; // 旋转角度和旋转中心 ImageLogo.RotationAngle : 15; ImageLogo.RotationCenter.X : 0.5; ImageLogo.RotationCenter.Y : 0.5; end;Opacity 的取值范围是 0 到 10 完全透明1 完全不透明。RotationCenter 用 0 到 1 的归一化坐标0.5 表示中心。这些属性在动画和交互效果里很常用。3.4 其他高频属性速查Visible 控制可见性Enable 控制是否可用HitTest 控制是否响应鼠标事件。这三个属性经常一起用一个控件可以 VisibleTrue 但 EnableFalse看起来在但点不动也可以 VisibleFalse完全不显示。TabOrder 决定控件在父容器里的 Tab 键切换顺序值越小越靠前。Locked 设为 True 后设计器里无法拖动这个控件适合锁定背景层。ClipChildren 设为 True 时子控件超出父容器范围的部分会被裁剪。procedure TFormMain.SetupMisc; begin // 禁用但可见 EditReadOnly.Enabled : False; EditReadOnly.Visible : True; // 不响应鼠标 LabelHint.HitTest : False; // 锁定背景 BackgroundLayout.Locked : True; // 裁剪超出部分 ScrollBoxContent.ClipChildren : True; // Tab 顺序 EditName.TabOrder : 0; EditEmail.TabOrder : 1; BtnSubmit.TabOrder : 2; end;4. 验证属性生效在 IDE 里做具体动作4.1 用 Live Preview 快速验证FMX 的窗体设计器支持实时预览你改属性后不用编译就能看到效果。具体动作选中控件在 Object Inspector 里改 Align 或 Margins设计器里的控件位置会立即更新。如果没更新检查是否开了 Locked或者控件是否被其他控件遮挡。验证 Anchors 是否生效需要改变父容器尺寸。在设计器里拖动父容器边缘观察子控件的边距是否保持不变。如果设了 akRight 和 akBottom父容器变宽变高时子控件应该跟着往右下移动保持右边距和下边距不变。4.2 用代码打印实际布局参数设计器预览有时不够精确可以在运行时打印控件的实际位置和大小。在 Form 的 OnResize 事件里加日志观察属性变化后的实际值。procedure TFormMain.FormResize(Sender: TObject); begin MemoLog.Lines.Add(Format(ContentLayout: L%f T%f W%f H%f, [ContentLayout.Position.X, ContentLayout.Position.Y, ContentLayout.Width, ContentLayout.Height])); MemoLog.Lines.Add(Format(BtnOK: L%f T%f W%f H%f, [BtnOK.Position.X, BtnOK.Position.Y, BtnOK.Width, BtnOK.Height])); end;运行后拖动窗体边缘看日志里的数值是否符合预期。如果 BtnOK 的右边距在窗体变宽后变了说明 Anchors 没设对。4.3 用 AI 生成配置后回填验证当你用 TaoToken 的模型生成了一段属性配置复制到 IDE 后按上面的方法验证。如果效果不对把实际现象和期望现象一起发给模型让它修正。比如「我设了 AlignClient 和 Margins.Left20但左边距没生效」模型会提示你检查父容器的 Padding 或者控件的 Anchors 设置。模型对话入口在 https://taotoken.net/models?utm_sourcetaotoken_aicg_blog_endutm_mediumcsdnutm_campaignrewriteutm_content 你可以在那里直接测试模型对 FMX 属性的理解。接入文档在 https://taotoken.net/doc?utm_sourcetaotoken_aicg_blog_endutm_mediumcsdnutm_campaignrewriteutm_content 里面有完整的接口说明。5. 常见报错与排查5.1 401 未授权Key 没配对调用模型接口时返回 401最常见的原因是 Authorization 头没带对。检查两点一是 Key 是否复制完整有没有多余空格二是格式是否是Bearer YOUR_API_KEYBearer 和 Key 之间有一个空格。如果你在编辑器插件里配置检查 Base URL 是否写成了https://taotoken.net/api不要多加路径或者少写。有些插件要求 Base URL 以/v1结尾那就写https://taotoken.net/api/v1具体看插件的文档要求。5.2 local proxy failed本地网络配置问题这个报错通常出现在插件或客户端里表示本地代理配置有问题。检查你的系统代理设置或者插件里的代理选项。如果你没有用代理把代理选项关掉。如果报错信息里提到 localhost 或 127.0.0.1说明插件在尝试走本地代理但本地没有代理服务在运行。5.3 reading choices 报错响应格式不匹配这个报错表示客户端期望的响应格式和实际返回的不一致。比如客户端按 OpenAI 的 choices 格式解析但接口返回的是别的格式。检查你调用的接口路径是否正确messages 接口和 chat completions 接口的返回结构不同。如果你用的是 Claude 系列模型走 messages 接口如果用 OpenAI 兼容格式走 chat completions 接口。5.4 OAuth 相关报错认证方式不对有些工具默认走 OAuth 认证但 TaoToken 用的是 API Key 认证。如果报错里提到 OAuth token 或 refresh token说明工具在尝试 OAuth 流程。你需要在工具设置里切换到 API Key 模式填入你的 Key。5.5 属性设了没效果检查优先级和父容器FMX 里属性没生效先检查父容器的 Align 和 Padding。如果父容器 AlignNone 且尺寸固定子控件的 AlignClient 就只能在父容器范围内填满。如果父容器 Padding 很大子控件的 Margins 看起来就没效果。另一个常见原因是控件被其他控件遮挡。FMX 的控件层级按声明顺序排列后声明的在上面。如果两个控件 Align 冲突检查它们的声明顺序或者用 BringToFront / SendToBack 调整层级。6. 把统一 Key 用在日常 FMX 开发里日常开发中我建议把 TaoToken 的 Key 配置在编辑器插件里这样写代码时随时可以让 AI 生成属性片段。需要长期编码或 Agent 辅助的用 Coding Plan 更合适入口在 https://taotoken.net/coding-plan?utm_sourcetaotoken_aicg_blog_endutm_mediumcsdnutm_campaignrewriteutm_content 。如果你在用 Claude Code 这类工具配置方式是把 Base URL 设为https://taotoken.net/apiKey 填你的 API KeyModel ID 按需选。ClaudeCodeAnthropic 的接入说明在 https://taotoken.net/doc?utm_sourcetaotoken_aicg_blog_endutm_mediumcsdnutm_campaignrewriteutm_content 里有详细步骤。API Keys 管理页面在 https://taotoken.net/api-keys?utm_sourcetaotoken_aicg_blog_endutm_mediumcsdnutm_campaignrewriteutm_content 你可以随时创建新 Key 或吊销旧的。模型对话测试在 https://taotoken.net/models?utm_sourcetaotoken_aicg_blog_endutm_mediumcsdnutm_campaignrewriteutm_content 接入文档在 https://taotoken.net/doc?utm_sourcetaotoken_aicg_blog_endutm_mediumcsdnutm_campaignrewriteutm_content 。最后说一个实际经验FMX 的 Align 和 Anchors 组合在跨平台时表现可能不一致。Windows 上看着对的布局到 Android 或 iOS 上可能因为 DPI 和屏幕比例不同而错位。建议在目标平台上都跑一遍用前面说的日志方法打印实际布局参数确认边距和尺寸符合预期。如果发现平台差异优先用 Anchors 加 Margins 的组合少用固定的 Position 和 Size这样适配性更好。