Slick Forums

Discuss the Slick 2D Library
It is currently Mon May 20, 2013 5:28 pm

All times are UTC




Post new topic Reply to topic  [ 9 posts ] 
Author Message
PostPosted: Sat Jun 16, 2012 4:05 pm 
Offline
Oldbie

Joined: Thu Mar 15, 2012 12:38 am
Posts: 260
Hello!

I'm really going at it with TWL and it is a lot of fun.

I have yet another question for you all.

I want to be able to display some different types of items in Comboboxes and I've hit a little snag in doing it. I looked at the TWL Demo and in there, they do have some Comboboxes but they only display Strings.

I would like to be able to display some images as Combobox items. For example, I want to make a list of images that represent the flag of the player's Empire. So the player can select which flag they want from the Combobox.

So I was thinking I could get a list of the Images and then pass it to a model for the Combobox. Then I realized that these images would probably have to be defined in the theme file? But these images are...not really UI/theme based and are more like game data. So then I thought to myself, "Ok I need to get a list of TWL images" and that is where I hit a brick wall. There are interfaces for Image and DynamicImage, but I don't really see any concrete implementations of an Image class. I'm sure there are and I just missed it.

I'm also sure I am looking too deep into this and the solution is quite simple. :oops:

Thanks for your help.


Top
 Profile  
 
PostPosted: Sat Jun 16, 2012 6:52 pm 
Offline
Slick Zombie

Joined: Fri Jan 29, 2010 7:02 pm
Posts: 1171
ComboBox uses a ListBox internally which has a createDisplay() method, but you can't change/subclass that ListBox :(

So you have to use ComboBoxBase or TreeComboBox. With TreeComboBox you can register custom CellRenderer based on the data type in a cell which should make it easy to render images - see the TWL Theme Editor IconCellRenderer for details.
Code:
TreeComboBox  tcb = new TreeComboBox ();
tcb.getTreeTable().registerCellRenderer(DecoratedTextWithIcon.class, new IconCellRenderer());

In order to use DynamicImage you need to create it via the Renderer interface. Or you can do the rendering of the image yourself via OpenGL as long as you return the GL state to what TWL expects (see the LWJGLRenderer class to see the GL state TWL uses).

_________________
TWL - The Themable Widget Library


Top
 Profile  
 
PostPosted: Sat Jun 16, 2012 8:32 pm 
Offline
Oldbie

Joined: Thu Mar 15, 2012 12:38 am
Posts: 260
Hi,

Thanks for replying!

I'll try this out and see what I can do.


Top
 Profile  
 
PostPosted: Sat Jun 16, 2012 9:45 pm 
Offline
Oldbie

Joined: Thu Mar 15, 2012 12:38 am
Posts: 260
Ok, I haven't been able to get this to work.

This is what I have done:

1. Defined the following in the simple.xml theme:
Code:
  <theme name="iconcellrenderer" ref="-defaults" allowWildcard="true">
           <param name="icons"><map>
            <param name="testImg"><image>-iconC</image></param>
        </map></param>
    </theme>

So I have an icon called "testImg" so the IconCellRenderer can read it in and use it.

2. I made my own TreeNode, which is a copy of MyNode from the TWL demo.
3. I made my own TestTreeModel, which is the following (I'm going to clean it up later, ie: remove "Test", etc):
Code:
public class TestTreeModel extends AbstractTreeTableModel
{
   
   @Override
   public int getNumColumns ()
   {
      return 1;
   }

   @Override
   public String getColumnHeaderText ( int column )
   {
      return "";
   }
   
    public TreeNode insert(Object str0, String str1) {
       TreeNode n = new TreeNode(this, str0, str1);
         insertChild(n, getNumChildren());
         return n;
     }

}


4. I made my TreeComboBox in the code, like so:
Code:
      TestTreeModel treeTableModel = new TestTreeModel();
      
      treeTableModel.insert(new DecoratedTextWithIcon("HI", 0, "testImg"), "1");
      flagComboBox = new TreeComboBox(treeTableModel);
      flagComboBox.getTreeTable().registerCellRenderer(DecoratedTextWithIcon.class, new IconCellRenderer());
      flagComboBox.setTheme("treecombobox");
      flagComboBox.setPosition(x, y);
      
      add(flagComboBox);


When I load this up, the UI looks just fine, and I get no errors. When I open the combobox, I see only "HI", not the image that was loaded from the theme file. When I select this item, it changes the selected value to be "HI /", and no image is present.

I put some printlns in the IconCellRenderer to see if the image was being used (draw method), and it does get down there.

On a side note, how do I remove the "/" from the selected text? This Combobox will be displaying only 1 item, not multple.


Also!

After I figure this out, I am going to write my own custom widget so (hopefully) I can easily add images to the Comboboxes in a very encapsulated form. I was wondering if I could possibily donate this to the TWL library? You have helped out me a lot (and of course others), so it is the least I can do to give back :).


Thanks!


Last edited by dayrinni on Sun Jun 17, 2012 1:43 pm, edited 1 time in total.

Top
 Profile  
 
PostPosted: Sun Jun 17, 2012 5:53 am 
Offline
Slick Zombie

Joined: Fri Jan 29, 2010 7:02 pm
Posts: 1171
Paste more complete code - esp the theme part. The "iconcellrenderer" theme must be a child theme of your treetable, which is inside that "treecomboboxPopup" theme. You can change the name of the popup theme via the "popupThemeName" parameter in your tree combobox theme.
The most likely case why it is not rendering the icons is that it did not find the theme - did you get any outputs?.

And what do you mean with "/" in the selected text?

_________________
TWL - The Themable Widget Library


Top
 Profile  
 
PostPosted: Sun Jun 17, 2012 2:58 pm 
Offline
Oldbie

Joined: Thu Mar 15, 2012 12:38 am
Posts: 260
MatthiasM wrote:
Paste more complete code - esp the theme part. The "iconcellrenderer" theme must be a child theme of your treetable, which is inside that "treecomboboxPopup" theme. You can change the name of the popup theme via the "popupThemeName" parameter in your tree combobox theme.
The most likely case why it is not rendering the icons is that it did not find the theme - did you get any outputs?.


My iconcellrenderer theme was not in the treecomboboxPopup.treetable theme.

So I have moved that theme as a child theme, to have the following:
Code:
<theme name="treecomboboxPopup" ref="-defaults">
        <param name="background"><image>-borderH</image></param>
        <param name="border"><border>2</border></param>
        <theme name="scrollpane" ref="scrollpane">
            <theme name="treetable" ref="table">
                <param name="background"><image>none</image></param>
                <param name="border"><border>0</border></param>
                <param name="columnHeaderHeight"><int>0</int></param>
               
                 <theme name="iconcellrenderer" ref="-defaults" allowWildcard="true">
                 <param name="icons">
                    <map>
                        <param name="testImg"><image>-iconK</image></param>
                    </map>
                 </param>
             </theme>
            </theme>
        </theme>
        <param name="minHeight"><int>300</int></param>
    </theme>


It still wasn't working so I took a closer look at the IconCellRenderer. It seemed to be trying to scale the image size according to the size of the left border and the height...and my left border size was 0! :lol: I changed the width/height to display the width/height of the image and it now shows up!

MatthiasM wrote:
And what do you mean with "/" in the selected text?


I am still having this issue - the image does not show up as the selected item. It displays as follows:
Image

So the image displays in the drop down but not on the "cell" that displays the currently selected item.

I suspect I have to change the renderer for the currently selected item to be the same as the drop down renderers?

Thanks!


Last edited by dayrinni on Sun Jun 17, 2012 3:21 pm, edited 1 time in total.

Top
 Profile  
 
PostPosted: Sun Jun 17, 2012 3:15 pm 
Offline
Slick Zombie

Joined: Fri Jan 29, 2010 7:02 pm
Posts: 1171
Hmm, sorry - looks like the current ComboBox classes are not customizable enough :(
I'll try to change the TreeComboBox so that it can use the cell renderer.

_________________
TWL - The Themable Widget Library


Top
 Profile  
 
PostPosted: Sun Jun 17, 2012 3:21 pm 
Offline
Oldbie

Joined: Thu Mar 15, 2012 12:38 am
Posts: 260
MatthiasM wrote:
Hmm, sorry - looks like the current ComboBox classes are not customizable enough :(
I'll try to change the TreeComboBox so that it can use the cell renderer.


I just re-read my previous post and it was a little unclear (but it seems you got it, just incase others are reading this) - I can get the images to draw just fine in the Drop Down now. I changed the width/height to display the width/height of the image(I edited my previous post to reflect this) and this fixed the issue.

The image just does not display when selected now.

Thanks a lot for helping me and let me know when you update the TreeComboBox!

I should probably have all of my coffee before writing posts in the morning :P


Top
 Profile  
 
PostPosted: Mon Feb 11, 2013 1:47 pm 
Offline
Oldbie

Joined: Thu Mar 15, 2012 12:38 am
Posts: 260
Hi MatthiasM,

I was wondering if you got around to updating the TreeComboBox to use CellRenderers?

Thanks :D


Top
 Profile  
 
Display posts from previous:  Sort by  
Post new topic Reply to topic  [ 9 posts ] 

All times are UTC


Who is online

Users browsing this forum: No registered users and 1 guest


You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
You cannot post attachments in this forum

Search for:
Jump to:  
Powered by phpBB® Forum Software © phpBB Group