Property Inspector Control

Here is a custom control that allows the developer to create “property inspector” like dialogs… similar to the ones found in Xojo, Pages and other major applications.

The PI control supports any combination of the following controls

  • TextField
  • Label
  • Checkbox
  • Popup Menu
  • PushButton
  • IconButton (a custom darkmode compatible bevel button [NOT the one Norm offers :slight_smile: ] )
  • SegmentedControl
  • Separtor Line
  • Slider
  • UpDown Stepper
  • ColorWell (also a custom designed control…)
  • Switch (another custom designed control)

A demo can be downloaded here, and allows you to test it using dialogs you can design yourself. It comes with two built in to the demo. A simple one with just a few controls, then only the replicates the Property Inspector for a Xojo Textfield.

www.rdS.com/PI/PI_DEMO.zip

This demo will run on in the IDE, and the actual control is encrypted. If you would like the full source code, send ($20US) via this PayPal link

www.rdS.com/donate.html

This is written in 100% Xojo, no declares, no MBS. It does have macOS/Win10 specific code to insure various controls behave properly, but that is just Target Pragmas.

NOTE : the code is compatible with Xojo2019r1.1, but should be easily updated to R2 with some search/replace. However at this time, I will NOT be doing an R2 version (it will run, just with deprecation warnings)

Fyi… for those of you who may have seen CPI (Custom Property Inspector) that I made available two years ago… this is basically “version 2”, it is a total rewrite, there is nothing in common (except the visual aspect).
The code is 100% new, the internal structure is totally different… The first was based on a Listbox… this one is not…

Hi Dave

Your timing is perfect as last night I was thinking about which property plugins I was going to use but none of the looked how I wanted. This is perfect and looks really professional and I will be buying later today.

One small thing which I am not sure if you can do anything about is when you use a dropdown eg Scope, Alignment etc in your example the label on the left does not lineup with the dropdown box / text like all of the other types. I think this is due to the height of the dropdown box itself.

Is there any way you can fix this to make is visually better?

Cheers

Nathan

I will look into that today… PopupMenus are a pain for alignment as they act totally differently from macOS to Win…

Any other features/suggestions would be welcome

would be nice to have a baseline alignment between controls that was correct

be more specific? I spent all day yesterday tweaking how it postiioned controls vertically

sorry
would be nice if XOJO supported “align baselines” x-platform and you could set it in the IDE OR at runtime
would make certain issues just go away

Look at your PopupMenus. Draw a horizontal line for the Label and PopupMenu’s Text (baseline).

  • Scope <-> Private
  • Alignment <-> Default
    The Text’s are “flattering”, are not on the same y-position.

Whew… :slight_smile: thought you saw a visual anomaly that I hadn’t other than tweaking that stupid Popup that Nathan already mentioned.

And for those of you looking at this in WIndows… due to the fact that you pretty much lose control over the height of a popup based on the font size… Windows is forced to use a font 3px smaller just to get the popup box to line up. If you have a trick or declare that fixes that… I’d be happy to add it

I just measured the text baseline under macOS
and on a Retina machine is is off by one pixel (1/2 point)… can’t get any closer than that
on a non-retina it is also off by one pixel… so best I could do is drop it one point, but then it would be one pixel below on a Retina machine

Windows is a whole different kettle of fish, PropInsp is based on a 16pt font… but for Windows I had to make the drop down 13pt other wise the bounding box was too big

The screenshot above was originally taken before certain tweaks happened. I replaced the image, but can’t get the forum to refresh it :frowning:

Dave, the Switch control isn’t visible in the demo… using Windows 10.

Compiled with 2019R2. I couldn’t get the project to run in 2016R3.

there are 4 images required that should have been in the zip file… and under PROPERTY INSPECTOR (images)
which should not be encrypted