How to flow text around an image in LC?

Got a LiveCode personal license? Are you a beginner, hobbyist or educator that's new to LiveCode? This forum is the place to go for help getting started. Welcome!

Moderators: Klaus, FourthWorld, heatherlaine, kevinmiller

bogs
Posts: 4620
Joined: Sat Feb 25, 2017 10:45 pm

Re: How to flow text around an image in LC?

Post by bogs » Wed Feb 13, 2019 11:17 pm

jacque wrote:
Tue Feb 12, 2019 6:08 pm
It's possible to collapse whole groups. The basic idea is to lock the screen, set the height of the group to something small, and unlock the screen. You can add an animation effect when unlocking if you want.
You know, I find it fascinating that it never seems to work that way on 'nix :shock:

The minute I added lock and unlock screen statements, the visual effects went bye-bye altogether, where as when I put just -

Code: Select all

// button shrink code...
on mouseUp
   hide group "flowText" with visual effect shrink to top
end mouseUp

// button grow code...
on mouseUp
   show group "flowText" with visual effect reveal down
end mouseUp
that works. Just seems very, very weird to me.
Image

jacque
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
Posts: 5352
Joined: Sat Apr 08, 2006 8:31 pm
Location: Minneapolis MN
Contact:

Re: How to flow text around an image in LC?

Post by jacque » Wed Feb 13, 2019 11:49 pm

Which LC version? You need to "lock screen for visual effect". That was added a while ago, in older versions you don't need it. I can't remember which version changed it.

Code: Select all

lock screen for visual effect
hide group whatever
unlock screen with visual effect shrink to top
Jacqueline Landman Gay | jacque at hyperactivesw dot com
HyperActive Software | http://www.hyperactivesw.com

bogs
Posts: 4620
Joined: Sat Feb 25, 2017 10:45 pm

Re: How to flow text around an image in LC?

Post by bogs » Thu Feb 14, 2019 12:24 am

I was playing with the code to hide the groups like Rachel was talking about in 6.5.x initially, and the group just hid or showed (but without the effect).

I just tested it in 8.1.2 and got a weirder result, now the whole card appears to move up or down. It is so bizarre that I posted a video of it, did I get it wrong?

*Edit - If it doesn't play, lemme know and I'll put it on youTube instead.
Image

ClipArtGuy
Posts: 226
Joined: Wed Aug 19, 2015 4:29 pm

Re: How to flow text around an image in LC?

Post by ClipArtGuy » Thu Feb 14, 2019 1:00 am

Hey bogs, if you don't want it to move the whole card, you can do like this:

Code: Select all

lock screen for visual effect in rect (the rect of your group)
hide group whatever
unlock screen with visual effect shrink to top

bogs
Posts: 4620
Joined: Sat Feb 25, 2017 10:45 pm

Re: How to flow text around an image in LC?

Post by bogs » Thu Feb 14, 2019 6:44 am

Hey ClipArtGuy,
did you see the video? The effect works in 8.1.2 (latest I can run on this box) with nothing more than the line of code I posted above, i.e.-

Code: Select all

on mouseUp
   hide group "flowText" with visual effect shrink to top
end mouseUp
In earlier versions of the IDE (as Jacque points out and of course I live in), it works with one line and, if you try locking the screen in one of those versions, you wind up with no effect at all, at least on 'nix. I thought the locking of the screen was a requirement to using the VE now, but apparently not so much (again on 'nix). Is 'nix alone in this respect, or is this a flub?

*Edit - apparently that is how it is supposed to work, one of the examples from the dictionary is

Code: Select all

hide me
show me with visual effect iris close slowly
The locking screen as far as I can tell isn't required just to shrink one object.
Image

ClipArtGuy
Posts: 226
Joined: Wed Aug 19, 2015 4:29 pm

Re: How to flow text around an image in LC?

Post by ClipArtGuy » Thu Feb 14, 2019 6:06 pm

I just tested this in LC 9.02 on Ubuntu 18.04, and it does seem to work as expected without locking the screen. If I lock the screen for visual effect, It does exhibit the behavior your video shows - the buttons also move and not just the object being hidden. If I use lock screen for visual effect in rect, it goes back to working as expected.

bogs
Posts: 4620
Joined: Sat Feb 25, 2017 10:45 pm

Re: How to flow text around an image in LC?

Post by bogs » Thu Feb 14, 2019 6:56 pm

Peculiar, isn't it? Or maybe 'counter-intuitive' might be a better way to put it.

Of course, it could be I just still don't get it :D
Image

jacque
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
Posts: 5352
Joined: Sat Apr 08, 2006 8:31 pm
Location: Minneapolis MN
Contact:

Re: How to flow text around an image in LC?

Post by jacque » Thu Feb 14, 2019 9:56 pm

The video doesn't play for me, but from your description everything sounds normal.

show/hide with visual effect -- animates the object rectangle
lock screen -- no visual effects supported
lock screen for visual effect -- buffers the whole card for animation
lock screen for visual effect in rect -- limits animation to a specified rectangle

If you want to simply animate the default rect of a control, show/hide is fine. If you have a lot of changes you want done quickly and then animated (such as a layout change) the lock screen for visual effect is good. If you have a specified area that should animate but isn't the whole card or the rect of a control, adding "in rect" lets you animate any area you want.

At any rate, animation is always done to an on-screen bitmap. You can't, for example, animate a control without animating any background image behind it. The image will also move in sometimes undesirable ways, as though you'd cut a hole in the card and are moving the content around inside the hole.
Jacqueline Landman Gay | jacque at hyperactivesw dot com
HyperActive Software | http://www.hyperactivesw.com

bogs
Posts: 4620
Joined: Sat Feb 25, 2017 10:45 pm

Re: How to flow text around an image in LC?

Post by bogs » Thu Feb 14, 2019 10:31 pm

jacque wrote:
Thu Feb 14, 2019 9:56 pm
The video doesn't play for me...
And here I thought webM was the new universal format :cry:

In case anyone else couldn't view it from Dropbox, I've put it on Youtube as well.

I think the secret sauce I was missing was (as you and ClipArtGuy pointed out) locking with the rect of the object. As you say, though, unless your moving more than one thing, like if you were rearranging an entire card, just putting the VE on the single line *should* work out just fine.

Thank you all for the clarification, it helps a lot :D
Image

Post Reply

Return to “Getting Started with LiveCode - Complete Beginners”