如何为qx.ui.progressive表格设置自定义行高适配多行文本
问题描述
我尝试修改qx.ui.progressive表格的行高,以容纳单元格内的多行文本内容。此前在qx.ui.table中尝试该操作,但无法设置自定义行高。
qooxdoo演示浏览器中有一个示例(qxl.demobrowser.demo.progressive.ProgressiveTable_VarRowHeight),但该示例是通过图片高度来设置单元格高度的。请问如何通过.string或.html内容来设置行高?
尝试的代码
var createRow = function (html, new_height) { var ret = { renderer: "row", location: "end", data: [html, html], // data: [{html, height: h}, {html, height: h}], height: new_height // Custom height }; return ret; }; var columnWidths = new qx.ui.progressive.renderer.table.Widths(2); columnWidths.setWidth(0, "2*"); columnWidths.setWidth(1, "1*"); var columnNames = ["Literal", "Html"]; // Instantiate a Progressive with a default structure with header var header = new qx.ui.progressive.headfoot.TableHeading( columnWidths, columnNames ); var footer = new qx.ui.progressive.headfoot.Progress( columnWidths, columnNames ); var structure = new qx.ui.progressive.structure.Default(header, footer); var progressive = new qx.ui.progressive.Progressive(structure); // Instantiate a data model and populate it. var dataModel = new qx.ui.progressive.model.Default(); var rowData = []; var html = "<div style='background-color: cyan; text-align: center;'>" + " Hello world!" + "</div>"; rowData.push(createRow(html, 40)); var html = "<div style='background-color: cyan; text-align: center;'>" + " Hi there." + " <span style='color: red;'>" + " &nbsp;&nbsp;&nbsp;" + " I'm very red!" + " </span>" + "</div>"; rowData.push(createRow(html, 80)); dataModel.addElements(rowData); // Tell Progressive about its data model progressive.setDataModel(dataModel); // Instantiate a table row renderer var rowRenderer = new qx.ui.progressive.renderer.table.Row(columnWidths); // Give Progressive the renderer, and assign a name progressive.addRenderer("row", rowRenderer); // Tell the row renderer to use a String renderer for column 0 var r = new qx.ui.progressive.renderer.table.cell.String(); rowRenderer.addRenderer(0, r); // Tell the row renderer to use an HTML renderer for column 1 var r = new qx.ui.progressive.renderer.table.cell.Html(); rowRenderer.addRenderer(1, r);
内容的提问来源于stack exchange,提问作者Uli Hartman
相关产品推荐
相关产品推荐

