Skinning & Rendering

[mvallevand]

I am have a nightmare of a time trying to set the alpha level for a particular rectangle transparent in a region that is managed by many elements.

Is there an order of priority that the layers are applied?

Is the last item in the last active Element in the last RenderList always applied last or are there other factors?

Do items in the Element override the Element's attributes?

Does the Background Element get added first or last?

Finally what is the difference between alpha"##" and using fillcolour="#ARGB" and does this affect priority?

Sorry for all the questions, but I can see why Hairy gave up on skinning the trial and error is driving me crazy.

Martin

[sub]

Are you trying to set the alpha on a whole UIElement (ie <Element> in skin file), or just one of the rendering instructions in an UIElement (ie, like <RoundedRect> inside an element in the skin file).

Is there an order of priority that the layers are applied?

Is the last item in the last active Element in the last RenderList always applied last or are there other factors?

When you the skin helper to renderer a UIElement (skinHelper.RenderElement()), it always goes through the rendering instructions in the order your skin's xml defines them.

Do items in the Element override the Element's attributes?

No.

Does the Background Element get added first or last?

Do you mean the main background behind the menus? This is added to as the first thing in the render list, so that its drawn on the screen first, then the other things in the renderer list is on top of it.

Finally what is the difference between alpha"##" and using fillcolour="#ARGB" and does this affect priority?

I'm not sure exactly where you're talking about, but an <Element> typically has a alpha="255" or similar to describe the alpha level that will be applied to that UIElement when it is shown on the screen. Inside that element, you can have rectangles and text etc, which are usually solid colors (at least in my skins) but you can use to use semi-transparent colours. When the app does any animations, like fading a screen in etc, it does this by manipulating the Element's alpha, its always still relative to things contained in that element though. ie if you had a rectangle inside your element which is only 80% opaque, but elements alpha is set to 50% for displaying on the screen (maybe part way through an animation), then that rectangle would probably be only 40% opaque on the screen.

[mvallevand]

What I am trying to do is eliminate an alpha mask for a selected album. In this case I want to have Adele's second album not have the alpha mask. ListItemSelected is the last Element in the second skin that touches this region and I cannot come up with a why to do this I would think with no alpha it would the same.

Code:

    <Element name="ListItemSelected" location="35.8,12.75" size="21,26" alpha="255" alphaFade="true">
        <RoundedRect location="0.77,0.77" size="99.2,99.2" fillColor="transparent" alpha="0" borderColor="Border2" radius="0.77" borderWidth="0.38"/>
        <Image visible="!@hasPreviewImage" source="..\_Common\folder_music.png"  location="10,20" size="90,90" fixedAspectRatio="true" />
        <Image source="@previewImage" location="3,1.75" size="96,96.5" alpha="0" fixedAspectRatio="true" />
    </Element>

Martin

[sub]

<Image source="@previewImage" location="3,1.75" size="96,96.5" alpha="0" fixedAspectRatio="true" />

It doesnt look for an alpha attributre on an <Image>. Instead it uses the pixel alpha values from the image itself. ie, if you supply a PNG, it could have transparent areas or semi-transparent areas.

[mvallevand]

A jpg should not be transparent though, I do want to just see this image but I don't want a previous alpha mask to obscure it.

Martin

[mvallevand]

Also in my example wouldn't my rectangle have punched a hole through the alpha mask?

Martin

[sub]

In the case above, what is @previewImage? Is it an image object, or a callback to IGetImageCallback? If the latter, how are you creating the image it returns?

[mvallevand]

In the case above, what is @previewImage? Is it an image object, or a callback to IGetImageCallback? If the latter, how are you creating the image it returns?

Good point I don't use jpgs for my FIFO cache it is

Code:

if (image != null)
                {
                    MemoryStream ms = new MemoryStream();
                    image.Save(ms, System.Drawing.Imaging.ImageFormat.Png);
                    iconCache[media.Filename] = ms.ToArray();
                    ms.Dispose();
                }

Martin

[sub]

Also in my example wouldn't my rectangle have punched a hole through the alpha mask?

To be honest, I dont really follow what your mean.

If you're calling skinHelper.RenderElement(), passing in 'null' for the bitmap, then creates a new bitmap, fully transparent, then proceeds to draw the render instructions that make up the element. If the render instructions will result in a bitmap can either full the space, or have transparent or semi-transparent areas.

[sub]

fillColor="transparent"

Its worth noting that the .NET Color names are case sensitive, so you need to use "Transparent" with a capital "T" or you'll probably get the default white.