如何使用fillColor填充pdfmake的列背景颜色？

Is there any option to fill column background color with fillColor: '#dedede' ? fillColor works in tablecell very well at the same time it doesn't work for column :(

有没有选项用fillColor填充列背景颜色：'#dedede'？ fillColor非常适用于tablecell，同时它对列不起作用:(

<script src="https://rawgit.com/bpampuch/pdfmake/master/build/vfs_fonts.js"></script>
<script src="https://rawgit.com/yelouafi/pdfmake/master/build/pdfmake.js"></script>
<script>
  function print(argument) {
    // open the PDF in a new window
    pdfMake.createPdf(docDefinition).open();
  }
</script>
<button onclick="print()" style="display:block; margin: 10px auto;padding: 20px 50px;">Print</button>
<hr>
<script>
  var docDefinition = {
    content: [
      'This paragraph fills full width, as there are no columns. Next paragraph however consists of three columns', {
        columns: [{
          // auto-sized columns have their widths based on their content
          width: 'auto',
          text: 'First column',
          fontSize: 30,
          fillColor: '#dedede'
        }, {
          // star-sized columns fill the remaining space
          // if there's more than one star-column, available width is divided equally
          width: '*',
          text: 'Second column'
        }, {
          // fixed width
          width: 100,
          text: 'Third column'
        }, {
          // percentage width
          width: '10%',
          text: 'Last column'
        }],
        // optional space between columns
        columnGap: 10
      },
      'This paragraph goes below all columns and has full width'
    ]
  };
</script>

1 个解决方案

#1

I have not gotten apply background color to columns. I think the only option you have is to use tables.

我还没有将背景颜色应用于列。我认为你唯一的选择就是使用表格。

Below this lines I have attached a simple code that you can paste directly at pdfmake playground in order to try it.

在这一行下面，我附上了一个简单的代码，你可以直接粘贴到pdfmake playground上试试。

Good luck!

祝你好运！

    var dd = {
    content: [
        'This paragraph fills full width, as there are no columns. Next paragraph however consists of three columns', 
        {
            style: 'section',
            table: {
                widths: [ '15%',  '*',  '35%'],
                body: [
                    [ 
                        {
                          text: 'first column',
                          fillColor: '#555555',
                          color: '#00FFFF',
                        },
                        {
                          text: 'second column',
                          color: '#555555',
                          fillColor: '#dedede'
                        },
                        {
                          text: 'third column',
                          fillColor: '#555555'
                        }
                    ]
                ]
            },
            layout: 'noBorders'
        }
    ],
    styles: {
        section: {
            fontSize: 9,
            color: '#FFFFFF',
            fillColor: '#2361AE',
            margin: [0, 15, 0, 5]
        }
    },
    defaultStyle: {
        alignment: 'center'
    }
}

#1