We have created custom sort indicators to go below the text in a column so we can utilise the space as much as possible.
The existing sort indicators require additional column width to fit the image in. While using our custom image some column text is being trimmed even though we are using our own indicators.
How I can I stop the control from trimming my column text to make space for the sort indicators (which no longer exist)? Do I need to add further functionality to my draw filter?
That seems odd because in the first screen shot the indicator does not seem to be interfering with the column text but in the second one it is. You say you used IUIElementDrawFilter for this, so I have to conclude that something in your code is causing the indicator to draw over the text in the second example, but not in the first for some reason. If you are able and you want to, you can attach a sample project and we can take a look and see what's going on there.
I took a quick look at our positioning code for the HeaderUIElement, and it looks like the TextUIElement's height is always the same as that of the element, which means that there is theoretically no way to carve out additional space below the text. You just happen to be getting away with it because the header height probably includes padding so that the TextUIElement is always a little bigger than it needs to be to display the text. The problem is that this can be unreliable if different fonts come into play. I'm not sure how much space you are accounting for but it is possible that it isn't enough.
From more investigation my end it seems the control is shrinking the test displayable area of the column header so that the sort indicator can be displayed. However, if the column is less than a certain width it does not seem to do this.
The reason the control must be trimming this text is if you hover of the column it displays the full text asa it should when not all the text can be displayed in the column width provided.
I am creating a sample application to show my issue - bare with me... Unless you can figure it out before them.
That's what I needed, a CreationFilter! Thank you.
I have one follow-up question though. The width of the parent (HeaderUIElement), in my example, is 6 pixels bigger than the TextUIElement. How is this 6 pixels calculated so I don't have to use a constant?
Hi,
The code to calculate the positions of the elements can be quite complex. It has to account for a wide range of buttons, like Filtering, sorting, swapping, checkboxes, etc. But you presumably know which of these features are enabled in your grid, so you can probably just use headerUIElement.RectInsideBorders as your working rect.
I have a further follow up question on this subject...
While using my custom sort indicators I am getting an issue with the filter buttons not being clickable. The custom sort indicator is drawn, the image for the filter button is drawn, but no boundary appears that indicates it can be clicked, and therefore, it cannot be clicked. How can I get my draw filter (or creation filter) to draw the filter button as normal?
P.S. I am overriding the HeaderUIElement for Win.DrawPhase.AfterDrawElement to draw my sort indicator.
I think I might have figured it out... The issue is with my CreationFilter and the change discussed above about the text being trimmed. Changing the TextUIElement rectangle to match the RectInsideBorders.Width was preventing the click. Changing this bit of code within the AfterCreateChildElements method to simply extend the width by two-thirds of the width of my custom sort indicator seems to do the job.
However, I'm not sure why 16 pixels seems to do the job when my custom sort indicator is 24 pixels in width... Oh well!
Problem solved. The default sort indicator is 9 pixels. I simply need to extend the width of the TextUIElement by 9 pixels and problem solved.
The 16 pixels was misleading because this was 9 pixels for the default sort indicator, and a further 7 pixels covering the filter button. The filter button was actually still being prevented from being clicked on half the image.