Changing the Appearance of a DataGrid

[okk]

Hi, I wasn't sure if this is the right forum for my question, so if any of the moderators want to move this post to a better location, please do.
I wanted to change the appearance of a DataGrid. The default look seems a bit aged for my eyes and I want to adapt it to the general look of my app. I managed to do most of the changes I wanted, but there are 3 issues where I have no idea how to address them. I only can show it in a picture see attachment.

a) I want to change the color of the horizontal line between header and table.
b) In the column header there is on the left side a small grey horizontal line, I want to get rid of it, it looks like some 3d or shadow effect.
c) In the crossing of the black horizontal line dividing header and table with the lines that divides columns there is a small grey gap under the black line.

Do you know how to change those properties? What's their name? The datagrid documentation pdf did not help me to answer those issues. It for example did not include the "header divider color" property, I just guessed it right. Thanks for any tips.

Oliver

[Mikey]

And I thought I was going to have nothing to do, today. I thought this was going to be quick and easy, because in the past, it would have been quick and easy.
dataGrids are just grouped LC objects, and so figuring this out is easy in LC 7 and below. HOWEVER, you seem to have stumbled upon what looks like a bug in LC8, which makes it hard to see and modify everything that you want to see and modify.

To make it easy for you, I wrote a script that you can modify and run to deal with this.

Create a button on your card.
Paste this script
Modify the constants
Profit

Code: Select all

constant dgName="datagrid 1"
constant newColor ="255,0,0"

on mouseUp
   #<a>
   set the foregroundColor of grc "dgHeaderBottomBorder" of grp "dgHeaderMask" of grp "dgHeaderComponents" of grp dgName to newColor
   #</a>
   
   #<b>
   put the dgProps["columns"] of group dgName into theColumns
   repeat for each line theColumn in theColumns
      hide grc "LeftHilite" of grp theColumn of grp "dgHeader" of grp "dgHeaderMask" of grp "dgHeaderComponents" of grp dgName
   end repeat #for each line theColumn in theColumns
   #</b>
end mouseUp

I kept looking for "C" (the object), but I don't see it. After I change the color in "A", it seems to go away, so I think maybe we have an optical illusion. If not, more looking needs to be done...

[okk]

Hi Mikey,
thanks so much. Issue solved. I somehow irrationally believed the datagrid is an object in itself, like a button, but when I went into EDIT GROUP mode it became clear that the datagrid is just a bunch of graphics, fields etc. grouped together. Would not have thought that the grey line (B) is just a small graphic. I don't mind issue C, I doubt that my users will complain about it... The only mystery to me is where are the Custom Properties for the datagrid stored? It would make sense that they show up in the inspector when the datagrid is selected. Thanks for spending your day solving my issue! I love this forums.

Oliver

[jameshale]

The see and change the custom properties of a Data Grid simply go the the "Custom Properties"pane of the Data Grid's Property Inspector.
There you will see a pop-up menu called "Set", as in what custom property set are you interested in.
When you first open this pane of the Property Inspector you are shown the default set "custom keys".
Usually it is empty, unless you have placed something there.
Anyway, click on this menu popup and select the set "dgProps".
I think you will find what you want there

Data Grid properties

James

[okk]

Thanks James, that's precisely what I was looking for. Not sure why I never tried to click on the SET option menu in the Custom Properties inspector. Although I could not find a Custom Property that sets the color of the line indicated by A in my image. In any case I managed to set the color by the method described by Mikey. Thanks again. Oliver