CEGUI (Crazy Eddie's GUI) Forums

The official forum for CEGUI
http://cegui.org.uk/forum/

Image in combobox?

http://cegui.org.uk/forum/viewtopic.php?f=10&t=7099

Page 1 of 2

Image in combobox?

Posted: Thu Sep 17, 2015 07:43
by gams
Hi
I have just a quick question, I didn't find this answered in the forums. so.. can you have image for each item in combobox? not just text per item but image and text would be good. can this be done?

thanks

Re: Image in combobox?

Posted: Thu Oct 15, 2015 10:38
by allanconner143
I think nobody have yet :(

Re: Image in combobox?

Posted: Sat Oct 17, 2015 12:36
by gams
The ListboxTextItem and ListboxItem class does not seem to have any way for adding image.

Re: Image in combobox?

Posted: Sun Oct 18, 2015 13:04
by Ident
That might indeed be the case. The easiest modification would be for all lists to accept widgets, than you can add child widgets that may contain whatever you want (Image, Text, etc.). I see this as a mandatory feature for 1.0 Release.

I have not tried it out but you may want to try using Formatting Tags: http://cegui.org.uk/wiki/Formatting_Tags_in_CEGUI
Maybe that works, but it depends on the type of the widget these Items are, and I don't remember that right now.

Re: Image in combobox?

Posted: Thu Oct 22, 2015 16:47
by gams
thanks Ident the formatting tags do work on the listboxitems and I am able to display image. :D

Re: Image in combobox?

Posted: Thu Oct 22, 2015 17:07
by gams
Another thing I'm having dificulty to get working is the combobox text. Here's screenshot of what I mean.

Image

looks like parsing is not enabled or something for the combox text. I looked around and it should be enabled so maybe it's not supported in that field.

Re: Image in combobox?

Posted: Sat Oct 31, 2015 09:32
by Ident
The combobox uses an editbox for that field, as it also allows it to be edited (if not read-only). An editbox can't have formattingtags as of now, adding this has been discussed elsewhere but is not planned currently.

What about a dropdownlist?

Re: Image in combobox?

Posted: Wed Nov 04, 2015 13:16
by gams
For some reason I cannot make ComboDropList render anything.

here's code I borrowed from the samples:

Code: Select all


class MyListItem : public ListboxTextItem
{
public:
   MyListItem(const String& text, CEGUI::uint item_id = 0) :
      ListboxTextItem(text, item_id)
   {
      setSelectionBrushImage("colorDisp"); // colorDisp image is loaded elsewhere
   }
};

void initListbox(CEGUI::Listbox* listbox)
{
   MyListItem* item1 = new MyListItem("Listbox Item 1");
   listbox->addItem(item1);
   MyListItem* item2 = new MyListItem("Listbox Item 2");
   listbox->addItem(item2);

   MyListItem* item3 = new MyListItem("Listbox Item 3");
   item3->setSelectionColours(CEGUI::Colour(0.3f, 0.7f, 1.0f, 1.0f));
   listbox->addItem(item3);

   MyListItem* item4 = new MyListItem("Listbox Item 4");
   item4->setSelectionColours(CEGUI::Colour(0.3f, 1.0f, 0.7f, 1.0f));
   listbox->addItem(item4);

   if (listbox->getType().compare("WindowsLook/Listbox") == 0)
   {
      item1->setTextColours(CEGUI::Colour(0.0f, 0.0f, 0.0f, 1.0f));
      item2->setTextColours(CEGUI::Colour(0.0f, 0.0f, 0.0f, 1.0f));
      item3->setTextColours(CEGUI::Colour(0.0f, 0.0f, 0.0f, 1.0f));
      item4->setTextColours(CEGUI::Colour(0.0f, 0.0f, 0.0f, 1.0f));
   }
}


   ComboDropList &testList = getWin<ComboDropList>("TestList"); // custom window retriever, throws when no window is found or is not specified type
   
   initListbox(&testList);
   

Re: Image in combobox?

Posted: Wed Nov 04, 2015 22:01
by Ident
is there an LookNFeel for it? If yes, which one do you use?

Re: Image in combobox?

Posted: Thu Nov 05, 2015 08:51
by gams
Ident wrote:is there an LookNFeel for it? If yes, which one do you use?


I'm using the looknfeel file that came with CEGUI. so yes it has it. I'll copy & paste the looknfeel definitin here:

Code: Select all


    <!--
    ***************************************************
        TaharezLook/ComboDropList
    ***************************************************
    -->
    <WidgetLook name="TaharezLook/ComboDropList">
        <Property name="Size" value="{{0, 256}, {0, 256}}" />
        <NamedArea name="ItemRenderingArea">
            <Area>
                <Dim type="LeftEdge" ><ImageDim name="TaharezLook/ComboboxListLeft" dimension="Width" /></Dim>
                <Dim type="TopEdge" ><ImageDim name="TaharezLook/ComboboxListTop" dimension="Height" /></Dim>
                <Dim type="RightEdge" >
                    <OperatorDim op="Subtract">
                        <UnifiedDim scale="1" type="RightEdge" />
                        <ImageDim name="TaharezLook/ComboboxListRight" dimension="Width" />
                    </OperatorDim>
                </Dim>
                <Dim type="BottomEdge" >
                    <OperatorDim op="Subtract">
                        <UnifiedDim scale="1" type="BottomEdge" />
                        <ImageDim name="TaharezLook/ComboboxListBottom" dimension="Height" />
                    </OperatorDim>
                </Dim>
            </Area>
        </NamedArea>
        <NamedArea name="ItemRenderingAreaHScroll">
            <Area>
                <Dim type="LeftEdge" ><ImageDim name="TaharezLook/ComboboxListLeft" dimension="Width" /></Dim>
                <Dim type="TopEdge" ><ImageDim name="TaharezLook/ComboboxListTop" dimension="Height" /></Dim>
                <Dim type="RightEdge" >
                    <OperatorDim op="Subtract">
                        <UnifiedDim scale="1" type="RightEdge" />
                        <ImageDim name="TaharezLook/ComboboxListRight" dimension="Width" />
                    </OperatorDim>
                </Dim>
                <Dim type="BottomEdge" >
                    <OperatorDim op="Subtract">
                        <UnifiedDim scale="1" type="BottomEdge" />
                        <WidgetDim widget="__auto_hscrollbar__" dimension="Height" />
                    </OperatorDim>
                </Dim>
            </Area>
        </NamedArea>
        <NamedArea name="ItemRenderingAreaVScroll">
            <Area>
                <Dim type="LeftEdge" ><ImageDim name="TaharezLook/ComboboxListLeft" dimension="Width" /></Dim>
                <Dim type="TopEdge" ><ImageDim name="TaharezLook/ComboboxListTop" dimension="Height" /></Dim>
                <Dim type="RightEdge" >
                    <OperatorDim op="Subtract">
                        <UnifiedDim scale="1" type="RightEdge" />
                        <WidgetDim widget="__auto_vscrollbar__" dimension="Width" />
                    </OperatorDim>
                </Dim>
                <Dim type="BottomEdge" >
                    <OperatorDim op="Subtract">
                        <UnifiedDim scale="1" type="BottomEdge" />
                        <ImageDim name="TaharezLook/ComboboxListBottom" dimension="Height" />
                    </OperatorDim>
                </Dim>
            </Area>
        </NamedArea>
        <NamedArea name="ItemRenderingAreaHVScroll">
            <Area>
                <Dim type="LeftEdge" ><ImageDim name="TaharezLook/ComboboxListLeft" dimension="Width" /></Dim>
                <Dim type="TopEdge" ><ImageDim name="TaharezLook/ComboboxListTop" dimension="Height" /></Dim>
                <Dim type="RightEdge" >
                    <OperatorDim op="Subtract">
                        <UnifiedDim scale="1" type="RightEdge" />
                        <WidgetDim widget="__auto_vscrollbar__" dimension="Width" />
                    </OperatorDim>
                </Dim>
                <Dim type="BottomEdge" >
                    <OperatorDim op="Subtract">
                        <UnifiedDim scale="1" type="BottomEdge" />
                        <WidgetDim widget="__auto_hscrollbar__" dimension="Height" />
                    </OperatorDim>
                </Dim>
            </Area>
        </NamedArea>
        <Child  type="TaharezLook/HorizontalScrollbar" nameSuffix="__auto_hscrollbar__">
            <Area>
                <Dim type="Width" ><UnifiedDim scale="1" offset="-12" type="Width" /></Dim>
                <Dim type="Height" ><AbsoluteDim value="12" /></Dim>
            </Area>
            <VertAlignment type="BottomAligned" />
        </Child>
        <Child  type="TaharezLook/VerticalScrollbar" nameSuffix="__auto_vscrollbar__">
            <Area>
                <Dim type="Width" ><AbsoluteDim value="12" /></Dim>
                <Dim type="Height" ><UnifiedDim scale="1" offset="-12" type="Height" /></Dim>
            </Area>
            <HorzAlignment type="RightAligned" />
        </Child>
        <ImagerySection name="main">
            <FrameComponent>
                <Image component="TopLeftCorner" name="TaharezLook/ComboboxListTopLeft" />
                <Image component="TopRightCorner" name="TaharezLook/ComboboxListTopRight" />
                <Image component="BottomLeftCorner" name="TaharezLook/ComboboxListBottomLeft" />
                <Image component="BottomRightCorner" name="TaharezLook/ComboboxListBottomRight" />
                <Image component="LeftEdge" name="TaharezLook/ComboboxListLeft" />
                <Image component="RightEdge" name="TaharezLook/ComboboxListRight" />
                <Image component="TopEdge" name="TaharezLook/ComboboxListTop" />
                <Image component="BottomEdge" name="TaharezLook/ComboboxListBottom" />
                <Image component="Background" name="TaharezLook/ComboboxListBackdrop" />
            </FrameComponent>
        </ImagerySection>
        <StateImagery name="Enabled">
            <Layer>
                <Section section="main" />
            </Layer>
        </StateImagery>
        <StateImagery name="Disabled">
            <Layer>
                <Section section="main">
                    <Colours topLeft="FF7F7F7F" topRight="FF7F7F7F" bottomLeft="FF7F7F7F" bottomRight="FF7F7F7F" />
                </Section>
            </Layer>
        </StateImagery>
    </WidgetLook>


Re: Image in combobox?

Posted: Thu Nov 05, 2015 18:28
by Ident
And this LookNFeel is not rendered at all? You cant see the entire widget?

Re: Image in combobox?

Posted: Fri Nov 06, 2015 11:17
by gams
Ident wrote:And this LookNFeel is not rendered at all? You cant see the entire widget?


yes there is absolutely nothing visible of the control.

Re: Image in combobox?

Posted: Fri Nov 06, 2015 12:05
by gams
Ok I found the problem why ComboDropList is not showing. The visible attrbute was false by default. So I set it true in the CEGUI editor and still nothing. then I call setVisible and set it true and it finally shows up.
I wonder why its hidden by default and cant be made visible except by c++ call?

I took a screenshot of the thing and it seems I better stick with combobox as it has header text (the editbox) and droplist has no header (or is invisible?)

Image

Re: Image in combobox?

Posted: Fri Nov 06, 2015 13:14
by dermont
Could you not just subclass a ListboxTextItem and just draw the icon/texture yourself? , e.g from python:

Code: Select all

class GSTListboxItem(CEGUI.ListboxTextItem):
    def __init__(self,text, id, texture,videoSizeThumb):
        CEGUI.ListboxTextItem.__init__(self,text)
        self.text = text
        self.d_thumbsize = videoSizeThumb
        self.d_texture = texture
        #self.setSelectionBrushImage("TaharezLook/TextSelectionBrush")
        self.setSelectionBrushImage("WindowsLook/Background")
        self.setTextColours(CEGUI.Colour(0.0, 0.0, 0.0, 1.0))
        self.getSelectionBrushImage().setAutoScaled(CEGUI.ASM_Disabled)
        self.icon_border = 2.0


    def getPixelSize(self):
        pixSize = CEGUI.ListboxTextItem.getPixelSize(self)
        w = max(self.d_thumbsize.d_width, pixSize.d_width)
        h = max(self.d_thumbsize.d_height, pixSize.d_height)
        return CEGUI.Sizef(float(w), float(h))

    def drawImage(self, buffer, targetRect, alpha, clipper):
        finalPos = CEGUI.Rectf(targetRect)
        finalPos.setWidth(targetRect.getWidth())
        finalPos.setHeight(targetRect.getHeight())
        self.d_texture.render(buffer, finalPos, clipper,
                              CEGUI.ColourRect(CEGUI.Colour(1.0,1.0,1.0,alpha)))

    def draw(self, buffer, targetRect, alpha, clipper):
        ## draw icon/video
        x = targetRect.left() + self.icon_border
        y = targetRect.top()  + self.icon_border
        w = targetRect.left() + self.d_thumbsize.d_width -2*self.icon_border
        h = targetRect.top()  + self.d_thumbsize.d_height -2*self.icon_border

        rect = CEGUI.Rectf(x,y,w,h)
        self.drawImage(buffer, rect, alpha, clipper)
        ## draw text
        rect = CEGUI.Rectf(targetRect.left() + self.d_thumbsize.d_width , targetRect.top() , targetRect.right(),  targetRect.bottom())
        CEGUI.ListboxTextItem.draw(self, buffer, rect, alpha, clipper)
        ## draw select
        if self.isSelected(): # and not self.d_selectBrush is None:
            self.getSelectionBrushImage().render(buffer, targetRect, clipper,CEGUI.ColourRect(CEGUI.Colour(0.5,0.5,0.5,0.1)))


Code: Select all

        CEGUI.ImageManager.getSingleton().addFromImageFile("SpaceBackgroundImage", "SpaceBackground.jpg")
        CEGUI.ImageManager.getSingleton().loadImageset("DriveIcons.imageset")
        icons=[]
        icons.append(CEGUI.ImageManager.getSingleton().get("DriveIcons/Artic") )
        icons.append(CEGUI.ImageManager.getSingleton().get("DriveIcons/Black") )
        icons.append(CEGUI.ImageManager.getSingleton().get("DriveIcons/Sunset") )
        icons.append(CEGUI.ImageManager.getSingleton().get("DriveIcons/GlobalDrive") )
        icons.append(CEGUI.ImageManager.getSingleton().get("DriveIcons/Blue") )
        icons.append(CEGUI.ImageManager.getSingleton().get("DriveIcons/Silver") )
        icons.append(CEGUI.ImageManager.getSingleton().get("DriveIcons/GreenCandy") )

        mComboBox = CEGUI.WindowManager.getSingleton().createWindow("WindowsLook/Combobox", "MyComboBox")
        mComboBox.setSize(CEGUI.USize(CEGUI.UDim(float(0.3), 0) , CEGUI.UDim(float(0.6), 0)))
        mComboBox.setPosition(CEGUI.UVector2(CEGUI.UDim(0.64, 0.0), CEGUI.UDim(0.02, 0.0)))
        mCEGUIMainWindow.addChild(mComboBox)


        thumbSize = CEGUI.Sizef(64.0,64.0)
        for j in range(10):
            text = "Test\nTest Line 2%s" % ( str(j) )
            lbi = GSTListboxItem(text, j, icons[j%len(icons)], thumbSize)
            mComboBox.addItem(lbi)
            self.ListItems.append(lbi)

Re: Image in combobox?

Posted: Fri Nov 06, 2015 18:44
by Ident
This was probably never intended to be used as its own widget but only as part of other widgets such as combobox. It would be really easy to make your own widgets uding the combodroplist as a child just like combobox does and then displaying the item however you want in the widget itself (not the child widget which is the combodroplist)
Does that make sense?
You would probably have to set up a new but simple class in C++ for this purpose, we could assist you in doing so, we would also like to have this as part of a PR to make it part of core CEGUI if you are willing to do this. I think this would make a valuable contribution.
All times are UTC
Page 1 of 2
Powered by phpBB® Forum Software © phpBB Limited
https://www.phpbb.com/