如何修改qooxdoo表格（qx.ui.table.Table）中行数据的字体大小？

一、修改表格行整体字体大小 #

有两种常用方式可以统一调整表格所有行的字体大小：

1. 通过主题配置（全局生效） #

在自定义主题的widgets配置中，针对qx.ui.table.Table设置全局字体样式：

qx.Theme.define("your.app.theme.Theme", {
  widgets: {
    "qx.ui.table.Table": {
      font: new qx.bom.Font(14, ["Segoe UI", "Arial", "sans-serif"])
    }
  }
});

这种方式会应用到所有使用该主题的表格组件上，适合全局样式统一的场景。

2. 动态修改单个表格（局部生效） #

如果只需要调整某一个表格的行字体大小，可以直接获取表格的视图面板并设置字体：

// 假设table是已创建的qx.ui.table.Table实例
let tablePane = table.getTablePane();
tablePane.setFont(new qx.bom.Font(14, ["Segoe UI", "Arial", "sans-serif"]));

也可以通过自定义CSS类实现：
先在样式文件中添加：

.custom-table-large-font .qx-table-row {
  font-size: 14px !important;
}

然后给表格添加CSS类：

table.addCssClass("custom-table-large-font");

二、修改行内特定数据的字体大小 #

要针对行内部分数据调整字体，需要自定义单元格渲染器（Cell Renderer），通过判断单元格信息来动态设置样式：

1. 自定义单元格渲染器 #

继承默认的单元格渲染器，重写_getCellStyle方法来添加字体大小逻辑：

class CustomCellRenderer extends qx.ui.table.cellrenderer.Default {
  _getCellStyle(cellInfo) {
    // 先获取默认样式
    let baseStyle = super._getCellStyle(cellInfo);
    // 根据单元格值调整字体
    if (cellInfo.value && cellInfo.value.toString().includes("重点内容")) {
      baseStyle += "font-size: 16px; font-weight: bold;";
    }
    // 也可以根据行索引设置，比如第3行（索引从0开始）
    // if (cellInfo.row === 2) {
    //   baseStyle += "font-size: 16px;";
    // }
    return baseStyle;
  }
}

2. 将渲染器应用到表格列 #

在表格的列配置中，为目标列设置自定义渲染器：

// 初始化表格模型
let tableModel = new qx.ui.table.model.Simple();
tableModel.setColumns(["常规列", "需特殊样式列"]);
tableModel.setData([
  ["普通文本", "重点内容"],
  ["普通文本", "普通内容"]
]);

// 创建表格并应用渲染器
let table = new qx.ui.table.Table(tableModel);
let columnModel = table.getTableColumnModel();
// 给第2列（索引1）设置自定义渲染器
columnModel.setCellRenderer(1, new CustomCellRenderer());

内容的提问来源于stack exchange，提问作者goldim