The file we are going to use has Photoshop filter effects that other programs cannot handle, so unfortunately, you will need Photoshop to follow all of these steps or at least have a friend who has Photoshop! Pixelmator and GraphicConverter on Mac OS X can also extract graphics from the file, possibly, by just copying an area of the screen.
- Read the following article:
http://spin.atomicobject.com/2011/03/07/photoshop-template-for-ios-buttons/
- The article points to some other sources of information; for now though, download the following file:
http://spin.atomicobject.com/assets/2011/3/7/iOS_Buttons.psd
- Open the file in Photoshop (it may open automatically).
- In the Layers palette, hide the layers named Background and Tool Bar – Retina.
- Expand the layer named Bar Button – Retina, and hide the Button Label layer.
- Use the Marquee tool to select an area around the upper-right-hand side button. It should all look like this:
- Choose Copy Merged from the Edit menu.
- Select New from the File menu and make sure that the Background Contents property is set to Transparent and accept the size you are given.
- Paste the content, it will be an exact fit, and you will see the idle state for that button.
- Choose Save for Web & Devices… from the File menu.
- In the save dialog, select 24 bit PNG and make sure that the Transparency box is checked. Save the PNG with a suitable name, say
bluebuttonup.png. - Return to the main document and turn on the Visible = Active layer.
- Do another Copy Merged | New | Paste | Save for Web & Devices….
- Save the PNG as
bluebuttondown.png. - Go back to LiveCode.
- Reopen the test bed stack.
- Use File, Import As Control, and Image File… to bring the two PNGs in the stack.
- You can place the two images anywhere. Uncheck Visible in Basic Properties for each image.
- Add a new button to the first card and give it the name Location.
- Set the button script to:
on mouseUp iphoneStartTrackingLocation put iphoneCurrentLocation() into theLocation answer theLocation["latitude"] end mouseUp
- Select the Location button and in Basic Properties of the Inspector palette, turn off Show name and Opaque.
- In Icons & Border, turn off Three D, Border and Hilite border.
- Click on the magic wand button next to the Icon entry in the Inspector palette.
- From the Image library drop-down menu, select This Stack.
- Click on the lighter one of the two blue images.
- Click on the magic wand button next to the Hilite icon entry and then click on the darker of the two images.
- Resize the button just big enough to show the blue image without it being cropped.
- Place a Label field on top of the button.
- In Basic Properties, check the Disabled box. This is to make sure that the field doesn't trap the click you are going to perform. We want the button to get that click.
- In Contents, enter
Location. - Under Text Formatting, set the field to use Helvetica Neue, 18 point, Bold, and center aligned.
- Under Colors & Palettes, set the text color white.
- Align the field and the button so that the two are centered on each other.
- If you now test using the iOS Simulator and click on the Location button, you will just see a zero, but trying on a device should display your latitude when you touch the button (you will have to give permission to the app to know your location the first time you press the button.)
Although the button we made, may not be of the perfect size or even have the correct look for a standalone iOS button, we did go through all of the steps that you would need to make button state images. Placing a LiveCode field over the image buttons doesn't necessarily give it the best appearance. In reality, you would take more time in Photoshop to make a button of the right width for the label you're using and might also have to add the text to the image itself. It would look better and would not need a field to show the button's name in LiveCode.
LiveCode is able to use code to create the images we need, by setting the points of a graphic and its fillGradient. However, once you have the component parts needed to simulate a button or other kind of control, it would still take a lot more scripting to manage these elements.
There is an easy way out, although, it will cost you $50!
Q1. With the increase in your expectations about the size of a digital photo, you also expect to get a lot more for your money these days. While you weigh up the advantages of spending $50, how much better value do you think a computer's memory is now, compared to 25 years ago?
- 10 times better
- Half as good
- 100 times better
- 20,000 times better!
Answer: 4
Yes indeed. 25 years ago, Apple was selling a 4 MB add-on kit for Macintosh II for about $1,500. They now sell a 64 GB add-on for Mac Pro for $1,200.