Transparent Color Box

[Cat]

This falls in the category of "It's the little things that sometimes make LV programming so frustrating."

 

I need to be able to make a transparent color box.  One would think that selecting the "Allow Transparent" property, and picking the transparent box on the color selector tool would make the box transparent, but no.  It makes the box white with a capital T in it. 

 

My understanding of the definition of "transparent" is that if something is transparent, you can clearly see anything behind it.  Not that you can see a white box with a "T" over top of it.

 

Am I missing something?

 

There are lots of links to cludgey work-arounds, in versions of LV before "Allow transparent" was an option (I guess).  But this should be a trivial thing, considering the property is there.  And any other control that is allowed to be transparent is actually transparent. 

 

(In the actual app, I've got a cluster of arrays with a total of 1000+ color ramps representing sensor channel values.  I need an overlay of color boxes to mask out unused channels with one color, bad channels with another color, and transparent boxes for good channels.  Except transparent color boxes aren't actually transparent...  I could cludge this by using booleans or something instead, but it seems like this is what a color box should be for.)

[hooovahh]

I don't fully understand your problem but a transparent color box confuses me a little.  Generally a color box is there so a user can select a color, how is the user going to know that the color box is there if it is transparent?  Won't it look like nothing is there at all?  Could you possibly make the color box not visible if they select transparent?  I guess you would then need to detect a mouse down and show it again so they can select another color.

[Cat]

I don't fully understand your problem but a transparent color box confuses me a little.  Generally a color box is there so a user can select a color, how is the user going to know that the color box is there if it is transparent?  Won't it look like nothing is there at all?  Could you possibly make the color box not visible if they select transparent?  I guess you would then need to detect a mouse down and show it again so they can select another color.

I am going to set the color box programmatically depending on what type of sensor indicator (a color ramp) is underneath it.  If it is a unused or bad sensor, the color box will have a mask color.  If it is a good sensor, the color box will be transparent in order to see the sensor data value underneath it.  The user never sets this color box.

 

I can't hide the color boxes, because the color boxes are in a series of arrays.  There are 1000+ sensors organized in 20 arrays of 50 sensors each in order to not have to deal with 1000+ individual controls.

[viSci]

If you only have one or a few mask colors then you could layer simple square booleans (mask color/transparent) over your sensor

[hooovahh]

I can't hide the color boxes, because the color boxes are in a series of arrays.  

Yeah I realized that after I posted.

 

Attached is my test that I think does what you want, or atleast will help you in one possible solution.  It is a virtual array.  You have a UI element that looks like an array but it is actually several clusters and a vertical scrollbar.  Then the values in the cluster are changed based on the scrollbar to simulate an array control.  You can then click and change the color, and going transparent will make the control not visible.  This is some rougher code I was in a hurry and probably spent too much time on it as it is.

Transparent Color Box Test.zip

[Cat]

If you only have one or a few mask colors then you could layer simple square booleans (mask color/transparent) over your sensor

Yes, that's what I was attempting to say at the end of my original post.  It just seems like a lot of work to replicate something there is seemingly already a control for.

[Cat]

Attached is my test that I think does what you want, or atleast will help you in one possible solution.

Wow.  If you've ever entered any of those speed programming contests, you must have won! It doesn't quite apply here, but it's an interesting concept, and I might steal it for something else I'm working on. Thanks!

 

Here's a pic of what I'm looking for. But imagine it with clusters with 20 rows and 50 columns... The sensor data on the left is a cluster of arrays of color ramps.  I want to overlay it with the cluster of color box arrays on the right, to produce the cluster on the bottom.  I had to use booleans to do this for the picture (obviously).  I may have to do this for the real thing, I guess. I can use 20 clusters of 50 elements each (instead of arrays) so I can change the colors on individual booleans.

[Ton Plomp]

I assume that the panel color 0x01000037 is not sufficient?

 

Ton

[ShaunR]

Yup.

+1 to Ton

Edited April 3, 2013 by ShaunR

[Darin]

Thinking outside the color box for a moment, for a simple solution I would use the high and low color values of the ramp to indicate not in use or bad and set the values accordingly (easy using +/- Inf).  Adjust the scale of the ramp to handle all valid values.

[Cat]

I assume that the panel color 0x01000037 is not sufficient?

You assume correctly.  The value of the color ramp underneath the color box has to be seen. That's why the color box needs to be transparent.

Thinking outside the color box for a moment, for a simple solution I would use the high and low color values of the ramp to indicate not in use or bad and set the values accordingly (easy using +/- Inf).  Adjust the scale of the ramp to handle all valid values.

That's what I was originally thinking, but it didn't work out very well.  There is a wide range of valid values, although 95% of the time the real data will be in a narrow subset of that.  So If I use the whole possible data range, the color gradient for the color ramp is quite small.  The user needs to see subtle differences in the sensor values, but also needs to see that "high" color flash on to know that some large transient has just hit the system.  I thought to use the "low" color for both unused and bad channels, but the user wants to be able to differentiate between the two.  Demanding user...

[JackDunaway]

Could you push the mask down the stack from the UI layer down into the logic layer? Like, before writing to "masked sensor data" colorbox array indicator, replace masked values in a for loop? Or are there specific reasons to keep the mask at the UI layer?

[Phillip Brooks]

Could you use a cluster with a picture ring placed over the color box / color ramp and then use a transparent image in the zero index of the ring?

 

I used the 1 pixel cluster border and centered the ring vert. and hor. with the color box 

 

Transparent Array Items.vi

[Darin]

I have also used the PlotImage property to put a grid onto a Intensity Graph, you could also add colored masks to various cells.

 

Grid.zip

Edited April 3, 2013 by Darin

[Yair]

You already have numerous options, but I think the simplest one in terms of similar functionality is replacing the color box with a picture control and coloring its BG transparent. Then, you just need to draw a rect of the appropriate size and for the transparency you can either use the T color for the rect or use an empty picture. The main potential disadvantage with this is that picture controls can be problematic in terms of memory usage, but I think you should be fine in this case.

[Cat]

Darin:  Thanks for the code.  I unfortunately oversimplified a bit in my picture.  The reason why there are separate arrays for each row is because there can be different numbers of sensors in each row.  So there are several different box widths.  I think this would mean I can't use the Intensity Chart.  Unless I do one for each row. Hmm...  Using an Intensity Chart might actually take care of a few minor issues I've had to work around with using a color ramp.  Oh, and I didn't even know the PlotImage property existed.  That is cool!

 

Phillip: Thank you for the code, too.  The ring method does seem to be the most straight-forward of the options. Having the colors all defined in the ring would be a Good Thing, and handy if my Demanding Users decide they want a different color for some other designation. I'd have to break it up into rows, also, but that wouldn't be a problem.

 

Yair:  Thanks for the suggestion.  However, any time one describes anything in LabVIEW as "problematic in terms of memory usage," it does not give me a warm fuzzy feeling! Memory usage is one of the two problems I continuously have with LV (that and the crappy sound drivers).  If I understand correctly, I'll have 1000+ rectangles that need to be redrawn and loaded into 1000+ picture controls every second.  I can try it on a small scale and see what happens.

 

 

Thanks again, everyone, for your help with this!  I still would like to know what the purpose of "Allow Transparent" is for with the color box, when it doesn't actually make the control transparent.  Maybe I'll ask over on the Dark Side...

 

[Darin]

The colorbox is not really intended to display a colored box (I hope that makes sense).  It provides an alternate and often convenient representation for the U32 representation of an RGB color.  Its long name would be color selection box instead of color display box.

 

I like using the intensity graph when I can, it handles changing the z-scale nicely and other things.  It is also easy to perform the color interpolation manually and use a picture for the entire operation.  The bonus is that you are not limited to the 8-bit depth that the IG has, but you lose the events and such.

 

There are many tricks, if there is a common denominator for the sizes, it is easy to use multiple points for each sensor and vary sizes that way as well.

 

And, beware the overlay of the transparent picture.  In older versions it would sometimes confuse LV into thinking it had to redraw parts of the FP when there was no need, causing considerable sluggishness.

[Tim_S]

How fast is your data changing? Does it make sense to use a single large picture control to display all of your information?

 

Tim