Best way to add an image to an oval graphic?

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

Best way to add an image to an oval graphic?

ELS Prothero via use-livecode
Hi there,

When I set the BackgroundPattern of an graphic oval to the image ID, the
image is not centered inside the oval graphic.
What is a better way to add an image to a graphic oval (and center it?


greetings,

William
_______________________________________________
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: Best way to add an image to an oval graphic?

ELS Prothero via use-livecode
Hi.

I made an oval graphic and set the backGroundPattern to the ID of a random
image I imported to the card. It filled the grc perfectly. Do you have a
screenshot of what you are seeing?

Craig

-----Original Message-----
From: use-livecode [mailto:[hidden email]] On Behalf
Of William de Smet via use-livecode
Sent: Wednesday, November 11, 2020 6:38 AM
To: How to use LiveCode <[hidden email]>
Cc: William de Smet <[hidden email]>
Subject: Best way to add an image to an oval graphic?

Hi there,

When I set the BackgroundPattern of an graphic oval to the image ID, the
image is not centered inside the oval graphic.
What is a better way to add an image to a graphic oval (and center it?


greetings,

William
_______________________________________________
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: Best way to add an image to an oval graphic?

ELS Prothero via use-livecode
Hi Graig,

I think I understand it a bit better now.
The image I used has different dimensions than the graphic oval.
See screenshot: https://ibb.co/0tXkLHy

I could scale the image down to the same size (width) as the oval graphic
but then I don;t get the center of the image.
Because it is a pattern?
Is it possible to get the center of the image in the oval graphic?

LC 9.6.1



greetings,


William




Op wo 11 nov. 2020 om 15:51 schreef Craig newman via use-livecode <
[hidden email]>:

> Hi.
>
> I made an oval graphic and set the backGroundPattern to the ID of a random
> image I imported to the card. It filled the grc perfectly. Do you have a
> screenshot of what you are seeing?
>
> Craig
>
> -----Original Message-----
> From: use-livecode [mailto:[hidden email]] On
> Behalf
> Of William de Smet via use-livecode
> Sent: Wednesday, November 11, 2020 6:38 AM
> To: How to use LiveCode <[hidden email]>
> Cc: William de Smet <[hidden email]>
> Subject: Best way to add an image to an oval graphic?
>
> Hi there,
>
> When I set the BackgroundPattern of an graphic oval to the image ID, the
> image is not centered inside the oval graphic.
> What is a better way to add an image to a graphic oval (and center it?
>
>
> greetings,
>
> William
> _______________________________________________
> 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: Best way to add an image to an oval graphic?

ELS Prothero via use-livecode
As a pattern of a graphic, I don’t think so. Even scaling the graphic does not shrink or alter the position of the pattern.

Why are you using a graphic instead of just an image? I think you can mask an image, so it should be possible to only show through what you want.

Ideally though, just create an image file the size and appearance that you want in Livecode, unless you need it to change.

Bob S


On Nov 11, 2020, at 8:20 AM, William de Smet via use-livecode <[hidden email]<mailto:[hidden email]>> wrote:

Hi Graig,

I think I understand it a bit better now.
The image I used has different dimensions than the graphic oval.
See screenshot: https://ibb.co/0tXkLHy

I could scale the image down to the same size (width) as the oval graphic
but then I don;t get the center of the image.
Because it is a pattern?
Is it possible to get the center of the image in the oval graphic?

LC 9.6.1



greetings,


William

_______________________________________________
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: Best way to add an image to an oval graphic?

ELS Prothero via use-livecode
I should have said just create an image file the size and appearance that you want it to be, then import it into Livecode.

Bob S


On Nov 11, 2020, at 8:40 AM, Bob Sneidar via use-livecode <[hidden email]<mailto:[hidden email]>> wrote:

Ideally though, just create an image file the size and appearance that you want in Livecode, unless you need it to change.

_______________________________________________
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: Best way to add an image to an oval graphic?

ELS Prothero via use-livecode
In reply to this post by ELS Prothero via use-livecode
Patterns are drawn from the top left so you'd need to create an image with
the same dimensions as the oval with its content already centered. This
will only work if the oval never changes its size.

Another way is to place the image behind the oval graphic and group them.

--
Jacqueline Landman Gay | [hidden email]
HyperActive Software | http://www.hyperactivesw.com
On November 11, 2020 10:22:38 AM William de Smet via use-livecode
<[hidden email]> wrote:

> Hi Graig,
>
> I think I understand it a bit better now.
> The image I used has different dimensions than the graphic oval.
> See screenshot: https://ibb.co/0tXkLHy
>
> I could scale the image down to the same size (width) as the oval graphic
> but then I don;t get the center of the image.
> Because it is a pattern?
> Is it possible to get the center of the image in the oval graphic?
>
> LC 9.6.1
>
>
>
> greetings,
>
>
> William
>
>
>
>
> Op wo 11 nov. 2020 om 15:51 schreef Craig newman via use-livecode <
> [hidden email]>:
>
>> Hi.
>>
>> I made an oval graphic and set the backGroundPattern to the ID of a random
>> image I imported to the card. It filled the grc perfectly. Do you have a
>> screenshot of what you are seeing?
>>
>> Craig
>>
>> -----Original Message-----
>> From: use-livecode [mailto:[hidden email]] On
>> Behalf
>> Of William de Smet via use-livecode
>> Sent: Wednesday, November 11, 2020 6:38 AM
>> To: How to use LiveCode <[hidden email]>
>> Cc: William de Smet <[hidden email]>
>> Subject: Best way to add an image to an oval graphic?
>>
>> Hi there,
>>
>> When I set the BackgroundPattern of an graphic oval to the image ID, the
>> image is not centered inside the oval graphic.
>> What is a better way to add an image to a graphic oval (and center it?
>>
>>
>> greetings,
>>
>> William
>> _______________________________________________
>> 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




_______________________________________________
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: Best way to add an image to an oval graphic?

ELS Prothero via use-livecode
In reply to this post by ELS Prothero via use-livecode
Using the backgroundPattern seems intuitive, but read the fine print:
image dimensions have very specific requirements, and not heeding those
can yield unpredictable results.

Earlier this year I had a project that used backgroundPattern as a way
to use the graphic shape to mask an image.  It worked well in most
circumstances, with a satisfying range of images sizes - until it didn't.

We eventually found some images that would render at a fraction of
actual size, tiling across.

I had to ditch it and find another approach, which led to the thread
here a few months ago about keyhole effect.

The result of that is you can use a graphic placed on top of an image as
a mark, with the graphic's backgroundColor set to black and the ink set
to blendDstIn.

That combo will give you a lot of flexibility for centering and even
resizing your masking graphic over the image.

--
  Richard Gaskin
  Fourth World Systems
  Software Design and Development for the Desktop, Mobile, and the Web
  ____________________________________________________________________
  [hidden email]                http://www.FourthWorld.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: Best way to add an image to an oval graphic?

ELS Prothero via use-livecode
Thanks all for directing me into a different approach!

greetings,

William




Op wo 11 nov. 2020 om 19:19 schreef Richard Gaskin via use-livecode <
[hidden email]>:

> Using the backgroundPattern seems intuitive, but read the fine print:
> image dimensions have very specific requirements, and not heeding those
> can yield unpredictable results.
>
> Earlier this year I had a project that used backgroundPattern as a way
> to use the graphic shape to mask an image.  It worked well in most
> circumstances, with a satisfying range of images sizes - until it didn't.
>
> We eventually found some images that would render at a fraction of
> actual size, tiling across.
>
> I had to ditch it and find another approach, which led to the thread
> here a few months ago about keyhole effect.
>
> The result of that is you can use a graphic placed on top of an image as
> a mark, with the graphic's backgroundColor set to black and the ink set
> to blendDstIn.
>
> That combo will give you a lot of flexibility for centering and even
> resizing your masking graphic over the image.
>
> --
>   Richard Gaskin
>   Fourth World Systems
>   Software Design and Development for the Desktop, Mobile, and the Web
>   ____________________________________________________________________
>   [hidden email]                http://www.FourthWorld.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