[PIVOT-980] ScrollPane horizontal and vertical alignment of content

• Type: Improvement
• Status: Open
• Priority: Minor
• Resolution: Unresolved
• Affects Version/s: 2.0.4
• Component/s: wtk
• Environment: Win 7 x64, Java 7
• Assignee: Roger Lee Whitcomb
• Reporter: Josh Highley
• Created: 07/Dec/15 21:23
• Updated: 19/Jan/16 18:35

Description

I'm opening this request per Roger based on a Pivot user mailing list exchange beginning November 30 2015:

When the contents of a ScrollPane are smaller than the dimensions of the ScrollPane, there doesn't seem to be a way (or an easy way) to make the content be centered. The content is always aligned top-left. Using nested BoxPanes for vertical and horizontal alignment doesn't work since the BoxPanes don't expand to fill the ScrollPane, despite fill:true.

I propose adding support for verticalAlignment and horizontalAlignment to the ScrollPane for when its content is small than its dimensions:

<ScrollPane styles="

{verticalAlignment:'center', horizontalAlignment:'center'}

">
<ImageView ... />
</ScrollPane>

This is my initial mailing list message:
======================================================
I need help getting an image to display centered inside a larger ScrollPane. My application displays an image that can be zoomed in and out. A snippet of my current bxml is below. I adjust the zoom by changing the dimensions of the Border container. When the border is zoomed out such that it is smaller than the ScrollPane size, it's aligning to the top-left. I'd like to center it vertically and horizontally. I've tried various combinations of TablePane, FillPane and BoxPane as parents of the Border. BoxPane with fill:true (maybe nested BoxPanes with opposite orientations) isn't expanding to fill the ScrollPane as I'd expect; It shrinks to the size of the Border/Image

<ScrollPane>
<Border>
<ImageView styles="

{fill: true}

"/>
</Border>
</ScrollPane>
======================================================