As you work in LiveCode starting new stacks, closing others, and opening previously saved stacks, these actions can still occupy memory. Sometimes, you can get in a confused state where you're making a new Untitled stack only to find out there's still an Untitled stack on the go, which you're asked about if you want to purge. So, why not treat yourself to a quit and start a fresh launch of LiveCode! The following steps will help you achieve that:
- Create a new Mainstack. Set the name to
MGTestBedand save it somewhere you can easily find it. Perhaps, in the folder with theLCTestBedstack, which was feeling lonely! - Open the MobGUI window by selecting Development/Plugins/revMobGUI.
- In the MobGUI window's page of controls, select the Slider resizes box and move the slider to select a size of 320x480. This is the size of the original iPhone. Note the other sizes available. The card can also be resized with the LiveCode Inspector.
- Select the MobGUI context menu in IDE option in the MobGUI window. This will enable you to edit the MobGUI control behaviors later.
- Using the Card Inspector, set the name of this first card to Email.
- Drag a TabBar on the card window. Click on Snap to bottom of the card window. It will also resize the width of the card.
- In the MobGUI window, drag a button in the card window on top of the TabBar. Duplicate the button 3 times by holding the Alt/option key and dragging it. Align the four buttons and distribute them across the card using LiveCode's Align Tools in the Inspector palette.
- Select each button and set their names and labels to
Email,Browser,DatePicker, andPicture. Then, resize the buttons so that they fit their name text appropriately. - Select the Email button and choose Object Script from the Object menu or right-click on the button and choose the Edit Script option. The script will already look like the following screenshot:
- Add the following
mouseUphandler to the scripton mouseUp go card the short name of me end mouseUp
- You can copy the mouseUp script of the first button and paste the script in the other three buttons. Note that there is a preOpenControl handler created by MobGUI following the mouseUp script in each of these buttons. Do not change that!
- We'll need these elements on all of the four cards we're going to make, so choose the Select All option and then choose Group Selected from the Object menu.
- Make sure that the group is selected and in the regular LiveCode Inspector palette, check the Behave like a background box.
- Make three more cards and name them
Browser,DatePicker, andPicture. - From the LiveCode palette, drag a Label control on the card window for each of the four cards and set the name to match the card's name.
- In Standalone Application Settings, choose either iOS or Android, depending on the device you want to test on.
- Set the Internal App ID or Identifier to
com.yourname.MGTestBed. - If you're performing the same in iOS, make sure that you choose a profile from the Profile drop-down menu.
- You can now do a test from the Development menu, but first you have to choose either iPhone Simulator or your connected Android device.
It seemed like quite a few steps, but it doesn't take much time. We already have the navigation between the four cards and an authentic iOS-like interface.
Let's get some of the test features going, but in a more native, integrated way than before.
One powerful feature of MobGUI is that it can use ordinary LiveCode controls as placeholders for what will become native controls when you run the app on a device. This isn't something that you can't do for yourself with code, but being able to move placeholder controls around, until you like the layout, would save a lot of time.