1 2 Previous Next 24 Replies Latest reply on Feb 28, 2014 9:22 AM by philmodjunk

    how do you design layouts for rotating a screen on iOS devices

    JohnBuono

      Title

      how do you design layouts for rotating a screen on iOS devices

      Post

           I know the title is not right, but how do you set up your layouts so that when they are rotated they shift to a different layout,

            

           I have a portrait and landscape for iPhone, but how do I tell filemaker to switch on rotation?  I know it has to be simple, but I can't find it

        • 1. Re: how do you design layouts for rotating a screen on iOS devices
          Markus Schneider

               there is a script trigger available - 'onLayoutSizeChange...'. I don't have an english system here, therefore I can't write the correct name

          • 2. Re: how do you design layouts for rotating a screen on iOS devices
            JohnBuono

                 I checked under file options script triggers and there is nothing like that just on opening and closing windows.

                 Where did you find it ?

            • 3. Re: how do you design layouts for rotating a screen on iOS devices
              philmodjunk

                   There are two methods. Under layout setup you'll find the OnLayoutSizeChange script trigger if you are using FileMaker 13. With it a trigger will be tripped each time you resize your layout by resizing the window in FileMaker Pro and when you rotate an iOS device in FM GO.

                   The script can then use Get ( windowContentWidth ) to detect whether the iOS device is in Portrait or Landscape orientation and changes layouts accordingly.

                   The other options is to "hide" objects behind Opaque objects such as a graphic rectangle with the same color as the layout background or an invisible single panel tab control. If you set the object behind this 'screen' with a right auto-size anchor instead of the left, it will "slide" out from behind the screen when you rotate the device in to landscape and it slides back behind the screen when your rotate into portrait. The reverse can be done to slide objects down when the devices orients to portrait.

                   You can also set both left and right or top and bottom anchors to "stretch" the layout object to adjust your layout to the current orientation. This is particularly useful for portals as you can stretch them downward to show more portal rows when the device is in portrait orientation.

                   If you are using an iPhone, you can put a copy of the Known Bugs List on it to see examples of auto-size anchors adjusting layouts to fit the current orientation.https://www.dropbox.com/s/jt09b82i0xijbu3/FMP%20Bugs.zip (It does not have layouts customized for iPad.)

              • 4. Re: how do you design layouts for rotating a screen on iOS devices
                JohnBuono

                     The Get is boolean, and where does windowContentWidth come from  I have if [Get(windowContentWidth) < 940] Then 

                      

                     But that is not working.  What am I doing wrong.  I know it is the Get but not sure what to do

                • 5. Re: how do you design layouts for rotating a screen on iOS devices
                  philmodjunk

                       Get is not Boolean. I must assume that you saw the Get ( Flag ) entry in the Specify Calculation dialog box.

                       Get is a "swiss army knife" kind of function where the parameter passed to it can result all kinds of different values being returned. WindowConentWidth is just one of many parameters that can be passed to it. If you look up Get functions in FileMaker Help, you can get a list of all possible versions of the Get function. In the Specify Calculation dialog, if you select Get Functions from the View Drop Down, your list of functions will change to show this same list.

                       if [Get(windowContentWidth) < 940]

                       Is the correct use of Get ( WIndowContentWidth ) and the syntax of your If function is also correct. And according to the info i FileMaker 13 for device dimensions a result less than 940 should identify the fact that a standard iPad is in Portrait orientation.

                       So if this is "not working", I would look at the rest of your script and how the script is being performed--by the OnLayoutSizeChange trigger or by OnFirstWindowOpen?

                       Note: When I first got this working on a layout, I first used this script, performed by the OnLayoutSizeChange trigger as a way to double check the numbers returned by Get ( WIndowContentWidth ):

                       Show Custom Dialog [ Get ( WIndowContentWidth ) ]

                       That let me see the real numbers being returned by the function to compare against the "stencil" figures you can access in FileMaker 13 while in Layout Mode.

                  • 6. Re: how do you design layouts for rotating a screen on iOS devices
                    JohnBuono

                         It works like a champ now, thanks so much.  I forgot to add the script to the layout trigger which is why it did not work.

                          

                         Where did you find the WindowContentWidth variable documented?  That is one of my big problems with FM scripting can't find stuff.

                         Like the example on assists, they have the picture bar and then you drag and drop, and then you click to put picture in larger box.  I have looked at the example but can't figure out what is going on.  

                         Again thanks so much.

                    • 7. Re: how do you design layouts for rotating a screen on iOS devices
                      philmodjunk

                           I learned it from the FM GO forum about the time that I got my iPhone and started using FM GO 12 to put DB's on my iPhone. FM GO 12 doesn't have this trigger so I first learned to use the "sliding" object method and then later, in that same forum learned to use Install OnTimerScript with a 1 second interval to run a script that checked for window size changes. THat worked, though clunky and made FM Pro side script testing/debugging difficult.

                           But once FM GO 13 came out, it was easy to drop using Install OnTimer Script and use the trigger instead.

                           You may find these links on FM GO design of interest:

                      An Old Dog learns some new tricks...

                      Getting a simple "Read-only" scrollable field is now possible

                      • 8. Re: how do you design layouts for rotating a screen on iOS devices
                        philmodjunk

                             Oh yes, and I use a single script for detecting and adjusting to orientation changes:

                             If [ Get ( WindowContentWidth ) > 400 // iPhone is horizontal ]
                                Go to Layout [Let ( L = Get ( LayoutName ) ; LeftWords ( L ; WordCount ( L ) - 1 ) & " L" ) ]
                             Else
                                 Go to Layout [Let ( L = Get ( LayoutName ) ; LeftWords ( L ; WordCount ( L ) - 1 ) & " P" ) ]
                             End IF

                             This works because I give my pair of layouts identical layout names except for a final Letter L for landscape and P for Portrait. Then I can set the OnLayoutSizeChange trigger to perform this same script on any pair of layouts where I've set up one for each orientation.

                        • 9. Re: how do you design layouts for rotating a screen on iOS devices
                          JohnBuono

                               I am baffeled. I got the rotation to work perfectly on the iPad no problems but when I do this on the iphone

                               if [ Get (WindowContentWidth) > 321 // Landscape

                                 Go to Layout ["iPhone Model Landscape"]

                                 Show Custom Dialog ["The width is"; Get (WindowContentWidth)

                               Else

                                  Go to Layout ["iPhone Model Portrait"]  

                                Show Custom Dialog ["The width is"; Get (WindowContentWidth)

                               End If

                                

                               What happens is on the mac, in filemaker it work perfect the two layouts switch but when I put it on the iPhone, and rotate the phone, I get the default portrait mode in the landscape view and the show dialogue never shows up, but it does on the Mac.  What in the world am I doing wrong.  Its as if I am never getting into the script at all, but yet it works fine on the mac.

                          • 10. Re: how do you design layouts for rotating a screen on iOS devices
                            philmodjunk

                                 You have two layouts here. I would check to make sure that the script trigger for layout size change is enabled for both. Perhaps it is set for one and not the other.

                            • 11. Re: how do you design layouts for rotating a screen on iOS devices
                              philmodjunk

                                   to check to see if the script is executing, put the show custom dialog step as the first step of your script. I'm wondering if you have a set of If blocks that are to handle both iPads and iPhones and perhaps there is an issue there in your script that is keeping this section of the script from ever executing.

                              • 12. Re: how do you design layouts for rotating a screen on iOS devices
                                JohnBuono

                                     I just checked and on both layouts the script trigger is the same. That was the first thing I checked.  This has me stumped.  And why does not the show dialogue work on the iPhone but does on the iPad and Mac?

                                • 13. Re: how do you design layouts for rotating a screen on iOS devices
                                  JohnBuono

                                       Hmm, I tried that and the show dialogue is never shown on the iPhone.  I only have three scripts in the entire database, one for the iPhone, iPad, one that determines the device and for another function.  Very simple.

                                       The script triggers are on the layouts for iPhone and iPad.  I know that the device determination works since the iPhone layout is shown when you open the database.  But the rotation the dialogue in that script never shows on the iPhone but does on the mac for the same layout.

                                  • 14. Re: how do you design layouts for rotating a screen on iOS devices
                                    philmodjunk

                                         I think I see the issue. I do this so automatically, that I forget that I do it.

                                         SIze your layout to fit the device and orientation for which you intend to use the layout. But add an object in the lower right corner of the body. This object can be just an invisible rectangle. Change the auto-size anchors from "top", "left" to "bottom", "right". This object will force the layout to resize to fit the current window size and I think that you need that to trip the trigger.

                                    1 2 Previous Next