How to place a transparent PNG image over card image?

[TooManyNotes]

All,
I have a substack of cards, 1024, x 570. It's labeled SubStackCards.
I have a second substack of cards filled with frames (transparent backgrounds), called SubStackFrames.
The frames were built in PSD and exported as transparent PNGs.
I'm trying to place a card frame from the substackFrames over the top of a card from SubStackCards.
Again, both separate sub stacks.
Resulting effect: a picture frame on top of a bitmapped image.
Can't seem to find a method that works. Tried changing ink on both stacks, but to no avail.
Is it impossible to place a transparent card over a non-transparent image in LC? I read somewhere that LC does not support card-over-card, or put another way, image-over-image on the same card. It seems LC doesn't care if the the image is transparent or not, it simply refuses to accept two images on the same card. Or am I missing something here?
TIA,
John

[Klaus]

Hi John,

it simply refuses to accept two images on the same card. Or am I missing something here?

you MUST be missing something here, I do this all the time, no problems!?
See screenshot, transparent PNG with dropshadow over a JPEG...

Best

Klaus

[TooManyNotes]

Krause,
How did you do that?
John

[Klaus]

Krause

Oh come on, if you aren't able to spell just copy/paste it!

How did you do that?

Probably the same way as you do/did:
1. Create a stack
2. Import a JPG image
3. Import a transparent PNG image
4. That's it

[TooManyNotes]

Klaus,
I am referring to runtime, not author mode. I'm looking for the code, not condescension. It should be obvious from my initial question that I am referring to runtime. Of course it's possible to place image over image in author mode. But it is not obvious on how to do that with code at runtime. Clearly, I have come to the wrong place. I'll look elsewhere for the answer, hopefully from somebody who knows how to teach, with respect.

[SparkOut]

How are you "placing" the two images?

I'm going to guess that your problem is something as simple as having the images in the wrong layer order.

Try

Code: Select all

set the layer of image "transparent frame image" to top

if that isn't it, then I don't understand what it is that is wrong in your stack. But (as you can see from Klausimausi's sampler) it is perfectly possible and simple to have multiple overlaying images.

[Klaus]

I'm looking for the code, not condescension.

Being condescending was really not intended!

It should be obvious from my initial question that I am referring to runtime.

Should be, but wasn't!

But it is not obvious on how to do that with code at runtime.

As SparkOut wrote, set the correct layer of the images.

Clearly, I have come to the wrong place. I'll look elsewhere for the answer, hopefully from somebody who knows how to teach, with respect.

Oh my, oh my, I am really sorry, Cpt. Sensible!

And this from a guy who doesn't care to visit his postings again after receiving helpful answers, and maybe leave a little thank you...

[bogs]

@TooManyNotes - I suspect there was just a complete mis-interpretation on your part in regards to Klaus's comments, just as there is a bit of a misunderstanding of what exactly you are looking to do. While this is no ones fault in particular, it is sometimes a good idea to take a step back, maybe take a breath or two, and then try again.

Having read (and re-read) the posts thus far, this is my understanding of what your asking. If it is not correct, feel free to chime back in again with clarification.

I set this up as closely as I could to what you initially stated, i.e.

I have a substack of cards, 1024, x 570. It's labeled SubStackCards.
I have a second substack of cards filled with frames (transparent backgrounds), called SubStackFrames.
<sic>
I'm trying to place a card frame from the substackFrames over the top of a card from SubStackCards.

Here is what I worked up in the IDE to match your descriptions, sizes are different -

Frames and cards and pics OH MY!!

As mentioned above, the order you put things onto the main card count. To facilitate the pictures in the order they are to be displayed, I put 2 empty images on frmMain, named "imgCard" and "imgFrame". 'imgCard needs to be the first image object put on the card, followed by 'imgFrame' if you follow this example.

I then put 2 buttons on the card, however you may not need buttons. These are just to clear the card, then reapply the images.

The code in button 'cmdPic' is -

Code: Select all

on mouseUp
   put the text of image 1 of card 1 of stack "subStackCards" into image "imgCard"
   put the text of image 1 of card 1 of stack "subStackFrames" into image "ImgFrame"
end mouseUp

The code for 'cmdClear' just sets the image objects to empty -

Code: Select all

on mouseUp
   put "" into image "imgCard"; put "" into image "imgFrame"
end mouseUp

Here is the end result, running from a standalone file -

Standing alone...

The code above is very much longhand, it can be shortened considerably, but it should give you an idea of how to start, I hope.

Edit - I forgot to mention this as well, if your 'Cards' or 'Frames' are not all the same size, you *can* make them display the full size of the image by setting the lockLoc of the image object under 'size and position'. You can also relayer the controls the way you need them in that panel as well, using the arrows at the bottom.

[jacque]

I read somewhere that LC does not support card-over-card, or put another way, image-over-image on the same card.

Cards are like the walls in your house, they are structural and only one can be viewed at a time. The objects on the card are more flexible and can be overlapped.

This should work in both the IDE and a standalone:

Code: Select all

copy image "frame 1" of card 1 of stack "substackFrames" to this card
set the loc of last Image to the loc of image 1

Substitute the real name of the image for "frame 1" and the correct card name or number. The idea is to provide a specific reference to the image you want to copy. The above also assumes the original image (the one that is to be framed) is already on the display card.

If you need to clear the card later you'd do:

Code: Select all

delete image "frame 1"

Delete the original image the same way if desired.

[[-hh]]

Yet another method:
Set the windowshape of a temporary stack from your main stack.

Make for this a button in your main stack with the following script.
All you have to adjust is
• the frame identification (you could name them) and
• set the wished image/card under the frame.

Code: Select all

local t="tmp", sf="subStackFrames", sc="subStackCards"

on mouseUp
  lock screen; lock messages
  if there is a stack t then delete stack t
  create stack t
  set rect of stack t to 0,0,1024,575
  copy img 1 of card 1 of stack sf to stack t --  the frame
  set topleft of img 1 of card 1 of stack t to 0,0
  set windowshape of stack t to the short id of img 1 of stack t
  set loc of stack t to the loc of stack sc -- the image
end mouseUp

With that you can also use frames that have a non-rectangular outer opaque border. As the attachment (transparency is in the forum posts displayed as white).