Popover Resizing Issue

[fbugeja]

I am experimenting with the use of popovers on a coin database I keep.

Refer to Image 1: I have added 2 popover buttons, one in the bottom right-hand corner of the first coin and the second on the bottom left-hand corner of the second coin shown in the database.

The first button, when clicked, is designed show an enlarged picture of Bluey while the second button, when clicked, is designed to show an enlarged picture of King Charles III. At the moment, when I click either button, I do get a popover with the enlarged image – but not the size/location I want (See Database).

Here is my wish: when either button is clicked, I want the popover to cover exactly the area covered by the blue rectangle, as shown in Image 2. In other words, I would like the popover to cover the images of the 2 coins completely.

My issue: When I try to resize, I am unable to select exactly the size of the popover I want. Dragging the corner or middle resize handles on the popover to create the size of the popover I want does not work – the popover resizes to another size either bigger/smaller compared to what I want.

Can what I want be achieved? If I am doing something wrong, I would like to know what it is and how I can do this myself later. Any screenshots of changes made would be very much appreciated! I have attached the database with one record – the Bluey coin. I consider myself a beginner / intermediate FMP user.

Regards and many thanks from the Land Downunder!

Frank

AUSCOIN.fmp12

Edited November 30 by fbugeja

[bcooney]

I would use a card window to ensure precise sizing and placement . You’ll find how to do so by referring to Dan Smith’s card positioning demo file here. 

[fbugeja]

Hello bcooney.

Firstly thank you for responding to my query. As a beginner, I do not understand how to implement your solution. I just simply want to know why FMP prevents me from creating popover screens where I want them to be and with the dimensions I want. Again, thanks!

 

Frank

[comment]

What you ask for is impossible to do precisely. The reason for this is that the popover area is always positioned with its center aligned with the popover button. If your button is positioned to the right of the center of the area you want to cover, there will be either a slit exposed on the left side, or an additional band covering stuff on the right side. Or a little bit of both, as you can see in the attached file where I have adjusted the right-side popover to the approximate dimensions.

There are other methods that would allow precise positioning of the covering area, such as a card window (already mentioned) or a popover with invisible button that you pop open with a script, or even a slide control.

 

AUSCOIN+.fmp12

Edited December 1 by comment

[LaRetta]

There IS a way to do it, Frank, but it's a bit of a hack.  Attached is an example.  Place the popover buttons instead to each side at exactly the middle number of the combined height.  In the example, I left them yellow and remove their arrow icons.  Object-name the POPOVERS themselves (left to 'Image' and right to 'Image2'.  The popover (yellow) button widths can be just a few pts (left wider for demo so you can see them) and can be shorter but place them on the horizontal center.  Set them to Hide by typing a 1.

Resize the popover so each popover encloses entire area as you've indicated.  Then place buttons below. You can replace my ugly grey buttons with your little red arrow icons.  And you'll have to play around to get the size exact as you want it.

AUSCOIN MOD.fmp12

Ah, I see Michael mentioned the method I displayed!  😃

Edited December 1 by LaRetta
added bold portion

[fbugeja]

Hi comment

Your comment that the popover area is always positioned with its center aligned with the popover button provided me a solution. Rather than having the 2 popover buttons side-by-side, I positioned the buttons on top of each other. In this way I could make sure that the width of the popover windows was the same (which is what I wanted). I could also make the height of the top of each popover window the same (which is what I also wanted). The only thing different is the bottoms of the popover windows ... but I can live with that!

My solution is enclosed.

AUSCOIN2025 CLONE.fmp12

Hello LaRetta!

Just saw your solution after I posted mine! Thank you! I will learn from your reply! Regards from the Land Downunder!

Frank

[fbugeja]

Hi Laretta

I have decided to go with your solution. On the master AUSCOIN database I use, I have added the popover buttons, resized the popover windows associated with each button and added the IMAGE and IMAGE2 fields to the respective popover windows. When you test the 2 popover buttons, they work. So far, so good!

I then added the resize image buttons and added the code Go to Object [Object Name: <name>] to each button. However, when I test each button ... nothing happens! 

What am I missing? I have made a clone of the file I have been working on, and added 1 record. Maybe you can spot something that is not making the resize buttons working.

Frank

SO FAR.fmp12

Edited December 1 by fbugeja
Added file

[LaRetta]

So close!!  Select the image popover (in layout mode).  Notice that you lack the object name for the popover (attached).

And sorry to tell you but ... your concept of placing the popover in the exact location will still fail if you resize the window.  This just reminds me of why I was so glad when card window feature was added!  Some of these old techniques were kludgy so your mileage may vary.  

Slide control may allow a bit more control (using anchors) and you can play with anchors on the popovers as well but it will all still be a bit messy.

Edited December 1 by LaRetta

[comment]

@fbugeja

I notice you have cross-posted this question on Claris Community. This doesn't happen very often, but the answer you received there is better than any of the other options mentioned here. It may not be easy to understand at first glance, but I think it's worth spending the necessary time to learn it.

 

[comment]

Mmm... maybe I spoke too soon. Now that I have implemented the suggested solution myself, I notice a nasty "jump" as the popover settles in its place. 

Still, it's something worth learning - and the flaw may be be less noticeable in your situation where you need less padding. The great advantage here is that it's all done just by styling the popover object components (popover, popover content area and padding), with no need for extra buttons, scripts, script triggers and what have you.

 

 

 

PopoverContentArea.fmp12

Edited December 1 by comment

[fbugeja]

To comment & LaRetta

comment, I am extremely happy with the solution LaRetta gave me - and I am sticking with it! It works as I wanted it to work - and no more changes! I will look at the Claris Community solution you provided but, again, LaRetta's solution is what I wanted.

LaRetta, many, many thanks!

Frank

 

 

[LaRetta]

On 12/1/2024 at 12:37 PM, comment said:

Still, it's something worth learning

Yes it is!  And I get no flash or jumping, at least using FM21 on Sequoia (attached).  I'm glad you attached a sample.  This will indeed come in handy at times!