How to make button invisible when not selected

hunterman9 wrote on 12/17/2012, 12:09 PM
I've done this in other authoring programs, but I couldn't figure out how in DVD Arch Pro 6.

I have several titles and at the side of each description, I wanted a custom graphic that is the button adjacent from the text. If you have ever used DVDLab Pro, it was a visibility setting called something like "visible selected". I can get the graphic in just fine and mask it how I want, but all buttons are visible on the menu page. I only want the button that is currently highlighted to be visible, all others should be invisible until the user navigates to it using the remote.

Is this possible?

Comments

videoITguy wrote on 12/17/2012, 3:38 PM
YOU are NOT talking about "invisible" button as described in DVDAPro.

What you ARE REALLY talking about is the highlight property value of a button. That property describes how the button will "move" as you activate the cursor of your set-top player remote. Check the highlight property drop-down box per button selected- You will have several options including transparency and luminance. Depending on how you mask, and how your button graphic is actually designed and saved - these are the properties you have a need to use. They will "move" the selected button graphic from one cursor step to the next. The simplest graphic can be a small pureblack image (like an arrow drawn in black) that appears in .png file with transparency channel on -background of image is transparent.
hunterman9 wrote on 12/18/2012, 10:37 AM
I'm trying to play with those settings to make it happen, but so far I'm not getting it right.

What I tried to do was have my arrow graphic, called "button-01", that is a black arrow with transparent background. Then a mask for that that completely covered it up called "button-01-thumbnailmask". In other words a completely black square. Then I added a highlight mask called button-01-highlightmask" that had the arrow as white, and the rest as black.

The problem is that the button never does appear. It's like the thumbnailmask graphic overrides the highlightmask graphic.
videoITguy wrote on 12/18/2012, 10:50 AM
This is tricky business - rather than DVDAPro actually outright make this the default highlighting style -as does Encore, you REALLY have to work for it.

Your conclusion of what you are doing wrong is absolutely correct.
Look at my suggestion again, and forget loading a mask.
vtxrocketeer wrote on 12/18/2012, 12:03 PM
hunterman, I started to make menus like you want this year, e.g., "moving" button pointer. A fellow user shared with me a tutorial that details the process. I'm not at my editing computer, but I can send it along later if you wish.

It is a straightforward task to be sure, but as videoITguy stated, DVD-A makes it a total chore, e.g., lots of prep work, mouse clicks, etc. (Oh, you want your car to actually roll along the ground? Well, first find some wheels, then get the lug nuts, next jack up your car, etc.) This is one of my several irritations about DVD-A that make me want to leap to Encore.
hunterman9 wrote on 12/18/2012, 12:31 PM
Thanks for the replies. I will try what you say and report back.

Thanks again.
hunterman9 wrote on 12/20/2012, 3:55 PM
OK, I got it to work. Here is what I did:

I made a black arrow on a transparent background in png format which became my button image. Then using the same size image, I made a completely black graphic. This became the mask for the media section. The third graphic I made was an inverse of the first, in other words, a white arrow with transparent background. This file became the highlight mask. You have to change the highlight style to "custom" then load this third file as the mask, and select "transparent" on the mask mapping.

Now the only time you see the button is when it is selected. If you don't like the color, you change it in the color sets.

I haven't tried it using anything more complex than a simple black graphic, but presumably if you using enough transparency in the color sets, it could be more artistic.

Thanks again for all your replies.
Jack S wrote on 12/23/2012, 11:15 AM
Hi. I've been doing this with my menus for some time now. This is how I do it. There is plenty of choice in the existing buttons or you can create your own masks.

To create buttons that become invisible when not 'active' carry out the following.

Create the menu background as normal then populate it with text or images that correspond to the actions to be taken when they are 'bulleted'.

Decide on a button style from the button library and drag it onto the menu. Change its size to suit the text or image it will reference.

Ensure that 'Show Button Masks' is selected in the 'View/Workspace Overlays' option (CTRL+B).

With the button selected click the Media tab in Button Properties. Right click on the Frame Media file in Frame Properties and left click the drop down arrow. From the context menu that appears select media Properties. This will display information about the button. Make a note of the file name and path.

Click the Highlight tab and click the Style box. From the drop down options click Custom. Click the Mask box and select Replace. Navigate to the file above and select Open.

Click the Media tab again then the Frame Media box. Click the drop down arrow and select Remove.

Still in the Media tab click the Mask box in Thumbnail Properties. Click the drop down arrow and select Remove.

With the button selected, click the Color Sets tab and change the fill colour and transparency of the button to suit. Adjust the blend colours to get the best result.

Select Highlight in the button properties and ensure that the Mask Mapping is set to Transparency.

My system
Genshin Infinity Gaming PC
Motherboard Gigabyte H610M H: m-ATX w/, USB 3.2, 1 x M.2
Power Supply Corsair RM750X
Intel Core i7-13700K - 16-Core [8P @ 3.4GHz-5.4GHz / 8E @ 2.50GHz-4.20GHz]
30MB Cache + UHD Graphics, Ultimate OC Compatible
Case Fan 4 x CyberPowerPC Hyperloop 120mm ARGB & PWM Fan Kit
CPU Fan CyberPowerPC Master Liquid LITE 360 ARGB AIO Liquid Cooler, Ultimate OC Compatible
Memory 32GB (2 x 16GB) DDR5/5200MHz Corsair Vengeance RGB
MSI GeForce RTX 4060 Ti 8GB - Ray Tracing Technology, DX12, VR Ready, HDMI, DP
System drive 1TB WD Black SN770 M.2 NVMe PCIe SSD - 5150MB/s Read & 4900MB/s Write
Storage 2 x 2TB Seagate BarraCuda SATA-III 6.0Gb/s 7200RPM
Windows 11 Home (x64)
Monitors
Generic Monitor (PHL 222V8) connected to GeForce RTX 4060 Ti
Generic Monitor (SAMSUNG) connected to iGPU

Camcorder
SONY Handycam HDR-XR550VE

Paul Masters wrote on 12/26/2012, 12:49 PM
Hello:
I went through that with DVDA a number of years ago. I found some information, not sure where (may be on this forum) on how to do it.

It appears you have discovered method #1. That will work great when the graphic is a solid color as you are doing.

For what it's worth, I generally don't use the Activated state. First, with these methods, generally you can't. Second, it flashes on and off the screen so quickly that it is likely not noticed unless you are looking for it. And, not using it can make the button creation and definition much easier, especially if the image is a picture. If the button is a solid graphic or text using the Activated state works better.

There are 2 ways. Neither give great results but both work after a fashion. This appears to mainly be due to the DVD spec. limits. That is, how DVD buttons work. However there are some quirks with DVDA as mentioned below.

#1.
Create your button as normal, but use very few colors. (I had to modify my photo image somewhat in PhotoShop to flatten the number of colors. Otherwise the resulting button appeared as a lot of little splotches or dots.)


In DVDA:
Set Button Properties / Media / Button Style to Image only. Leave all the rest at none.
Highlight:
Set Style: Custom. Mask: the file with your image (I used PhotoShop PSD). If a PSD indicate the Layer.
Mask mapping: Intensity. Although you could use one of the other options.

Choose a Color set and make the mode Specify colors.
In the Menu Page Properties / General set Selected button colors to the Color set you will use.
Set Activated and Inactive button colors to None (all transparent).

Now the fun part!
Modify each color, #1, 2, 3, of the selected Color set to get as near to the image / color as you can. Leave #4 transparent.
The trick is to get the colors to be what you want. It is best if the displayed image is small as the areas will be 'cartoony' (of course if that's what you are going for, then the size doesn't matter).

The problem is that the overlays are 4 color. Well, only 3 color because you have to leave color #4 transparent unless you want the transparent part of the rectangle a color. (As you know, all buttons are rectangles regardless of what you see.)

If you want full color image, then....

#2.
This only works if -ALL- the areas on the background where the buttons will appear are the same color. It must be 'flat' no patterns etc.

Create your button as normal using the image and colors you want (within the DVD color space limits).

In DVDA:
Pick a Color set and make the mode Specify colors.
You may want to make that set Custom instead of Project wide, but that will depend on how the color sets have been assigned, if multiple pages are being used, the color of the background for those pages, etc.
In the Menu Page Properties / General set Selected button colors to None (all transparent).
Set Activated and Inactive button colors to the Color set you will use.

Modify each color, #1, 2, 3, of the selected Color set to be as near as you can to the color of the background image where all the buttons will appear. Leave #4 transparent. (Thinking about it, #4 might be set to the same color as the others. I haven't tried that, but it isn't necessary.)

That is a bit tricky. As I remember, I used the numbers for RGB for that area of the background in PhotoShop. However, when putting those numbers in DVDA, the button rectangle could be seen. So, I used the eye dropper in DVDA to sample one of the areas. That got it nearly perfect. (I guess RGB numbers aren't always the same.)

Set Button Properties / Media / Button Style to Image only.
Set Thumbnail Properties / Thumbnail Media to the file with your image (I used PhotoShop PSD). If a PSD indicate the Layer. Leave all the rest at none.
Highlight:
Set Style: Custom. Mask: the file with your image (I used PhotoShop PSD). If a PSD indicate the Layer.
Mask mapping: Color channel.

The highlight image needs to be the same size as the button 'media' image. Fill it with one of the 4 solid colors. I used red, but green or blue should work.

A few words about how DVDA works with button images:
For some reason, if the image has any transparent pixels between the image and the edge, DVDA will enlarge the image so it doesn't. Why it does that I have no idea. I posted a problem about this and otherwise talked with Sony support a number of years ago, but apparently to no avail. I contend that DVDA should take the button as I present it. Sony says they do that in case there are transparent pixels on the edge to make the image larger.

OK, with the above in mind.
When you create any button, resize it so there are no transparent pixels on any side. That is, be sure that the image goes completely to each edge. That will make working with buttons and masks in DVDA much easier. This is partly because using Crop and Adjust, you can shrink the image but you can't enlarge it.

Now what does all that have to do with method #2?
The problem is that sometimes, well, actually usually, the highlight rectangle does not completely cover the image. So, in the unselected state, you may see a little (or sometimes a lot) of the button around the edges.

Using a layer in the PhotoShop image doesn't solve this. If you make the entire image larger, DVDA will expand the button image to remove the transparent pixels at the edges. Or the highlight layer isn't quite large enough to cover the image for some other reason. You would think that if you made the highlight layer the same size as the image, regardless of transparent pixels on the edges it would work. For some reason it doesn't.

To get around this, I used one PhotoShop file for the image and another, larger one for the highlight. That fixed nearly all the problems. I say nearly all because there is one button that a very small part still shows when it is not Selected that shouldn't. But as it is so small, it is hard to see even if you are looking for it.

One example:
Button image: 400 x 250 Highlight 'image': 480 x 330
This difference doesn't appear to scale so each button has to be adjusted separately.

Hope all this helps. And, good luck.

Paul Masters