How do I get the background for "All Programs" to not color on mouseover? I have some themes that this happens with and I have several that it does not happen with and I cannot figure out what they do not have in common (I am modifiying themes I have downloaded for my personal use). Thanks.
Comments (Page 2)
3 Pages1 2 3 
on Apr 29, 2004
But, on the second skin, that idea is not possible. Because the left side and bottom portion of the all programs pane in the second skin, is not a solid continuous color.


Chas, the left and bottom portions don't matter because you can control the size of the highlight by adjusting the content margins of the More Programs Panel background. In the Smile skin, those margins are set at 0,0,0,0 which is why the highlight covers the whole panel. If you set the Left content margin at 22, the Bottom content margin at 6, and leave the Top and Right content margins at 0 or even set them at 1, then the highlight will only cover the large nearly uniform light grey portion (Approximately RGB 214,214,214) of the More Programs Panel Background.

You then would need to set up a new Preset Color, I think it would be 05 in this skin to that 214,214,214 color. Then Set the Mouse over/Focus color to the Preset Color 05, and the highlight should disappear.

Unfortunately, at the moment, I seem to have a bug with my latest build of WB wherein my skins seem to be inheriting that particular color from the previous skin when I change skins, and nothing I do seems to change it. SO if I could ask someone else to please try this procedure as I've outlined, I'm quite certain it will work. Thanks.
on Apr 29, 2004
Shameless...The mouseover for the All Programs will always inherit the color of the previous skin unless it is set in Left Tree => Miscellaneous => Colors....Right Tree => Menus => Menu - Hilighted background (XP Only) Just enter you RGB values here.

The Mouse over/Focus color is the WB4.x replacement for Hover Color and is supposed to change the color of the text when it's hilighted. I'm not sure what other Mouse over/Focus, that has an ability to use a preset that you are referring to.
on Apr 29, 2004
Ahah! Thank you very much, SNK. I was in a rush before, trying to get things done before I had to head out the door. Don't know where my head was at.

At any rate, By changing the Highlighted Background color, as Essencay points out in #17, and by using the content margins as I described in #16, you get this in the Smile skin:


Which I think is pretty close to making the highlight disappear in this skin.
on Apr 30, 2004
If you'll notice though, the bottom portion of the arrow is cut off. Sure, you can adjust the content margins on the left side and set the background color. But, the arrow extends into the gradient on the bottom. You can probably adjust the content margins on the bottom, but you will probably need to change the arrow(add some magic pink above or below) and then I found it to be very difficult to make the text center with the arrow. As you can also see, the text is not completely centered with the arrow, and the arrow is not centered in the pane.
on Apr 30, 2004
I was looking at your graphic again. It would have been really interesting if the artist actually used the effect that I see in your picture. It almost looks as if the All Programs letters are multi-colored on mouse over. That would be awesome and it could be accomplished using the large arrow idea.
on Apr 30, 2004
Good point Chas, I admit I missed that. However, since the More Programs Arrow graphic is a .tga, and not a .bmp, there is no need for magic pink here. And since Skin Studio will do the conversions back and forth from .tga to .png and vice versa, it was a simple matter to simply crop the excess background from the arrow graphic and presto change-o, the arrow is completely restored and realigned with the All Programs text. It took me less than 3 minutes.

I do admit that the items are not lined up perfectly in the center of the panel, but they are centered in the "flat" part of the panel above the bevel, and I think it looks quite good, myself. The point is, that with a very little judicious editing in skin studio, often times these things are quite easy to adjust for either a skin artist creating the skin, or a skin user tweaking it for use on her/his computer.

I guarantee you, this is easier than replacing the whole works with an oversized MoreProgsArrow graphic. There is still times when that method has a advantages. If I didn't think so, I wouldn't have worked as hard as I did in that other thread to convince you it could be done the last time we had a big discussion about this topic.

I mainly just wanted to show here that both methods of dealing with the highlight are equally viable depending on the skin. I think I came close to that objective at least.



on Apr 30, 2004
By the way, on a completely off topic note, I love threads like this where truly interested people give and take for the good of all. Even though I didn't start this thread, I learned from it. I want to thank all of you. Threads like this are what got me excited about skinning when I first came to WC. It feels good to be involved in a discussion about skinning instead of reading another complaint list or flame war. You all gave me something to look forward to the last couple days. So, thanks again.
on Apr 30, 2004
Very good, SD. I like that theme too. That all programs section can be a bit of a pain. But, all constraints on it are gone now. It just takes a little creativity. Again, good work.
on Apr 30, 2004
My question now becomes, does the original theme look that good? Probably not as most artists don't seem to care about that part of the skin. But, I think it can ruin a great skin.
on Apr 30, 2004
This is the best way I have found to get around the problem

1. Adjusting the More Programs Backgrorund Image left hand margin to -120 pushes the single mouseover colour off the screen

2. You will now have to create a new image for the arrow. Copy the left hand side of the background image. I have found that if the background is 190 x 28 pixles then copy 150 x 28.

3. Set up a new image 3 x the copied size. This will be 450 x 28 pixles. Paste the copied area for the normal, mouseover and pressed states.

4. Create a new arrow image for each of the three states and paste these in place. You may also wish to add some text as previously altering the margins pushes the text of the screen.

5.As previously mentioned set the Background contents Left margin to -120. Set the Right hand margin to 40 as this is the amount subtracted from the background image to create the arrow image.

6. Save the image as .bmp


https://www.wincustomize.com/skins.asp?library=1&SkinID=4101

for an example of how it works.

Hope this is of some use.




Powered by SkinBrowser!
on Apr 30, 2004
Well, this is the best way I've found to fix the problem.

http://www.guiolympics.com/skins2004.asp?skinid=118
on Apr 30, 2004
Nice




Powered by SkinBrowser!
on Apr 30, 2004
1. Adjusting the More Programs Backgrorund Image left hand margin to -120 pushes the single mouseover colour off the screen


Actually, that''s not true. a negative left content margin of that size will actually pull the text and the MoreProgsArrow.tga (MPA graphic) to the left, and if the MPA graphic is large enough, it will cover the mouseover color (highlight) so that you don''t see it. I set up a delay of the menu opening so I could capture this shot from your skin so you can see what I mean:



The shot above was taken with the cursor over the MPA graphic before the More Programs Menu actually opened. The green arrow is pointing to the highlight which is still partially uncovered by your graphic because the graphic doesn''t fill the whole panel width. I mostly just wanted to show here that the highlight is still there, it''s just covered by the graphic, and shortly after hovering, by the menu as well.

But you can see something else here as well. Note how you can see the whole outline of the MPA graphic due to the pattern mismatch. That is because the whole graphic is not in the window. Only 133 pixels in width is showing, with the left part of the graphic pulled off-screen. More on this later.

2. You will now have to create a new image for the arrow. Copy the left hand side of the background image. I have found that if the background is 190 x 28 pixles then copy 150 x 28.


The size of the graphic really depends on the graphic elements in the background. a graphic that size wouldn''t work for example on Copperdeck 2, which I think you can see if you look at post #29 of this thread: https://www.wincustomize.com/msgboard.asp?id=262666&BID=WCH&page=1#266760

5.As previously mentioned set the Background contents Left margin to -120. Set the Right hand margin to 40 as this is the amount subtracted from the background image to create the arrow image.


Ok, we''ve seen that the content margins of Left neg 120 and Right 40 result in a misaligned graphic in the screenshot above. I maintained in that thread I posted that a left content margin setting of about neg 90 would be right so let''s see what happens:



As you can see with the Left set at neg 90 and the Right at 40, now the graphic is lined up correctly with all 150 pixels in width showing. But it doesn''t make sense, because we shifted the content margin by 30 pixels to the right, but the graphic only shifted 17 pixels. What happened?

Notice the highlight is missing completely in that screenshot. The reason the MPA graphic only moved 17 pixels is that it bumped into the right content margin. We can prove this by setting the Right content margin to 0 as you see below:



As you can see, the highlight is now completely shifted to the right edge of the panel at x:190. But the MPA graphic did not shift as far to the right as the highlight did. It only shifted 14 pixels to the right, pulling the text along with it. Why? The answer is this:

The mouseover color highlight is unaffected by the left content margin and can only be pushed to the left by setting a positive right content margin. The MPA graphic, on the other hand, is influenced mostly by the left content margin, pulling it left when the setting is negative and pushing it right when the setting is positive. The only time the right content margin affects the MPA graphic is to limit movement to the right.

To prove it, here is one last screenshot. In this shot the right content margin remains set at 0, and the left content margin is shifted 14 pixels to the left to neg 104:



As you can see, the MPA graphic is once again properly aligned and the highlight is still all the way over to the right edge of the panel.

PS: By the way, the default image type for the More Programs Arrow is now .tga, not .bmp. Bitmaps will work, and if you plan to cover the whole panel with the MPA graphic, then I don''t think it matters too much, but in most cases, I think I''d prefer to use a targa and take advantage of the alpha blending.
[Message Edited]
on Apr 30, 2004
mitchec,

I wanted to add that I really do like your Marmo skin. It is great to see someone using some different textures and taking a different approach. Marble, wood, and other irregular patterns can be tough to pull off in a WindowBlinds skin, but you did a great job with it. Congratulations, and thanks for offering us your hard work.

I also want to thank you for taking the time to post on this thread. I wish more people would participate on this board and share their knowledge. There used to be a lot more activity on the skinning board. I wish it would pick up again. It's one of the things I like most about WC.

By the way, there were a couple of other things I noticed while I was playing with your skin for this thread. Just a few things you might want to take a look at if you're interested. My email is listed in my profile, just click on my name.
on Apr 30, 2004
Another thing you'll run into if you're trying to hide the mouseover with a .bmp, if you use magic pink the mouseover will show through. So using a .tga as Shameless said is the direction to go in
3 Pages1 2 3