Image stretch over button?

[Rayoom]

I've got a button, and an image. The button is about 2x the size of the image, but if I try to make the button smaller, the image shrinks. So I tried to make the image stretch over the entire button, but I can't get it to work.

Here is how I setup the xml:

Code: Select all

         <Window Type="TaharezLook/Button" Name="SelectArenaButton4">
            <Property Name="Size" Value="w:0.24 h:0.23" />
            <Property Name="RelativePosition" Value="x:0.7975 y:0.12" />
            <Property Name="NormalImage" Value="set:SelectArenaButton4ImageSet image:SelectArenaButton4Img" />
            <Property Name="PushedImage" Value="set:SelectArenaButton4ImageSet image:SelectArenaButton4Img" />
            <Property Name="DisabledImage" Value="set:SelectArenaButton4ImageSet image:SelectArenaButton4Img" />
            <Property Name="UseStandardImagery" Value="false" />
            <Property Name="Alpha" Value="1.0" />
            <Property Name="Visible" Value="true" />
            <Property Name="HorzFormatting" Value="HorzStretched" />
            </Window>


And I tried to enlarge the RenderableImage so that the HorzFormatting::HorzStretched would have an effect. I did that like this:

Code: Select all

   CEGUI::Imageset *pSelectArenaImages;
   pSelectArenaImages = m_ImagesetManager->getImageset("SelectArenaButton4ImageSet");

   CEGUI::RenderableImage buttonImg;
   buttonImg.setHorzFormatting(CEGUI::RenderableImage::HorzFormatting::HorzStretched);
   buttonImg.setVertFormatting(CEGUI::RenderableImage::VertFormatting::VertStretched);

   CEGUI::PushButton *pArenaButton = static_cast<CEGUI::PushButton *>(GuiGetWindow("SelectArenaButton4"));
   const CEGUI::RenderableImage *img = pArenaButton->getNormalImage();
   float width = img->getSize().d_width;
   float height = img->getSize().d_height;
   buttonImg.setImage(&pSelectArenaImages->getImage("SelectArenaButton4Img"));
   buttonImg.setSize(CEGUI::Size(width*2,height));

   pArenaButton->setNormalImage(&buttonImg);


The original width is 246, so I set it to width*2 hoping it would stretch the image out across the entire RenderableImage but it didn't do anything, and the button (the area you can hover and click on) is still 2x the image's length.

Here is a pic to show what I mean
[img align=left]http://www.rayoom.com/button_image.jpg[/img]

Is there any way I can get this Image to stretch out across the button?

[CrazyEddie]

Hi,

There are no xml based formatting properties that affect the custom images set for a button - while it may seem like an obvious thing to have, those properties were added at a later stage to appease certain people, and to be honest now I'd rather remove them completely

Anyway, you can do it in code, and basically you need to remove the size setting code you have and use the PushButton::setCustomImageryAutoSized setting; the following should work:

Code: Select all

CEGUI::Imageset *pSelectArenaImages;
pSelectArenaImages = m_ImagesetManager->getImageset("SelectArenaButton4ImageSet");

// setup image
CEGUI::RenderableImage buttonImg;
buttonImg.setHorzFormatting(CEGUI::RenderableImage::HorzFormatting::HorzStretched);
buttonImg.setVertFormatting(CEGUI::RenderableImage::VertFormatting::VertStretched);
buttonImg.setImage(&pSelectArenaImages->getImage("SelectArenaButton4Img"));

// set image to PushButton with required options
CEGUI::PushButton *pArenaButton = static_cast<CEGUI::PushButton *>(GuiGetWindow("SelectArenaButton4"));
pArenaButton->setCustomImageryAutoSized(true);
pArenaButton->setNormalImage(&buttonImg);

[Rayoom]

Hey Eddie, thanks for the reply, but that function doesn't do anything .

In the docs is says this about setAutoSize

Set whether to auto re-size custom image areas when the button is sized.

"When the button is sized."

By the time I call this function hasn't the image already been sized? Do I need to resize the image to get it to work?

[CrazyEddie]

The auto size should resize the image when the setting is made (it also turns out that stretchng is the default setting anyway, so that's even stranger.

Which version of the code is this? If it's 0.3.0 then I'll have to test and get back to you - as it definitely should work as described. If you're using a version from CVS (either head or v0-4) then it's probably something I broke

[Rayoom]

In the ChangeLog file it says it is version 0.4.0.

If I could get this to work it would make my life much easier. I'm trying to hack around the problem right now and I'm running into more problems at every turn.

Right now the MouseEnters event is only being fired when the mouse is over the left half of *some* of my windows. I'm so confused.

[CrazyEddie]

Rayoom wrote:
In the ChangeLog file it says it is version 0.4.0.

Ok, then you must have got this from CVS? Else you downloaded a nightly snapshot which will be out of date since sf.net disabled cron for projects - meaning the snapshot is not updated very often anymore (I should probably remove it)

Rayoom wrote:If I could get this to work it would make my life much easier. I'm trying to hack around the problem right now and I'm running into more problems at every turn.

I understand. Nothing is more frustrating than things not working as they should. I'll test the image stretching for buttons this morning and get back to you.

Rayoom wrote:
Right now the MouseEnters event is only being fired when the mouse is over the left half of *some* of my windows. I'm so confused.

This sounds like the button is partially covered by some other , possibly invisible window (like a DefaultWindow maybe). Check the way your are composing your layouts.

[CrazyEddie]

CrazyEddie wrote:
I'll test the image stretching for buttons this morning and get back to you.

I have successfully tested image stretching on Buttons (tested on TaharezLook and the FalagardBase).

The following is the code I used:

Code: Select all

    RenderableImage img;
    img.setImage(&ImagesetManager::getSingleton().getImageset("TaharezLook")->getImage("MouseArrow"));
    img.setHorzFormatting(RenderableImage::HorzStretched);
    img.setVertFormatting(RenderableImage::VertStretched);
    btn->setNormalImage(&img);

The only real difference is that I do not have the formatting enum name specified explicitly in the lines where the formatting is set; I should have spotted that before - it should not even compile as you have it now

[Rayoom]

I've got it working now. Thanks for all the help CE, much appreciated .

[Rayoom]

This is very strange...

The image will stretch fine horizontally IF the image's width is greater than its height.

For example, I have an image that is 128x128, and it does not stretch across the button. If I change that image to 129x128, it stretches just as I would expect...I've tried a few...

140x128 works
129x128 works
128x128 doesn't work
127x128 doesn't work

To show you what I mean...

This image is 128x128 pixels


This image is 129x128 pixles

[CrazyEddie]

That is very strage - I'll do some more checking and let you know what I find.

[CrazyEddie]

I tested this via the old TaharezLook dll module, and could not replicate this behaviour - I tried multiple different image sizes, but it always worked as expected.

Is the image in a file on it's own, or part of a larger texture?

[Rayoom]

It's in a file all its own.

[CrazyEddie]

You need to ensure that the dimensions of the file are powers of 2; otherwise stange behaviour may result. This might be what you're seeing.