--- title: "桌面端组件、布局说明" description: "一、组件说明1. 组件介绍单个组件功能，如图表、行情报价、交易、订单组件等。长桥桌面端所有的功能都是以组件形式存在的，可以从右上角组件工具箱中可以查看到长桥目前支持的所有功能，包括个股、市场、通用、交易、资产和资讯类的；2. 单个组件操作说明2.1 添加組件桌面端右上角增加工具箱入口，集合了所有的功能组件，用户可以单击添加组件，拖拽到当前面板中。2.2 组件大小可随意拖拉每个组件的大小都可以随意拖拉调整，在组件边缘范围内可随意拖拉挤压大小。2.3 组件更多操作：复制、最大化、脱离、移除点击每个组件右上角的 “…”，可以进行更多操作（1）复制：会复制当前组件生成一个新的组件，以组件脱离的窗口显示出来。（2）最大化：点击组件会将当前组件最大化撑满，点击右上角恢复按钮，会自动恢复到当前组件默认大小；（3）脱离：点击脱离，组件支持脱离当前窗口为独立组件窗口；方便使用其他软件的时候，保留小视图观看。" slug: "z3znzt" locale: "zh-CN" region: "hk" region_label: "Hong Kong" url: "https://longbridge.com/hk/zh-CN/support/topics/longbridgepro/z3znzt.md" updated_at: "2025-10-17T02:32:29.000Z" category: "longbridgepro" category_title: "桌面端功能" references: related: - title: "图表交易的附加单设置介绍" url: "https://longbridge.com/hk/zh-CN/support/topics/longbridgepro/desktop-attach-order.md" - title: "市场深度功能介绍" url: "https://longbridge.com/hk/zh-CN/support/topics/longbridgepro/Desktop_Depth_of_Market.md" - title: "组件拼接使用说明" url: "https://longbridge.com/hk/zh-CN/support/topics/longbridgepro/pcezrl.md" - title: "图表交易介绍" url: "https://longbridge.com/hk/zh-CN/support/topics/longbridgepro/9o4yiz.md" - title: "桌面端快捷键说明" url: "https://longbridge.com/hk/zh-CN/support/topics/longbridgepro/hotkey_rules.md" --- # 桌面端组件、布局说明 [Table of Contents](https://longbridge.com/hk/zh-CN/support/toc.md) ## 一、组件说明 ### 1\. 组件介绍 单个组件功能，如图表、行情报价、交易、订单组件等。 长桥桌面端所有的功能都是以组件形式存在的，可以从右上角组件工具箱中可以查看到长桥目前支持的所有功能，包括个股、市场、通用、交易、资产和资讯类的； ### 2\. 单个组件操作说明 #### 2.1 添加組件 桌面端右上角增加工具箱入口，集合了所有的功能组件，用户可以单击添加组件，拖拽到当前面板中。 ![](https://pub.pbkrs.com/uploads/2025/5c9b444e68fa1698a34fab96d6ccfbc3) #### 2.2 组件大小可随意拖拉 每个组件的大小都可以随意拖拉调整，在组件边缘范围内可随意拖拉挤压大小。 ![](https://pub.pbkrs.com/uploads/2025/89aac8839336cf390bebc4623b4619e9) #### 2.3 组件更多操作：复制、最大化、脱离、移除 点击每个组件右上角的 “…”，可以进行更多操作 ![](https://pub.pbkrs.com/uploads/2025/501a8b33619989c74b7fb00055346772) （1）**复制**：会复制当前组件生成一个新的组件，以组件脱离的窗口显示出来。 （2）**最大化**：点击组件会将当前组件最大化撑满，点击右上角恢复按钮，会自动恢复到当前组件默认大小； （3）**脱离**：点击脱离，组件支持脱离当前窗口为独立组件窗口；方便使用其他软件的时候，保留小视图观看。 若从当前面板中脱离，或者当前面板中增加的组件，组件窗口会显示当前的来源面板，默认和来源面板进行联动； ![](https://pub.pbkrs.com/uploads/2025/d3370bbd6e49e4bfdc6654048370d2f3) （4）**移除**：点击移除，会移除当前组件。如果是系统的自选、个股、行情、交易面板，可点击组件工具箱底部的 ‘重置布局’。其中自定义布局不允许重置布局。 ![](https://pub.pbkrs.com/uploads/2025/f0c6a03a9ccfc60058dc9d08f74fc220) ### 3\. 组件联动说明 #### 3.1 自定义联动分组 系统布局中的组件默认为联动，目前不支持设置联动分组。 而新开的自定义布局，组件默认不联动，需要用户自行决定是否需要设置联动分组，分为以下几个分组： - 默认联动，所有组件都联动，不用设置分组； - 不联动，所选组件、标的无联动； - 联动分组 1、联动分组 2……联动分组 9，点击联动后，组件右上角头部会标识当前联动分组，相同分组的组件会自动联动。 ![](https://pub.pbkrs.com/uploads/2025/bad24830eef2db1bf9766894ba9ea43a) #### 3.2 联动参数 - 股票联动，如图表和交易组件，若设置为了联动，图表切换到股票 A，则交易组件也会同步切换到股票 A，目前大部分组件都是股票联动。 - 市场联动，如账户资产和持仓的市场默认为联动，账户资产切换到了港股，持仓也会同步切换到港股； #### 3.3 单向联动和双向联动 - 目前现有联动方向都是双向联动，点击组件 A，组件 B 也跟随联动，反之点击组件 B，组件 A 也跟随联动； - 单向联动，组件之间单方向联动，点击组件 A，组件 B 也跟随联动，反之则不会；目前暂无业务场景，后续会逐步增加。 #### 3.4 来源布局联动 若组件从当前布局中脱离，或者当前布局中增加的组件，组件窗口会显示当前的来源面板，当前组件默认和来源面板进行联动； ![](https://pub.pbkrs.com/uploads/2025/3bca09982693a2eafba72e8032d0ede1) ### 4\. 组件头部搜索 组件头部带有搜索，分为如以下情况： - 有些组件带有股票标的属性的，如图表、盘口、行情報价、逐笔成交等组件。这些带有股票标的属性的组件脱离后，组件头部自带股票搜索功能，方便进行股票标的切换。 - 新开的自定义页面，带有股票标的属性的组件头部自带搜索，方便进行股票标的切换。 ![](https://pub.pbkrs.com/uploads/2025/15cb4ff638a695bd95bd43429c87f6b2) ### 5\. 组件钉住操作 组件脱离后，点击其他软件或者主窗口，容易把当前组件盖住，若有组件层级置顶需要，可点击组件右上角的钉住功能，可以固定悬浮在顶部。若想取消钉住功能，可再次点击钉住，取消组件层级置顶。 ![](https://pub.pbkrs.com/uploads/2025/9fa8002cea32e71159be4d04c3701bb0) ## 二、布局说明 目前桌面端的布局主要分为两种： - 系统布局，即系统默认提供的布局，如自选、个股、行情、资产、选股器页面，即为系统布局； - 系统布局不可编辑、不可删除，但可以自定义修改面板内的组件内容排版。 - 自定义布局，新开标签页后的布局，布局可以自定义命名、删除等； - 自定义布局又分为两种，自适应布局和画布布局； ### 1\. 系统布局 #### 1.1 系统布局介绍 系统默认提供的布局，如自选、个股、行情、资产、选股器页面，即为系统布局；其中系统布局不可编辑、不可删除，但可以自定义修改面板内的组件内容排版。 ![](https://pub.pbkrs.com/uploads/2025/59f1feafc9f4885cca6ae726fe4f20fe) #### 1.2 系统布局重置 针对系统布局，若用户自行修改了布局，想要恢复到系统默认布局，可点击右上角的组件工具箱，进行重置布局，来恢复到系统默认的布局； ![](https://pub.pbkrs.com/uploads/2025/4582a6575d999c3364dfc89c4933a1ec) ### 2\. 自定义布局 对于新开的标签页，均为自定义布局。具体操作如下： （1）点击菜单栏右侧的 “+”，可以新开标签页。 ![](https://pub.pbkrs.com/uploads/2025/809ba262ec507ea1221dd026ab1a3770) （2）目前自定义布局包含两种：自适应布局或画布布局。 用户可以根据需要自行选择，自适应布局或画布布局的介绍和区别详见下文。 ![](https://pub.pbkrs.com/uploads/2025/e63d5fb07e4c8233a6c76d1f034f2882) ### 3\. 自定义布局 - 自适应布局 #### 3.1 自适应布局的特色 - **动态调整**：自适应布局能够根据设备的屏幕大小和分辨率自动调整布局。布局内只有一个组件时，会满屏占满当前布局，拖拉其中一个组件大小时，会自动挤压适配其他组件大小 - **流式设计**：元素通常以百分比或相对单位（如 em、rem）进行定义，而不是固定的像素值。 - **灵活性**：非常适合需要在多种设备上访问的网页和应用，能够提供一致的用户体验。 #### 3.2 操作说明 （1）新开标签页，选择自适应布局 （2）目前系统提供了多种自适应布局的交易员模版，如证券交易、日内交易、多股同列等布局可以直接使用，也可以从布局开始创建； ![](https://pub.pbkrs.com/uploads/2025/d5809804b389bfaf6a163e64d55c3aeb) （3）点击空白布局，可以直接从组件工具箱中拖拽组件到面板内进行排版； ![](https://pub.pbkrs.com/uploads/2025/6f07fb0d4c3893d385e9b25c41799968) （4）也可以结合上文讲的组件操作、组件联动、组件头部搜索、组件钉住等各种功能，基于自己需要，进行各种联合操作。 ### 4\. 自定义布局- 画布布局 #### 4.1 画布布局的特色 - **固定尺寸**：画布布局通常使用固定的像素值来定义元素的位置和大小。 - **绝对定位**：元素的位置通常是绝对的，基于画布的固定尺寸进行定位。 - **自由度高**：设计师可以完全控制每个元素的位置和大小，适合复杂的、精确的布局需求。 - **不随设备变化**：布局不会根据设备的屏幕大小自动调整，通常需要为不同设备单独设计不同的布局。 #### 4.2 操作说明 进入画布布局，可以直接从组件工具箱中拖拽组件到画布布局内；也可以唤起独立组件窗口直接拖拽到画布布局面板内； 可以点击组件右上角的 “X” 来关闭组件；或者组件右上角的 “…”- 移除组件来关闭组件； ![](https://pub.pbkrs.com/uploads/2025/877e92a2e9fdf345b9d79ef0a2413aae) #### 4.3 锁定功能 若画布布局编辑完后，可以点击右上角的工具栏进行页面布局锁定，页面锁定后，不可再添加、移动组件；方便用户存在误操作移动布局的情况； 页面布局锁定后，也可以点击页面解锁，来解除布局锁定； ![](https://pub.pbkrs.com/uploads/2025/cc157adae10b342df25a3c732c723b05) #### 4.4 磁吸功能 磁吸功能是一种设计工具，旨在帮助用户更轻松地对齐和排列画布上的元素。当用户在画布上移动元素时，磁吸功能会自动将元素吸附到最近的网格线或其他元素上，从而实现精确的对齐。这不仅提高了设计的效率，还确保了布局的整齐和美观。 画布布局，默认磁吸功能为开启状态，若不需要的话，可以点击进行关闭。 ![](https://pub.pbkrs.com/uploads/2025/2f8380f872efa463cfdb38ae929d63c4) ### 5\. 自适应布局和画布布局对比 自适应布局和画布布局各有其优缺点和适用场景。选择哪种布局方式，用户可以自行选择 布局 **自适应布局** **画布布局** 布局特点 - **动态调整**：自适应布局能够根据设备的屏幕大小和分辨率自动调整布局。布局内只有一个组件时，会满屏占满当前布局，拖拉其中一个组件大小时，会自动挤压适配其他组件大小 - **流式设计**：元素通常以百分比或相对单位（如 em、rem）进行定义，而不是固定的像素值。 - **灵活性**：非常适合需要在多种设备上访问的网页和应用，能够提供一致的用户体验。 - **固定尺寸**：画布布局通常使用固定的像素值来定义元素的位置和大小。 - **绝对定位**：元素的位置通常是绝对的，基于画布的固定尺寸进行定位。 - **自由度高**：设计师可以完全控制每个元素的位置和大小，适合复杂的、精确的布局需求。 - **不随设备变化**：布局不会根据设备的屏幕大小自动调整，通常需要为不同设备单独设计不同的布局。 支持范围 现有的系统面板 -- 自适应布局 新开标签页 - 自适应布局 新开标签页 - 自定义布局； 是否大小屏适配 是，会根据屏幕大小自动适配组件大小 否，若组件大小超过当前屏幕了，可以滑动查看完整组件大小 面板内 - 组件之间是否可重叠展示 否，不可重叠展示，会挤压其他组件 可以重叠展示，组件大小不受挤压 优点 - 提高用户体验：在不同设备上都能提供良好的显示效果。 - 维护方便：一个布局可以适应多种设备，减少了维护成本。 - 组件大小及数量不受屏幕限制，可随意摆放，不影响组件功能使用 - 精确控制：设计师可以完全控制元素的布局，适合需要精确定位和复杂设计的场景。 - 简单直接：不需要考虑多种设备和屏幕尺寸，设计和开发相对简单。 缺点 受屏幕大小限制，多个大组件放一起时，会被挤压的比较小，影响组件功能使用 - 缺乏灵活性：在不同设备上可能需要单独设计不同的布局。 - 用户体验：在不同设备上可能无法提供一致的用户体验，尤其是在小屏幕设备上。 ### 6\. 布局管理 针对用户自定义编辑的所有布局信息，目前都是系统自动存储在云端的，若存在布局丢失，可以点击右上角的组件工具箱 - 布局管理来找回用户的历史布局数据； #### 6.1 系统自动保存 针对用户进行的布局修改操作，系统会自动保存最新的数据，若存在丢失，可通过读取系统存档来进行召回； 目前默认第一条数据为系统自动保存的数据； ![](https://pub.pbkrs.com/uploads/2025/10f57fe33a240ff2e3d3efbd57d62bbf) #### 6.2 用户手动保存 但若想找到更多历史的布局数据，建议用户最好点击手动点击一下**保存所有布局**，根据自己需要自行读取历史布局数据，目前手动保存最多支持 20 条数据； ![](https://pub.pbkrs.com/uploads/2025/eea6cbe969970ba0c40ab5c284b3af1c) ### 7\. 新开标签页支持另存为我的布局 新开的标签页，可菜单右键选择**另存为我的布局**，存储之后，后续可在**布局选择** \> **我的布局**快速打开，方便后续多次使用。 ![飞书文档 - 图片](https://pub.pbkrs.com/uploads/2025/2e7f9eeb749873d64b6850854b272ed9) --- > **Disclaimer**: This article is for reference only and does not constitute any investment advice. Content provided by [Longbridge](https://longbridge.com).