displaying an image in a tooltip?

For help with anything that CEGUI doesn't offer straight out-of-the-box, e.g.:
- Implementation of new features, such as new Core classes, widgets, WindowRenderers, etc. ...
- Modification of any existing features for specific purposes
- Integration of CEGUI in new engines or frameworks and writing of new plugins (Renderer, Parser, ...) or modules

Moderators: CEGUI MVP, CEGUI Team

Tiresias
Quite a regular
Quite a regular
Posts: 74
Joined: Thu May 22, 2008 10:20

displaying an image in a tooltip?

Postby Tiresias » Sun Feb 15, 2009 17:29

Hi

we are mirating our mcf client to a cegui client,
so far its going well, however we would need to implement a mechanism to embedd a picture (png or jpg) inside a tooltip along with its text.

What would be the best approach ?

thanks

User avatar
scriptkid
Home away from home
Home away from home
Posts: 1178
Joined: Wed Jan 12, 2005 12:06
Location: The Hague, The Netherlands
Contact:

Postby scriptkid » Mon Feb 16, 2009 09:09

Hi,

A solution might be to add an icon to the existing Tooltip definition (.looknfeel). Before the current ImagerySection="label", which you can see in the Windowslook/Tooltip, you might add a new section for the icon. If you also divide the available space for a little, you might come up with something like this: 25% for the icon, 75% for the text.

Code: Select all

<!-- Icon in front of the label, take 25 of the space -->
<ImagerySection name="icon">
  <ImageryComponent>
    <Area>
      <Dim type="LeftEdge" ><AbsoluteDim value="0" /></Dim>
      <Dim type="TopEdge" ><AbsoluteDim value="0" /></Dim>
      <Dim type="Width" ><UnifiedDim scale="0.25" type="Width"/></Dim>
      <Dim type="Height" ><UnifiedDim scale="0.25" type="Height"></Dim>
    </Area>
    <ImageProperty name="IconImage" />
    <VertFormatProperty name="VertImageFormatting" />
    <HorzFormatProperty name="HorzImageFormatting" />
  </ImageryComponent>
</ImagerySection>
<!-- Existing label, but only take 75 of the space -->
<ImagerySection name="label">
  <TextComponent>
    <Area>
      <Dim type="LeftEdge"><AbsoluteDim value="0.25" /> </Dim>
        <Dim type="TopEdge"><AbsoluteDim value="0.25" /></Dim>
        <Dim type="RightEdge"><UnifiedDim scale="1" type="RightEdge"/></Dim>
        <Dim type="BottomEdge"><UnifiedDim scale="1" type="BottomEdge" /></Dim>
    </Area>
    <Colours topLeft="FF000000" topRight="FF000000" bottomLeft="FF000000" bottomRight="FF000000" />
    <VertFormat type="CentreAligned" />
    <HorzFormat type="CentreAligned" />
  </TextComponent>
</ImagerySection>

<!-- Also add the icon to its usage -->
       <StateImagery name="Enabled">
            <Layer>
                <Section section="main" />
                <Section section="icon" />
                <Section section="label" />
            </Layer>
        </StateImagery>
        <StateImagery name="Disabled">
            <Layer>
                <Section section="main" />
                <Section section="icon" />
                <Section section="label" />
            </Layer>
        </StateImagery>
    </WidgetLook>


Also, don't forget to define a property for your icon:

Code: Select all

<PropertyDefinition name="IconImage" initialValue="" redrawOnWrite="true" />


What i also just thought of -after writing this ;) - is that you can also look at the Checkbox definitions, which sort of do the same...

HTH.
Check out my released snake game using Cegui!

Tiresias
Quite a regular
Quite a regular
Posts: 74
Joined: Thu May 22, 2008 10:20

Postby Tiresias » Mon Feb 16, 2009 12:21

Ok thanks a lot,

when you say "icon", it doesnt matter if at the end we insert a png/jpg/bmp file ?

User avatar
scriptkid
Home away from home
Home away from home
Posts: 1178
Joined: Wed Jan 12, 2005 12:06
Location: The Hague, The Netherlands
Contact:

Postby scriptkid » Mon Feb 16, 2009 16:05

when you say "icon", it doesnt matter if at the end we insert a png/jpg/bmp file?


Well, that depends on the ImageCodec you are/will be using. Since Cegui does not use files directly, but always through an ImageSet. That is why, in code or XML, you will always see a reference to an image in the format "set:SetName image:ImageName".

HTH.
Check out my released snake game using Cegui!


Return to “Modifications / Integrations / Customisations”

Who is online

Users browsing this forum: No registered users and 8 guests