In my situation, that image manipulation probably wouldn't be practical. The images I'm dealing with are typically 1700x2200 pixels or 2550x3300 pixels (8.5" x 11" at 200dpi or 300dpi). Worse case, I could probably manually compute and set the center given the image size and ScrollPane size, then setting padding or table cell dimensions.
On Tue, Dec 1, 2015 at 7:50 PM, Roger Whitcomb <roger.whitc...@actian.com> wrote: > Well, this definitely solves the alignment problem. I’m still struggling > with getting the image to do the right thing as far as sizing. I’m > wondering if you will have to actually zoom the Image itself in order to do > that (I mean resample and recreate the Image at the new resolution/size)? > > > > ~Roger > > > > *From:* Roger and Beth Whitcomb [mailto:rogerandb...@rbwhitcomb.com] > *Sent:* Tuesday, December 01, 2015 3:13 PM > *To:* user@pivot.apache.org > *Subject:* Re: > > > > I don't think the Border would have any effect with regard to centering, > one way or the other. > > Could you use nested BoxPanes with alternate orientations, fill=true, and > center alignment (inside the ScrollPane)? Something like this: > > <ScrollPane> > <BoxPane orientation='horizontal' styles="{fill:'true', > verticalAlignment:'center'}" > > <BoxPane orientation='vertical' styles="{fill:'true', > horizontalAlignment:'center'}" > > <ImageView ... /> > </BoxPane> > </BoxPane> > </ScrollPane> > > I haven't tried it, but kinda makes sense to me that it would work, but ... > > Let us know, > ~Roger > > On 12/1/15 1:06 PM, Josh Highley wrote: > > Yes, I can remove the Border and still do the zoom directly with > ImageView. > > <ScrollPane> > > <ImageView styles="{fill:true}"/> > > </ScrollPane> > > > > but zoom worked fine with Border too. It's centering the ImageView inside > the ScrollPane when the ImageView dimensions are smaller that I'm having > trouble with. I don't need the border, I just had it for the zoom method I > found -- does removing the Border component gain me something with regards > to centering? > > > > > > > > > > On Tue, Dec 1, 2015 at 12:32 PM, Roger Whitcomb <roger.whitc...@actian.com> > wrote: > > I also noticed the image artifacts, so that is a bug we need to fix. > > > > So, could you try this hierarchy and see if it works: > > <Border> > > <ScrollPane> > > <ImageView …/> > > </ScrollPane> > > </Border> > > > > And then just adjust the size of the ImageView itself to do the zoom? > > > > HTH, > > ~Roger > > > > *From:* Josh Highley [mailto:joshhigh...@gmail.com] > *Sent:* Tuesday, December 01, 2015 9:51 AM > *To:* user@pivot.apache.org > *Subject:* Re: RE: > > > > I ran the demo you committed (big thanks BTW) and tried it in my app. > There's a couple of issues: the zoomed in/out image still displays inside > the confines of the original ImageView dimension. This is especially an > issue when zooming in: parts of the image outside the original ImageView > bounds are clipped, which is what I'm trying to avoid by using the > ScrollPane. I want to see the entire image, just bigger, like what happens > when I resize the Border container and set ImageView fill:true. The other > issue is that the ScaleDecorator centers the zoomed image inside the > ImageView as specified, but I need to center the ImageView/Border inside > the larger ScrollPane. > > > > On a side note, when zooming in the image overwrites the Border on the > right and bottom. Then after zooming out to < 100%, there's artifacts of > the image remaining on the right side and bottom side. If you set your > demo's Border element to have a thicker border, it becomes more apparent. > > > > Thanks, > > > > Josh > > > > > > > > > > > > > > On Mon, Nov 30, 2015 at 7:59 PM, Roger Whitcomb <roger.whitc...@actian.com> > wrote: > > Take a look at the “ScaleDecoratorDemo.java” that I just committed to the > source (if you can download the source through “svn”). Or I can send it > separately… > > > > ~Roger > > > > *From:* Josh Highley [mailto:joshhigh...@gmail.com] > *Sent:* Monday, November 30, 2015 5:51 PM > *To:* user@pivot.apache.org > *Subject:* RE: > > > > No, I wasn't aware that existed. I found the Border method suggested by a > past mailing list question so I went with it. I I'll look at ScaleDecorator > instead. > > Thanks > > Josh > > On Nov 30, 2015 5:21 PM, "Roger Whitcomb" <roger.whitc...@actian.com> > wrote: > > Hi Josh, > > Welcome to Pivot! Have you looked at using a > ScaleDecorator on your ImageView? This may work better than adjusting the > Border size. And it has settings for the alignment (left/center/right) of > the scaled image as well. I might be able, in a couple of days, to try to > implement a small example. Sorry there isn’t one already in the examples > part of the code…. > > > > Let us know, > > ~Roger Whitcomb > > > > *From:* Josh Highley [mailto:joshhigh...@gmail.com] > *Sent:* Monday, November 30, 2015 2:08 PM > *To:* user@pivot.apache.org > *Subject:* > > > > 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> > > > > Thanks, > > > > Josh > > > > > > >
