Brilliant. It worked really well.

In the end I subclassed BitmapFileMaterial (and yes, I had to make one
instance of regular BitmapFileMaterial for the main image, and one for
the reflected image) and just fiddled with the bitmap in the
onLoadSuccess event.

I've uploaded my class to the group in case anyone wants a similar
thing. It should probably be named something better than
MyBitmapFileMaterial (maybe ReflectedBitmapFileMaterial) and the
settings are specific to my project (line 37 for the fade out stuff)
but it does the job pretty well.


File: http://groups.google.com/group/away3d-dev/web/MyBitmapFileMaterial.as


In the end I did it without a mask and instead just used copyPixels to
merge a gradientFill with the flipped version of the image. That way
there's no extra CPU time on each frame refresh - just at the
beginning and then it's regular BitmapData (albeit with alpha
compositing).



On Dec 14, 9:16 pm, Al <[email protected]> wrote:
> Great, thanks for the help.
>
> And yeah, I've had quite a bit of experience with Flash, but until
> recently I've been stuck in the IDE and with timelines.
>
> I'll have a go with this new info tomorrow and see how it all goes.
>
> It seems reflections are a thing clients are getting into these days.
> Not sure exactly how much demand there is for this kind of thing, but
> maybe there should be some form of integration into Away3D. Then
> again, I guess (assuming this all goes well) it's not too huge a deal
> to get it working with some of the other things the framework offer.
>
> On Dec 14, 6:02 pm, Peter Kapelyan <[email protected]> wrote:
>
> > I think you want to change the Planes yUp:true (or false I forget), so that
> > the plane is facing the other direction, and works more the way you expect.
>
> > Seems you know the tricky "cacheAsBitmap" part, long time flasher? :)
>
> > Being that you can access the material.bitmap, there should be no reason you
> > can't do anything you want to that bitmapdata.
>
> > -Pete
>
> > On Mon, Dec 14, 2009 at 12:55 PM, Al <[email protected]> wrote:
> > > Ahh, we'll I've known about the old cacheAsBitmap trick for a while
> > > now if that's what you were getting at when you said it's super tricky
> > > from scratch, so I'm okay there. Just create a shape, do a gradient
> > > fill, cache as bitmap on both and then apply mask. However, will that
> > > even work (maybe this is what you meant by super tricky) on 3D
> > > objects?
>
> > > As I said before, this is my for foray into 3D, Away3D and IDE(and
> > > timeline)-less flash development. So I'm going to look into whether I
> > > can somehow grab the bitmap that's going to be drawn to a plane, get
> > > it out, flip it, mask it with a gradient fill and then draw my new
> > > version. Of course if you know off the top of your head whether that's
> > > possible and will work then feel free to save me some time.
>
> > > I've managed to get the two planes trick working, and as of right now
> > > it all works how I want it to with two pictures on top of each other,
> > > so all I need to do is this fading reflection thing.
>
> > > My assumption is that I'll need to subclass Plane for the reflected
> > > one so I've got that going on. Just need to work out how to extract
> > > the drawable bitmap and replace it with my own. I think I read
> > > somewhere along the way that I can override a draw method, so I'll
> > > check that out.
>
> > > Hope this doesn't kill my FPS!
>
> > > Side note:
> > > Does anyone know why x, y and z seem to be mixed up in Away3D? In
> > > order to place the second plane underneath the first one I'm having to
> > > use z = -(heightOfPicture). Here's me thinking it's be y = -
> > > (heightOfPicture), with x going left to right, y going bottom to top
> > > (maybe top to bottom to go with normal computer version of xx, y co-
> > > ords) and z being back to front. Oddly, changing the z of things like
> > > the camera do what I expect, although x and y definitely seem
> > > reversed.
>
> > > On Dec 14, 5:28 pm, Peter Kapelyan <[email protected]> wrote:
> > > > Two planes will be fine, from what I remember in piclens there is a
> > > > reflection only on the bottom row.
>
> > > > There's a bunch of examples and reusable code available online on how to
> > > do
> > > > a gradient mask  (super tricky to figure out from scratch).
>
> > > > I don't know where you are getting your bitmap from, I did assume it was
> > > > being loaded in, so you can always swap out the bitmap source of your
> > > plane
> > > > like this:
>
> > > > Assign a temp (grey/black etc) bitmap material to the plane,>
> > > > wait for bitmap to load,>
> > > > on content load>
> > > > myPlane.material.bitmap=newBitmapDataWithGradientMaskEtcEtc;
>
> > > > If you need help finding some gradient mask code, I can look around, 
> > > > I've
> > > > used it to achieve what you are talking about, with success, before.
>
> > > > -Pete
>
> > > > On Mon, Dec 14, 2009 at 12:12 PM, Al <[email protected]> wrote:
> > > > > Excellent. So are we still talking (structure-wise) the idea of making
> > > > > two separate planes that are tied to each other within a group. Of
> > > > > course I'm assuming here that a group (ObjectContainer3D) will allow
> > > > > me to relatively position my images regardless of the greater stage.
>
> > > > > And how do you propose doing the flip and mask thing? Are you thinking
> > > > > that I load the bitmap from the url passed separately (hence your
> > > > > mentioning of a lower quality version of the image) and do regular
> > > > > Flash transforms on it or still map it onto a 3D object and do the
> > > > > flip that way?
> > > > > I'm trying to make the 3D part as simple as possible because
> > > > > currently, each individual plane (image) has various positioning and
> > > > > rotation properties, all of which are tweened using a disgusting but
> > > > > simple enterFrame 'prop += (targetProp - prop) * 0.1' style thing. As
> > > > > such, I don't want to make the new 3D objects that'll happen when I
> > > > > come to add the reflections too awkward to mess with. As I was saying,
> > > > > ideally I'd replace the single plane I'm now tweening and positioning
> > > > > with a new single object which will now contain two planes.
>
> > > > > Does that make sense as the easiest thing to do?
>
> > > > > Thanks Peter for the reply.
>
> > > > > On Dec 14, 4:56 pm, Peter Kapelyan <[email protected]> wrote:
> > > > > > I would go with the flipped image + gradient mask, it's probably the
> > > > > fastest
> > > > > > performace you'd get, and you can probably get away with a blurred,
> > > lower
> > > > > > res bitmap for the reflection.
>
> > > > > > -Pete
>
> > > > > > On Mon, Dec 14, 2009 at 11:44 AM, Al <[email protected]>
> > > wrote:
> > > > > > > During my time waiting here for approval to post I've been looking
> > > > > > > around about how is best to do reflections and as far as I can see
> > > > > > > it's a case of either duplicating a view and getting two cameras
> > > and
> > > > > > > some other stuff that sounds way too complex or duplicating each
> > > > > > > object I want to reflect and (possibly) grouping it with its 
> > > > > > > parent
> > > > > > > object. Another possibility was get the final composited image of 
> > > > > > > a
> > > > > > > view and stick that somewhere using the view.canvas method or the
> > > > > > > newer view.getContainer or something like that.
>
> > > > > > > Anyway, here's my specific problem. I'm implementing a kind of
> > > picLens-
> > > > > > > type gallery. This my first Away3D project and actually my first
> > > > > > > proper go at having a go at AS3 from just classes (rather than a
> > > lot
> > > > > > > of tie-in with Flash IDE and timelines, etc.)
>
> > > > > > > I've implemented the piclens-type thing by loading each (dynamic,
> > > > > > > passed in through flashvars) bitmap using a BitmapFileMaterial
> > > (thanks
> > > > > > > for that Away3D devs, very useful!) and applying the material to a
> > > > > > > plane. And then making a new plane with a new BitmapFileMaterial
> > > for
> > > > > > > the next image, etc.
>
> > > > > > > I have all that working, and I can even use keyboard left/right to
> > > > > > > browse the line and the currently selected picture stands out and
> > > > > > > rotates towards the camera a bit too, looks great.
>
> > > > > > > I've now come across the brick wall that is generating reflections
> > > > > > > (with fade!) for each thumbnail. As I said above I think I'm
> > > looking
> > > > > > > at the easiest way of doing this to be actually making two planes
> > > for
> > > > > > > every image, setting each plane's material to be the same loaded
> > > file
> > > > > > > (whether I can do that with one BitmapFileMaterial instance or not
> > > > > > > isn't a big deal and I can sort that out myself) and then flipping
> > > the
> > > > > > > bottom one somehow (scaleX/Y/Z = -1 or similar?) and then applying
> > > > > > > some kind of filter or mask to fade it, and then grouping the two
> > > and
> > > > > > > where I now move the single plane (for left/right, I couldn't work
> > > out
> > > > > > > how to do it by moving the camera!), I'll now move the group.
>
> > > > > > > So does this make sense to anyone and also am I going about it the
> > > > > > > right way?
>
> > > > > > > In addition to that, would it be possible, instead of creating two
> > > > > > > BitmapFileMaterial instances (or using one on two objects if 
> > > > > > > that's
> > > > > > > possible), to use some kind of rendered composite of the plane for
> > > the
> > > > > > > reflections? I think this may have been hinted at in another post 
> > > > > > > I
> > > > > > > read. Something about using the ownCanvas property or something?
>
> > > > > > --
> > > > > > ___________________
>
> > > > > > Actionscript 3.0 Flash 3D Graphics Engine
>
> > > > > > HTTP://AWAY3D.COM
>
> > > > --
> > > > ___________________
>
> > > > Actionscript 3.0 Flash 3D Graphics Engine
>
> > > > HTTP://AWAY3D.COM
>
> > --
> > ___________________
>
> > Actionscript 3.0 Flash 3D Graphics Engine
>
> > HTTP://AWAY3D.COM

Reply via email to