Would like to show a photo through a polygon shape

classic Classic list List threaded Threaded
15 messages Options
Reply | Threaded
Open this post in threaded view
|

Would like to show a photo through a polygon shape

Roger Eller
How might I put a picture into a triangle shape with the points:

34,268

224,268

127,365

34,268

If it were for one time use, I'd just use gimp or photoshop.  This will be
a picture that was just taken, or chosen from the library.

~Roger
_______________________________________________
use-livecode mailing list
[hidden email]
Please visit this url to subscribe, unsubscribe and manage your subscription preferences:
http://lists.runrev.com/mailman/listinfo/use-livecode
Reply | Threaded
Open this post in threaded view
|

Re: Would like to show a photo through a polygon shape

xtalkprogrammer
Hi Roger,

Fill the polygon, export to PNG, set the text of an image object to the
PNG, take the alpha mask from the image object and set the alpha mask of
the image object containing your photo to it.

--
Best regards,

Mark Schonewille

Economy-x-Talk Consulting and Software Engineering
Homepage: http://economy-x-talk.com
Twitter: http://twitter.com/xtalkprogrammer
KvK: 50277553

Use Color Converter to convert CMYK, RGB, RAL, XYZ, H.Lab and other
colour spaces. http://www.color-converter.com

Buy my new book "Programming LiveCode for the Real Beginner"
http://qery.us/3fi

Fill out this survey please
http://livecodebeginner.economy-x-talk.com/survey/

On 10/20/2013 22:03, Roger Eller wrote:

> How might I put a picture into a triangle shape with the points:
>
> 34,268
>
> 224,268
>
> 127,365
>
> 34,268
>
> If it were for one time use, I'd just use gimp or photoshop.  This will be
> a picture that was just taken, or chosen from the library.
>
> ~Roger


_______________________________________________
use-livecode mailing list
[hidden email]
Please visit this url to subscribe, unsubscribe and manage your subscription preferences:
http://lists.runrev.com/mailman/listinfo/use-livecode
Kind regards,

Drs. Mark Schonewille

Economy-x-Talk Consultancy and Software Engineering
Homepage: http://economy-x-talk.com
Twitter: http://twitter.com/xtalkprogrammer
Facebook: http://facebook.com/LiveCode.Beginner
KvK: 50277553
Reply | Threaded
Open this post in threaded view
|

Re: Would like to show a photo through a polygon shape

Paul Hibbert
Hi Roger,

Another method, if the image is the correct size to suit the polygon (or can be adjusted to fit) you can also…

 set the backgroundPattern of grc "myPolygon" to the ID of image "myImage"

You have less control over the location of the image within the polygon, it's just aligned with the topLeft so if you need to control the location Mark's suggestion may work out better, of course if the image is smaller than the polygon it will just repeat.

Paul


On 2013-10-20, at 1:19 PM, Mark Schonewille <[hidden email]> wrote:

> Hi Roger,
>
> Fill the polygon, export to PNG, set the text of an image object to the PNG, take the alpha mask from the image object and set the alpha mask of the image object containing your photo to it.
>
> --
> Best regards,
>
> Mark Schonewille
>
> Economy-x-Talk Consulting and Software Engineering
> Homepage: http://economy-x-talk.com
> Twitter: http://twitter.com/xtalkprogrammer
> KvK: 50277553
>
> Use Color Converter to convert CMYK, RGB, RAL, XYZ, H.Lab and other colour spaces. http://www.color-converter.com
>
> Buy my new book "Programming LiveCode for the Real Beginner" http://qery.us/3fi
>
> Fill out this survey please
> http://livecodebeginner.economy-x-talk.com/survey/
>
> On 10/20/2013 22:03, Roger Eller wrote:
>> How might I put a picture into a triangle shape with the points:
>>
>> 34,268
>>
>> 224,268
>>
>> 127,365
>>
>> 34,268
>>
>> If it were for one time use, I'd just use gimp or photoshop.  This will be
>> a picture that was just taken, or chosen from the library.
>>
>> ~Roger
>
>
> _______________________________________________
> use-livecode mailing list
> [hidden email]
> Please visit this url to subscribe, unsubscribe and manage your subscription preferences:
> http://lists.runrev.com/mailman/listinfo/use-livecode


_______________________________________________
use-livecode mailing list
[hidden email]
Please visit this url to subscribe, unsubscribe and manage your subscription preferences:
http://lists.runrev.com/mailman/listinfo/use-livecode
Reply | Threaded
Open this post in threaded view
|

Re: Would like to show a photo through a polygon shape

BNig
This post has NOT been accepted by the mailing list yet.
In reply to this post by Roger Eller
Hi Roger,

you could also set the background pattern/fill pattern of the polygon to the image

You might have to fiddle with the size of the image/polygon to get it right.

Kind regards
Bernd
Reply | Threaded
Open this post in threaded view
|

Re: Would like to show a photo through a polygon shape

J. Landman Gay
In reply to this post by xtalkprogrammer
On 10/20/2013 22:03, Roger Eller wrote:
> How might I put a picture into a triangle shape with the points:

Resize the image to the rect of the triange (if you want.) Set the
graphic's opaque to true. Set the backpattern of the graphic to the id
of the image.

The backpattern will be drawn from 0,0, so that's the reason to resize
in order to get most of it to display inside the graphic.

--
Jacqueline Landman Gay         |     [hidden email]
HyperActive Software           |     http://www.hyperactivesw.com

_______________________________________________
use-livecode mailing list
[hidden email]
Please visit this url to subscribe, unsubscribe and manage your subscription preferences:
http://lists.runrev.com/mailman/listinfo/use-livecode
Reply | Threaded
Open this post in threaded view
|

Re: Would like to show a photo through a polygon shape

Roger Eller
These are all great suggestions.  For a permanent masked image, I would use
the text of the image, but for just a quick display within a shape, the
backPattern does the job nicely.  Thank you all - Mark, Paul, and
Jacqueline!

~Roger
_______________________________________________
use-livecode mailing list
[hidden email]
Please visit this url to subscribe, unsubscribe and manage your subscription preferences:
http://lists.runrev.com/mailman/listinfo/use-livecode
Reply | Threaded
Open this post in threaded view
|

Re: Would like to show a photo through a polygon shape

Alejandro Tejada
In reply to this post by BNig
Hi Bern,

BNig wrote
you could also set the background pattern/fill pattern of the polygon to the image
You might have to fiddle with the size of the image/polygon to get it right.
The "Hidden Point technique to mask an image" posted by Scott Rossi
is closely related to your solution:

http://runtime-revolution.278305.n4.nabble.com/Hidden-point-technique-to-mask-an-image-td2270248.html

Have a nice week!

Al
Reply | Threaded
Open this post in threaded view
|

Re: Would like to show a photo through a polygon shape

Roger Eller
Oh cool. Thanks!

~Roger
On Oct 20, 2013 5:54 PM, "Alejandro Tejada" <[hidden email]> wrote:

> Hi Bern,
>
>
> BNig wrote
> > you could also set the background pattern/fill pattern of the polygon to
> > the image
> > You might have to fiddle with the size of the image/polygon to get it
> > right.
>
> The "Hidden Point technique to mask an image" posted by Scott Rossi
> is closely related to your solution:
>
>
> http://runtime-revolution.278305.n4.nabble.com/Hidden-point-technique-to-mask-an-image-td2270248.html
>
> Have a nice week!
>
> Al
>
>
>
> --
> View this message in context:
> http://runtime-revolution.278305.n4.nabble.com/Would-like-to-show-a-photo-through-a-polygon-shape-tp4671281p4671291.html
> Sent from the Revolution - User mailing list archive at Nabble.com.
>
> _______________________________________________
> use-livecode mailing list
> [hidden email]
> Please visit this url to subscribe, unsubscribe and manage your
> subscription preferences:
> http://lists.runrev.com/mailman/listinfo/use-livecode
>
_______________________________________________
use-livecode mailing list
[hidden email]
Please visit this url to subscribe, unsubscribe and manage your subscription preferences:
http://lists.runrev.com/mailman/listinfo/use-livecode
Reply | Threaded
Open this post in threaded view
|

Re: Would like to show a photo through a polygon shape

ScottR
In reply to this post by Roger Eller
Hi Roger:

Try this stack (in your message box):
go url
"http://www.tactilemedia.com/site_files/downloads/masking_options.rev"


Regards,

Scott Rossi
Creative Director
Tactile Media, UX/UI Design




On 10/20/13 1:03 PM, "Roger Eller" <[hidden email]> wrote:

>How might I put a picture into a triangle shape with the points:
>
>34,268
>
>224,268
>
>127,365
>
>34,268
>
>If it were for one time use, I'd just use gimp or photoshop.  This will be
>a picture that was just taken, or chosen from the library.
>
>~Roger
>_______________________________________________
>use-livecode mailing list
>[hidden email]
>Please visit this url to subscribe, unsubscribe and manage your
>subscription preferences:
>http://lists.runrev.com/mailman/listinfo/use-livecode
>



_______________________________________________
use-livecode mailing list
[hidden email]
Please visit this url to subscribe, unsubscribe and manage your subscription preferences:
http://lists.runrev.com/mailman/listinfo/use-livecode
Reply | Threaded
Open this post in threaded view
|

Re: Would like to show a photo through a polygon shape

Alejandro Tejada
Hi Scott,

Scott Rossi wrote
Try this stack (in your message box):
go url
"http://www.tactilemedia.com/site_files/downloads/masking_options.rev"
I noticed that you do not include the option of
using the Hidden Point technique to mask an
image in your stack.

Did you find a problem applying this method?

Thanks in advance!

Al
Reply | Threaded
Open this post in threaded view
|

Re: Would like to show a photo through a polygon shape

ScottR
[ I didn't see the other responses until today -- the mail server enjoys
bumping me off about once a week and have to resubscribe to the list ]

Hi Al:

A graphic with discontiguous points is just another way to create a vector
mask.

The reason why a group with ink effects might be a preferable masking
solution is the image can be positioned/resized independently of the mask.
 This is demonstrated in the sample stack.  As Jacque pointed out, when
using a backPattern, the image is always drawn from the topLeft of the
object and is fixed.  Also a backPattern does not support translucency,
while a group can.  But using a group can be a bit more work.

Regards,

Scott Rossi
Creative Director
Tactile Media, UX/UI Design




On 10/20/13 6:05 PM, "Alejandro Tejada" <[hidden email]> wrote:

>Hi Scott,
>
>
>Scott Rossi wrote
>> Try this stack (in your message box):
>> go url
>> "http://www.tactilemedia.com/site_files/downloads/masking_options.rev"
>
>I noticed that you do not include the option of
>using the Hidden Point technique to mask an
>image in your stack.
>
>Did you find a problem applying this method?
>
>Thanks in advance!
>
>Al
>
>
>
>--
>View this message in context:
>http://runtime-revolution.278305.n4.nabble.com/Would-like-to-show-a-photo-
>through-a-polygon-shape-tp4671281p4671299.html
>Sent from the Revolution - User mailing list archive at Nabble.com.
>
>_______________________________________________
>use-livecode mailing list
>[hidden email]
>Please visit this url to subscribe, unsubscribe and manage your
>subscription preferences:
>http://lists.runrev.com/mailman/listinfo/use-livecode
>



_______________________________________________
use-livecode mailing list
[hidden email]
Please visit this url to subscribe, unsubscribe and manage your subscription preferences:
http://lists.runrev.com/mailman/listinfo/use-livecode
Reply | Threaded
Open this post in threaded view
|

Re: Would like to show a photo through a polygon shape

Roger Eller
In reply to this post by ScottR
I was going with backPattern until I saw this. Ink effects are very useful!
 I like that the image can be repositioned, as I wanted the picture
centered, but backPattern has no option for setting a location.  Thanks
Scott.

~Roger

On Sun, Oct 20, 2013 at 8:20 PM, Scott Rossi <[hidden email]> wrote:

> Hi Roger:
>
> Try this stack (in your message box):
> go url
> "http://www.tactilemedia.com/site_files/downloads/masking_options.rev"
>
>
> Regards,
>
> Scott Rossi
> Creative Director
> Tactile Media, UX/UI Design
>
>
>
>
> On 10/20/13 1:03 PM, "Roger Eller" <[hidden email]> wrote:
>
> >How might I put a picture into a triangle shape with the points:
> >
> >34,268
> >
> >224,268
> >
> >127,365
> >
> >34,268
> >
> >If it were for one time use, I'd just use gimp or photoshop.  This will be
> >a picture that was just taken, or chosen from the library.
> >
> >~Roger
> >_______________________________________________
> >use-livecode mailing list
> >[hidden email]
> >Please visit this url to subscribe, unsubscribe and manage your
> >subscription preferences:
> >http://lists.runrev.com/mailman/listinfo/use-livecode
> >
>
>
>
> _______________________________________________
> use-livecode mailing list
> [hidden email]
> Please visit this url to subscribe, unsubscribe and manage your
> subscription preferences:
> http://lists.runrev.com/mailman/listinfo/use-livecode
>
_______________________________________________
use-livecode mailing list
[hidden email]
Please visit this url to subscribe, unsubscribe and manage your subscription preferences:
http://lists.runrev.com/mailman/listinfo/use-livecode
Reply | Threaded
Open this post in threaded view
|

Re: Would like to show a photo through a polygon shape

Richmond Mathewson-2
I have just had a bit of fun that may help towards a solution:

I imported an image into a stack and then made a 5-sided regular polygon
graphic on top of it.

I made the polygon graphic transparent (Polly Gone !!!!)

The I started messing around with blending/ink (that discrepancy with
naming between the prefs palette
and scripting can be a bit misleading) and found that

blendDstAtop  and  blendDstIn  (who invented those awful names?) make
the area inwith the rect of the regular
polygon graphic but outwith the polygon graphic itself black, producing
a frame (of sorts).

The snag is that all the image on the layer below the polygon graphic
that is not masked by the black area is visible.

Richmond.

_______________________________________________
use-livecode mailing list
[hidden email]
Please visit this url to subscribe, unsubscribe and manage your subscription preferences:
http://lists.runrev.com/mailman/listinfo/use-livecode
Reply | Threaded
Open this post in threaded view
|

Re: Would like to show a photo through a polygon shape

Alejandro Tejada
In reply to this post by Roger Eller
Hi Roger,

Test these scripts too, before using a group:

1) Create a new stack
2) Create a polygon graphic
and set the points of it to:

0,0

34,268
224,268
127,365
34,268

3) import an image into this stack,
put the image in a corner, where it does not
hide the graphic and:

set the backpattern of grc 1 to the id of img 1

(now, the imported image is cropped within
the graphic)

4) set the script of the graphic to this variation
of Scott Rossi script to move the first point of
the graphic and (at the same time) move the
image within the graphic:

local lpoints,tClick

on mouseDown
   put the points of me into lpoints
   put mouseH(),mouseV() into tClick
end mouseDown

on mouseMove X,Y
   if tClick = "" then exit mouseMove
   put  (X - item 1 of tClick,Y - item 2 of tClick) into line 1 of lpoints
   set the points of me to lpoints
end mouseMove

on mouseUp
   put "" into tClick
end mouseUp

on mouseRelease
   put "" into tClick
end mouseRelease

When you click inside the graphic and move the mouse
the image will move within the graphic, just as you
requested.

But... there is a small glitch. The background image
"reset" it's position when you try to move it again.

Why does this happen?
Why the image "resets" it's position?
Does exists a workaround for this?

Thanks in advance!

Al


Reply | Threaded
Open this post in threaded view
|

Re: Would like to show a photo through a polygon shape

Alejandro Tejada
In reply to this post by Roger Eller
Hi Roger,

Yes! This script works fine, without glitches.
Test it on the graphic and told us your results:

local lpoints,tClick,tFirstPoint
-- based on Scott Rossi script for masking images

on mouseDown
   put mouseH(),mouseV() into tClick
   put the points of me into lpoints
   put line 1 of lpoints into tFirstPoint
   put "mouseDown" & cr & lpoints & cr & cr into fld 1
end mouseDown

on mouseMove X,Y
   if tClick = "" then exit mouseMove
   put  (X - item 1 of tClick,Y - item 2 of tClick)
   put  (X - item 1 of tClick) + item 1 of tFirstPoint,(Y - item 2 of tClick) + item 2 of tFirstPoint into line 1 of lpoints
   set the points of me to lpoints
end mouseMove

on mouseUp
   put "" into tClick
end mouseUp

on mouseRelease
   put "" into tClick
end mouseRelease