Okay, I used Generic/ImageButton as a template and created my own Generic/ImageToggleButton and Generic/ImageRadioButton widgets. Internally these map to ToggleButton and RadioButton objects, and both use the renderer for ToggleButton widgets.
An open issue is the disabled and hover state when a button is currently toggled on. The button will always show the PushedImage at this time. We'd need separate images for PushedHover and PushedDisabled here. I'll leave that as an excercise for the reader.
add this to Generic.scheme
Code: Select all
<FalagardMapping windowType="Generic/ImageToggleButton" targetType="CEGUI/ToggleButton" renderer="Core/ToggleButton" lookNFeel="Generic/ImageToggleButton" />
<FalagardMapping windowType="Generic/ImageRadioButton" targetType="CEGUI/RadioButton" renderer="Core/ToggleButton" lookNFeel="Generic/ImageRadioButton" />
and this to Generic.looknfeel
Code: Select all
<!--
- Normal - Rendering for when the togglebutton is neither pushed or has the mouse hovering over it.
- Hover - Rendering for then the togglebutton has the mouse hovering over it.
- Pushed - Rendering for when the togglebutton is not selected, is pushed and has the mouse over it.
- PushedOff - Rendering for when the togglebutton is not selected, is pushed and the mouse is not over it.
- Disabled - Rendering for when the togglebutton is not selected and is disabled.
- SelectedNormal - Rendering for when the togglebutton is selected and is neither pushed or has the mouse hovering over it.
- SelectedHover - Rendering for then the togglebutton is selected and has the mouse hovering over it.
- SelectedPushed - Rendering for when the togglebutton is selected, is pushed and has the mouse over it.
- SelectedPushedOff - Rendering for when the togglebutton is selected, is pushed and the mouse is not over it.
- SelectedDisabled - Rendering for when the togglebutton is selected and is disabled.
-->
<WidgetLook name="Generic/ImageToggleButton">
<PropertyDefinition redrawOnWrite="true" initialValue="" type="Image" name="NormalImage"/>
<PropertyDefinition redrawOnWrite="true" initialValue="" type="Image" name="HoverImage"/>
<PropertyDefinition redrawOnWrite="true" initialValue="" type="Image" name="PushedImage"/>
<PropertyDefinition redrawOnWrite="true" initialValue="" type="Image" name="DisabledImage"/>
<PropertyDefinition redrawOnWrite="true" initialValue="Stretched" type="VerticalFormatting" name="VertImageFormatting"/>
<PropertyDefinition redrawOnWrite="true" initialValue="Stretched" type="HorizontalFormatting" name="HorzImageFormatting"/>
<Property name="Size" value="{{0, 96}, {0, 32}}" />
<ImagerySection name="normal">
<ImageryComponent>
<ImageProperty name="NormalImage"/>
<VertFormatProperty name="VertImageFormatting"/>
<HorzFormatProperty name="HorzImageFormatting"/>
</ImageryComponent>
</ImagerySection>
<ImagerySection name="hover">
<ImageryComponent>
<ImageProperty name="HoverImage"/>
<VertFormatProperty name="VertImageFormatting"/>
<HorzFormatProperty name="HorzImageFormatting"/>
</ImageryComponent>
</ImagerySection>
<ImagerySection name="pushed">
<ImageryComponent>
<ImageProperty name="PushedImage"/>
<VertFormatProperty name="VertImageFormatting"/>
<HorzFormatProperty name="HorzImageFormatting"/>
</ImageryComponent>
</ImagerySection>
<ImagerySection name="disabled">
<ImageryComponent>
<ImageProperty name="DisabledImage"/>
<VertFormatProperty name="VertImageFormatting"/>
<HorzFormatProperty name="HorzImageFormatting"/>
</ImageryComponent>
</ImagerySection>
<StateImagery name="Normal">
<Layer>
<Section section="normal"/>
</Layer>
</StateImagery>
<StateImagery name="Hover">
<Layer>
<Section section="hover"/>
</Layer>
</StateImagery>
<StateImagery name="Pushed">
<Layer>
<Section section="pushed"/>
</Layer>
</StateImagery>
<StateImagery name="PushedOff">
<Layer>
<Section section="hover"/>
</Layer>
</StateImagery>
<StateImagery name="Disabled">
<Layer>
<Section section="disabled"/>
</Layer>
</StateImagery>
<StateImagery name="SelectedNormal">
<Layer>
<Section section="pushed"/>
</Layer>
</StateImagery>
<StateImagery name="SelectedHover">
<Layer>
<Section section="pushed"/>
</Layer>
</StateImagery>
<StateImagery name="SelectedPushed">
<Layer>
<Section section="pushed"/>
</Layer>
</StateImagery>
<StateImagery name="SelectedPushedOff">
<Layer>
<Section section="pushed"/>
</Layer>
</StateImagery>
<StateImagery name="SelectedDisabled">
<Layer>
<Section section="pushed"/>
</Layer>
</StateImagery>
</WidgetLook>
<!--
- Normal - Rendering for when the togglebutton is neither pushed or has the mouse hovering over it.
- Hover - Rendering for then the togglebutton has the mouse hovering over it.
- Pushed - Rendering for when the togglebutton is not selected, is pushed and has the mouse over it.
- PushedOff - Rendering for when the togglebutton is not selected, is pushed and the mouse is not over it.
- Disabled - Rendering for when the togglebutton is not selected and is disabled.
- SelectedNormal - Rendering for when the togglebutton is selected and is neither pushed or has the mouse hovering over it.
- SelectedHover - Rendering for then the togglebutton is selected and has the mouse hovering over it.
- SelectedPushed - Rendering for when the togglebutton is selected, is pushed and has the mouse over it.
- SelectedPushedOff - Rendering for when the togglebutton is selected, is pushed and the mouse is not over it.
- SelectedDisabled - Rendering for when the togglebutton is selected and is disabled.
-->
<WidgetLook name="Generic/ImageRadioButton">
<PropertyDefinition redrawOnWrite="true" initialValue="" type="Image" name="NormalImage"/>
<PropertyDefinition redrawOnWrite="true" initialValue="" type="Image" name="HoverImage"/>
<PropertyDefinition redrawOnWrite="true" initialValue="" type="Image" name="PushedImage"/>
<PropertyDefinition redrawOnWrite="true" initialValue="" type="Image" name="DisabledImage"/>
<PropertyDefinition redrawOnWrite="true" initialValue="Stretched" type="VerticalFormatting" name="VertImageFormatting"/>
<PropertyDefinition redrawOnWrite="true" initialValue="Stretched" type="HorizontalFormatting" name="HorzImageFormatting"/>
<Property name="Size" value="{{0, 96}, {0, 32}}" />
<ImagerySection name="normal">
<ImageryComponent>
<ImageProperty name="NormalImage"/>
<VertFormatProperty name="VertImageFormatting"/>
<HorzFormatProperty name="HorzImageFormatting"/>
</ImageryComponent>
</ImagerySection>
<ImagerySection name="hover">
<ImageryComponent>
<ImageProperty name="HoverImage"/>
<VertFormatProperty name="VertImageFormatting"/>
<HorzFormatProperty name="HorzImageFormatting"/>
</ImageryComponent>
</ImagerySection>
<ImagerySection name="pushed">
<ImageryComponent>
<ImageProperty name="PushedImage"/>
<VertFormatProperty name="VertImageFormatting"/>
<HorzFormatProperty name="HorzImageFormatting"/>
</ImageryComponent>
</ImagerySection>
<ImagerySection name="disabled">
<ImageryComponent>
<ImageProperty name="DisabledImage"/>
<VertFormatProperty name="VertImageFormatting"/>
<HorzFormatProperty name="HorzImageFormatting"/>
</ImageryComponent>
</ImagerySection>
<StateImagery name="Normal">
<Layer>
<Section section="normal"/>
</Layer>
</StateImagery>
<StateImagery name="Hover">
<Layer>
<Section section="hover"/>
</Layer>
</StateImagery>
<StateImagery name="Pushed">
<Layer>
<Section section="pushed"/>
</Layer>
</StateImagery>
<StateImagery name="PushedOff">
<Layer>
<Section section="hover"/>
</Layer>
</StateImagery>
<StateImagery name="Disabled">
<Layer>
<Section section="disabled"/>
</Layer>
</StateImagery>
<StateImagery name="SelectedNormal">
<Layer>
<Section section="pushed"/>
</Layer>
</StateImagery>
<StateImagery name="SelectedHover">
<Layer>
<Section section="pushed"/>
</Layer>
</StateImagery>
<StateImagery name="SelectedPushed">
<Layer>
<Section section="pushed"/>
</Layer>
</StateImagery>
<StateImagery name="SelectedPushedOff">
<Layer>
<Section section="pushed"/>
</Layer>
</StateImagery>
<StateImagery name="SelectedDisabled">
<Layer>
<Section section="pushed"/>
</Layer>
</StateImagery>
</WidgetLook>
