Mismanaging ScrollablePane content

For help with general CEGUI usage:
- Questions about the usage of CEGUI and its features, if not explained in the documentation.
- Problems with the CMAKE configuration or problems occuring during the build process/compilation.
- Errors or unexpected behaviour.

Moderators: CEGUI MVP, CEGUI Team

daves
Home away from home
Home away from home
Posts: 253
Joined: Thu Feb 02, 2006 20:12

Mismanaging ScrollablePane content

Postby daves » Tue Jun 17, 2008 19:43

I think I am mismanaging the placement/sizing of the content of a ScrollablePane. The end result is when I first display a window containing the ScrollablePane it shows one thing, if I resize the window I end up with scrollbars showing when I think they should dissappear.

I have several pictures that I will provide. In these pictures, I'm placing 3 items into a ScrollablePane (each an image "container window"). The ScrollablePane is not behaving quite the way that I might expect. I'd like to better understand what to expect (since I'm sure the problem is in my understanding), so that I can manage the population of the ScrollablePane correctly.

The first picture shows the window at application startup (no manual sizing has occurred, this looks reasonable to me):
Image

The second picture shows the window subsequent to a height-only size decrease (this looks reasonable to me, scrollbars appear as expected):
Image

The next picture shows the window after a height-only size increase (though I expect the scrollbars to dissappear they do not):
Image

Lastly to see how much off I am I drag the scrollbars to the right and to the bottom. In other words I scroll to see the portion of the ScrollablePane content that is thought to still be invisible:
Image

This is clearly a subtle detail, but I want to get it right since I will be using ScrollablePanes and dont want to let this kind of subtlety lurk. What am I missing?
Last edited by daves on Wed Jun 18, 2008 19:05, edited 1 time in total.

daves
Home away from home
Home away from home
Posts: 253
Joined: Thu Feb 02, 2006 20:12

Postby daves » Tue Jun 17, 2008 19:55

For reference, this layout file is the simple framework for the ScrollablePane:

Code: Select all

<?xml version="1.0" encoding="UTF-8"?>

<GUILayout >
    <Window Type="DefaultWindow" Name="Template1" >
        <Property Name="InheritsAlpha" Value="False" />
        <Property Name="UnifiedMaxSize" Value="{{1,0},{1,0}}" />
        <Property Name="UnifiedAreaRect" Value="{{0,5},{0,25},{1,-5},{1,-5}}" />
      <Window Type="SVTLook/DialogWindowGroup" Name="Template1/WindowGroup" >
        <Property Name="UnifiedMaxSize" Value="{{1,0},{1,0}}" />
        <Property Name="UnifiedAreaRect" Value="{{0,2},{0,5},{1,-2},{1,-1}}" />
        <Window Type="SVTLook/ScrollablePane" Name="Template1/ScrollablePane" >
          <Property Name="ContentArea" Value="l:0 t:0 r:0 b:0" />
          <Property Name="HorzStepSize" Value="0.1" />
          <Property Name="VertStepSize" Value="0.1" />
          <Property Name="UnifiedMaxSize" Value="{{1,0},{1,0}}" />
          <Property Name="HorzOverlapSize" Value="0.01" />
          <Property Name="UnifiedAreaRect" Value="{{0,0},{0,0},{1,0},{1,0}}" />
          <Property Name="VertOverlapSize" Value="0.01" />
          <Property Name="HorzScrollPosition" Value="0" />
          <Property Name="VertScrollPosition" Value="0" />
          <AutoWindow NameSuffix="__auto_container__" >
            <Property Name="ContentArea" Value="l:0 t:0 r:0 b:0" />
            <Property Name="ChildExtentsArea" Value="l:0 t:0 r:0 b:0" />
          </AutoWindow>
        </Window>
      </Window>
    </Window>
</GUILayout>


The DefaultWindow at the top of this framework is then loaded using loadLayout and made a child of the FrameWindow that you see in the diagrams. The image icons are placed within the ScrollablePane using the following layout method:

Code: Select all

void Template1Menu::layoutImages(int rows, int columns)
   {
      int imgIconWidth = Template1Config::getSingleton().getPresentation().dImgIconWidth;
      int imgIconHeight = Template1Config::getSingleton().getPresentation().dImgIconHeight;
      float horzFraction = 1. / (float)columns;
      CEGUI::URect imageContainerArea(CEGUI::UDim(0.0, pad), CEGUI::UDim(0.0, pad),
                        CEGUI::UDim(horzFraction, -pad), CEGUI::UDim(0.0, imgIconHeight+pad));
      CEGUI::UVector2 vertOffset(CEGUI::UDim(0.0, 0), CEGUI::UDim(0.0, pad+imgIconHeight));
      CEGUI::UVector2 horzOffset(CEGUI::UDim(horzFraction, 0), CEGUI::UDim(0.0, -rows*(imgIconHeight+pad)));

      DisplayedImageMap::iterator it = mDisplayedImageMap.begin();
      for(int i=0; i<columns; i++)
      {
         for(int j=0; j<rows; j++)
         {
            if(it == mDisplayedImageMap.end())
            {
               return;
            }
            it->second->setArea(imageContainerArea);
            imageContainerArea.offset(vertOffset);
            it->second->setVisibility(true, true, true);

            it++;
         }

         imageContainerArea.offset(horzOffset);
      }
   }


The code to create a stack of "DisplayedImages"

Code: Select all

for(int imgI=0; imgI<Template1::MAX_NUM_IMAGES_PER_GROUP; imgI++)
         {
            std::stringstream imgName;
            imgName << mName << ".Img." << imgI;

            DisplayedImage *di = new DisplayedImage();
            assert(di && "Template1Menu::onInitialize: Failed to construct DisplayedImage.");
            bool imgInit = di->init(imgName.str(), p.dImgIconWidth, p.dImgIconHeight);
            assert(imgInit && "Template1Menu::onInitialize: Failed to initialize image");
            mDisplayedImageList.push_back(di);

            getDialogRef().getNamedWidget(sSP)->addChildWindow(di->getImageContainerWindow());

            imgName.clear(); imgName.str("");
         }


Code: Select all

bool Template1Menu::DisplayedImage::init(const std::string& imgName, int iconWidth, int iconHeight)
   {
      CEGUI::URect ia(CEGUI::UDim(0.0, 0), CEGUI::UDim(0.0, 0), CEGUI::UDim(0.0, iconWidth), CEGUI::UDim(0.0, iconHeight));
      CEGUI::URect ila(CEGUI::UDim(0.0, iconWidth+pad), CEGUI::UDim(0.0, pad), CEGUI::UDim(1.0, -pad), CEGUI::UDim(1.0, -pad));
      try {
         mImgContainerWindow = static_cast<CEGUI::DefaultWindow *>(WidgetMaker::getSingleton().createWindow(WidgetMaker::DEFAULTWINDOW, imgName+".container", false));
         mImgLabelWindow = WidgetMaker::getSingleton().createWindow(WidgetMaker::DIALOGITEMLABEL, imgName+".label", true);
         mImgWindow = WidgetMaker::getSingleton().createWindow(WidgetMaker::STATICIMAGE, imgName, false);
         mImgWindow->setArea(ia);
         mImgLabelWindow->setArea(ila);
         mImgContainerWindow->addChildWindow(mImgWindow);
         mImgContainerWindow->addChildWindow(mImgLabelWindow);
         mImgContainerWindow->hide();
      }
      catch (CEGUI::Exception ce)
      {
         SVTConsole::getSingleton().printError(ce);
         uninit();
         return false;
      }
      return true;
   }


Code: Select all

   void Template1Menu::DisplayedImage::setArea(const CEGUI::URect& area)
   {
      mImgContainerWindow->setArea(area);
   }

User avatar
CrazyEddie
CEGUI Project Lead
Posts: 6760
Joined: Wed Jan 12, 2005 12:06
Location: England
Contact:

Postby CrazyEddie » Wed Jun 18, 2008 08:42

I need to investigate this a bit (not looked at this widget for a while). Largely the ScrollablePane should be painless and 'automatic' to use. although this scrollbar thing seems annoying (the amount you are 'off' in the last picture is pretty much the size of the scrollbars, yeah?

Anyway, I'll reply again later once I have had a chance to look into this properly.

CE.

daves
Home away from home
Home away from home
Posts: 253
Joined: Thu Feb 02, 2006 20:12

Postby daves » Wed Jun 18, 2008 12:23

Thanks CE,

I tried to measure the amount off; thinking that indeed it might be the width of a single vertical scrollbar. It was my first thought no doubt. I placed the mouse on a visual reference then I dragged the horizontal scrollbar and observed the offset. It actually looks to me as if the offset is larger than the width of a scrollbar, perhaps even 2 times the width.

I have not yet been able to quantify. It does strike me as odd that when I shrink the framewindow height then increase the framewindow height that the scrollwindow does not return to its prior state. This does suggest that there may be some bit of state information internal to the ScrollablePane implementation that changes and that does not return to its default form. I have learned to always look at my own understanding and code first; its almost always the source of the problems I'm having! But this behaviour, in particular, suggests that there might be something within the the ScrollablePane implementation that is worth looking at.

User avatar
CrazyEddie
CEGUI Project Lead
Posts: 6760
Joined: Wed Jan 12, 2005 12:06
Location: England
Contact:

Postby CrazyEddie » Wed Jun 18, 2008 18:51

Okay. I have just finished hacking and playing with the scrollable pane demo in order to test out some things, and can report that there are definitely some strange things going on in the ScrollablePane widget. I'm not sure I have any solutions at the moment, but if I report my findings, them possibly it might be useful.

I was "sort of" able to replicate a similar issue by having some content with a max size set including a pixel amount, and the content has sizes with offset values. It seemed the amount the scrollable pane would "get it wrong" was then related to the amount of the max size offset compared with what the non-constrained size would be. So if max size is 200 pixels and the size is set to 250 pixels, the size is constrained to 200 pixels, but the scrollbar appears when the edge of the window hits the 250 pixel mark.

I kind of know the area of the code that affects this - there's a long standing bug on mantis relating to min size - but due to the way some of this works, I have yet to come up with a 100% satisfactory solution. I think if/when I do, this issue would vanish too.

I guess one possible work around, if your issue is related to this at all, would be to manage the min and max sizes very carefully.

CE.

daves
Home away from home
Home away from home
Posts: 253
Joined: Thu Feb 02, 2006 20:12

Postby daves » Wed Jun 18, 2008 18:57

Thanks, I'll find a work-around.. fairly minor issue when it comes down to it. If this leads to a fix/tweak to the ScrollablePane then awesome.

User avatar
CrazyEddie
CEGUI Project Lead
Posts: 6760
Joined: Wed Jan 12, 2005 12:06
Location: England
Contact:

Postby CrazyEddie » Wed Jun 18, 2008 19:56

CrazyEddie wrote:I kind of know the area of the code that affects this - there's a long standing bug on mantis relating to min size - but due to the way some of this works, I have yet to come up with a 100% satisfactory solution. I think if/when I do, this issue would vanish too.

Just browsing around some things and what's quite amusing about this is that it was you who raised the min size issue too (link) :)

daves
Home away from home
Home away from home
Posts: 253
Joined: Thu Feb 02, 2006 20:12

Postby daves » Wed Jun 18, 2008 20:03

CrazyEddie wrote:
CrazyEddie wrote:I kind of know the area of the code that affects this - there's a long standing bug on mantis relating to min size - but due to the way some of this works, I have yet to come up with a 100% satisfactory solution. I think if/when I do, this issue would vanish too.

Just browsing around some things and what's quite amusing about this is that it was you who raised the min size issue too (link) :)


Heh.. sry .. I lose track!

daves
Home away from home
Home away from home
Posts: 253
Joined: Thu Feb 02, 2006 20:12

Postby daves » Thu Jun 19, 2008 16:48

I just discovered something that I think is not correct in the way that I was adding content to the ScrollablePane. I saw this when I played with the layout editor and added content from within it. The layout editor adds the content to the "auto created window". I was simply calling addChildWindow on the ScrollablePane itself.

Now I'm thinking that I need to add content more like the I do with a TabControl.. digging into the example to see the right way.

daves
Home away from home
Home away from home
Posts: 253
Joined: Thu Feb 02, 2006 20:12

Postby daves » Thu Jun 19, 2008 16:51

Hmmm .. maybe I was doing it right after all. The cegui scrollable pane sample just calls addChildWindow also.. There is no special method to add the content.

I did notice that the sample calls setContentPaneArea, which I have not done. I've just used the defaults on the pane.

Does the ScrollablePane "intercept" addChildWindow in a fashion that allows it to put added windows under the "auto created window"?

User avatar
CrazyEddie
CEGUI Project Lead
Posts: 6760
Joined: Wed Jan 12, 2005 12:06
Location: England
Contact:

Postby CrazyEddie » Thu Jun 19, 2008 18:25

daves wrote:I did notice that the sample calls setContentPaneArea, which I have not done. I've just used the defaults on the pane.

This is only required if you're managing the size of the content pane yourself; the default is to have it auto-resize according to the added content (at least that's the theory).

daves wrote:Does the ScrollablePane "intercept" addChildWindow in a fashion that allows it to put added windows under the "auto created window"?

Indeed it does ;)

CE.

daves
Home away from home
Home away from home
Posts: 253
Joined: Thu Feb 02, 2006 20:12

Postby daves » Thu Jun 19, 2008 18:45

CrazyEddie wrote:
daves wrote:I did notice that the sample calls setContentPaneArea, which I have not done. I've just used the defaults on the pane.

This is only required if you're managing the size of the content pane yourself; the default is to have it auto-resize according to the added content (at least that's the theory).

daves wrote:Does the ScrollablePane "intercept" addChildWindow in a fashion that allows it to put added windows under the "auto created window"?

Indeed it does ;)

CE.


Sneaky!! :)

daves
Home away from home
Home away from home
Posts: 253
Joined: Thu Feb 02, 2006 20:12

Postby daves » Thu Jun 19, 2008 18:59

By the way. My image browser is now working very well. Of course there is nothing to it, given the power of CEGUI/Ogre. You may have wondered why the class name referenced above was Template1, rather than ImageBrowser. Its because I actually created the image browser as a "template application plugin" and am writing a tutorial for creating new application plugins from this "working" template.

I'm building an application platform that is focused on a specific industry/product line, and that leverages the power of Ogre/CEGUI.

I'm trying to setup a "community of company-wide platform users" here at my company and am modeling much of what I do after the Ogre/Cegui communities. You guys do it right, and I'd hate to recreate the wheel when so many open source communities are out there creating such powerful platforms.

So the tutorial is just one step that I'm taking to model what we do here after what you guys are doing!! It turns out that the image browser template isnt throw away since in addition to providing new developers with a tool to ramp up quickly on the development of new application plugins, the application itself actually needs a generalized image browser, as well as a specialized variant. So I'm attempting to kill several birds with one stone..

At any rate I wanted to create some context. I have learned so much from you guys, and have generated enough internal interest that I believe there is a good chance that the company will be working to productize the platform I'm creating... Starting July 1, we are moving into the next fiscal year, so we'll see!

Thanks a lot guys!! I'm really learning a lot from you.

User avatar
CrazyEddie
CEGUI Project Lead
Posts: 6760
Joined: Wed Jan 12, 2005 12:06
Location: England
Contact:

Postby CrazyEddie » Sat Jun 21, 2008 08:35

Hi,

Thanks for sharing what you're doing; it sounds interesting :)

I'm always pleased to see the library finding uses in such wide ranging applications. It would be fair to say that I had not envisaged such diversity when I first needed a couple of buttons and a listbox for a game I was going to be writing :lol:

I do hope your company decides to pick up your platform.

CE.

daves
Home away from home
Home away from home
Posts: 253
Joined: Thu Feb 02, 2006 20:12

Postby daves » Mon Jun 23, 2008 19:35

ScrollablePane management working (scrollbars appear/dissappear when appropriate) now within my imagebrowser. Rather than leave it to the "auto management" I manage the content area myself. It looks like the auto management is where the issue is.

I would like to set the step size of the scrollbar. The documentation says that setVerticalStepSize, setHorizontalStepSize, setVerticalOverlapSize, and setHorizontalOverlapSize are defined as fractions of a viewing page. What is the definition of "viewing page"? I know the size of my contentarea in pixels (the Rect), I also know the size in pixels that I want a step to be. So I might have thought that the step size would be the pixel step size divided by the size of the content area, but this gave me incorrect results.

Is the viewing area the same as the content area? Also what is the "overlap"?

I think once I understand how to effectively use these last four methods then I should be golden.

Thanks in advance for any guidance.


Return to “Help”

Who is online

Users browsing this forum: No registered users and 30 guests