CEGUI (Crazy Eddie's GUI) Forums

Hello!

I want to make a falagard looknfeel for an image button. This Button contains:
* an imagery section of the buttons outer frame component
* an imagery section of the buttons inner frame component
* an imagery section of the buttons background
* an imagery section of the buttons foreground image

The frame components are transparent in such a way, that you can overlay them on any background and they will look like a Button with its frame modulated with the respective back ground colors.
The outer frame works as the outer relief component to make the respective Button background look like it has a flattened border towards the button, even if the background is unicolored.
The inner frame works as the inner relief component, which should be rendered above the button background and foreground image to make them look buttonlike. That way one could form any button with this relief style and replace background/foreground images without having to supply additional images.

So far all of this works fine. The problem, which let me stumble, lies in the pushed state imagery.
If the button is pushed, i want to take the forground image and display it right-down shifted from its normal position. I would do this by defining a pushed_foreground imagery with an area, which is shifted right and down by a specified offset.
If the foregroundimage is large enough or stretched to fill the same area as the inner frame component in normal state, some pixel rows would get displayed outside the inner frame in pushed state, because it still lies in the window area and won't be clipped, because of the outer frame component of the button.
I wondered if there is a way to clip a specific falagard imagery section to a user specified clipping rect.
The only two ways i could think of without adding or changing CEGUI code is to add the outer frame component als child window to the looknfeel and to turn off clipping by parent for it. The window size can then be adjusted to the inner frame component and would do the needed clipping.
Another possibility could be to define two images out of a specific image set, one containing the whole image and one covering only a subset. And then use this subset image for the foreground in pushed state. But this is a very ugly solution and wouldn't be suitable for having dynamic rendered foreground images, i think.
One other, more general, solution could be to add a possibility to specify a clipping rect per state imagery section. This would allow other things like taking any subset of an imagery and render it, without having to make any contortions.

The last solution would be my favorite one. However, it is only achievable by modifying the CEGUI falagard base system, i think.

Is there a more suitable way, which i might have overlooked?

If you think the last solution would be desirable, i might consider to code the needed changes.

Yours sincerely,
Grimmigbeisser

Hey grimmigbeisser, sorry for the late reply.

I am not well versed in the falagard / looknfeel systems, so my input may be worthless. Anyway, it would be nice to see visual examples (pictures) of what you describe as it may help myself, and perhaps others, to see what you are trying to describe.

With that said, I think I vaguely understand what you are attempting: something like a sunken border where, when the button is pressed, part of the button (foreground) appears under the border (background); for this to occur, you need to clip the button so that when shifted, does not overlap the border?

I think that the solutions you came up with are, unfortunately, probably the best existing options. I do know that the falagard implementation supports some type of clipping but I am not sure if this is made available outside of cilppedByParent (I've never heard of specifying clipping parameters in the xml). Allowing clipping parameters to be set per imagery state does indeed sound reasonable. As you say, and afaik, you probably need to extend the falagard system to achieve this. I would be interested to hear CE's take on this.

Yes i think you did understand me. Here is an example image of my button in normal state embedded in some unicolored background:



the outer frame is the outer area which makes the button appear sunken in the background. The inner frame is the area which makes the button appear to be risen from its "button sink".
The background and foreground images will sit under the inner frame (eventually rendered content) and gets shifted right and down, so that they could appear partialy below the outer frame with my current falagard button widget.

I have already made the needed change to the falagard system, inventing an xml attribute "clippingArea" for the section tag in state imagery layers. This can be set to a Named Area, which will be used as clipper for this section. The changes i made are quite straight foreward i think and it works fine for me. And it shouldn't break anything. I tested the code for use in my GUI. However, i didn't run some extensive tests to ensure that it works under all possible conditions but i'm quite sure that it won't make any problems.

If you are interested i could supply a patch.

greetings,
Grimmigbeisser