Perspective Table Dynamic Columns Center Text

Quick question I hope...

I know that you have to use the columns property to center the header text of a column and you have to enter the name of the column in the "field" property....

Is that the only way to center text in the column headers? My table will have a varying number of columns with potentially different column names - therefore I can't use the already known method.

The only other idea I've come up with is to expand out the columns property with the max number of columns the table could see and then in the table data property binding use a transform script to set an unused columns visibility to false....

Thanks for any responses!

Welp...I think my hand is forced to go back to my original option - rebuilding the "columns" property each time new data is retrieved.

Haven't found anything to center the header text and set number formatting without using the "columns" property. This is what I tried in a scrip transform on the data binding (was really crossing my fingers).

Editable with UID - works well, "justify" is unnecessary
image

Tried some formatting with no luck (other than the align)
image

I think I'll still stick with using a flex repeater for each group as that is working out well. Had to build a list of objects for each row since the data is transposed and some cells are editable so I had to include a UID value for each cell in order to edit (first picture).

Figured out a trick with the number formatting....

In my transform script for the data binding...format how I want the value then use it as a string.

	metricName = self.view.params.metricName # the specific column I want, will append a group UID when retrieving it
	groups = self.view.params.groups # a list of names and UIDs that reference a specific cell in the original table, which is in a tall format. Used for editing.
	dataset = value
	
	data = []
	
	for row in system.dataset.toPyDataSet(dataset):
		rowData = {}
		for grp in groups:
			grpName = grp['text']
			grpUID = grp['value']
			if grpName != None and grpUID != None:
				rowVal = row[metricName + '_' + str(grpUID)]
				
				rowVal = round(rowVal,13)
				
#				system.perspective.print(str(rowVal))
				
				rowUID = row['all_uids_' + str(grpUID)]
				
				rowData[grpName] = {'value':str(rowVal),'editable':False,'align':'center','style':{}}
		data.append(rowData)
	
	return data

This works as this specific data won't be edited, read-only. May have to add in some logic to parse the length of very small values to properly use scientific notation.

Was just on IA support call and discussed the "headerStyle" property and why it seems the only setting that doesn't work is text alignment. All other settings I tried will affect every column.

Confirmed with IA that using the tables headerStyle to try and center the text for every column without using the columns property is a bug. Here is the work-around from them:
"
I just wanted to provide you with an update on this ticket. I have confirmed that what you found is a bug and the devs will be looking into it on our end, pending a resolution date.
However, I was able to find a suitable workaround since you are in a version above 8.1.22, which allows for Advanced Stylesheets.

In our custom stylesheet we can add the following script:

.psc-centerAlignColumns .table-container .t .thc .content {
    padding: 5px;
    justify-content: center !important;
}

"

Worked like a charm! Thanks IA!

....I need to learn more about CSS....soon....

Is there a method to center the column headers that does not require creating a custom style? I would imagine that this function should exist within the property editor for the table. I am able to change other features of the header text like size and making it bold just not the alignment.

columns.0.header.justify : center

Be careful though. Just because you can doesn't mean you should.
Most professionally done tables will have text left-justified and numbers right-justified. There are plenty of articles on the subject on the web.

Where exactly would you be adding this? There is a header style but changing text alignment does nothing. Other features within this will change the header however.
image

That's the exact path to the table property you need to edit. Notice that it doesn't start with headerStyle.

Expand the columns property and you'll see it under header.