App Inventor News, General, Tips, Video

App Inventor to run on iPhones? Yes. How about Windows and Mac OS X? #AppInventor #Stem

Leave a comment

MIT has announced that App Inventor will run on iPhones and iPads, hopefully by spring of 2018. You can help make that happen by making a donation to their effort – go to http://appinventor.mit.edu and follow the links to make a donation!

Did you know that you can run App Inventor Android apps on Windows and Mac OS X? Sure can!

All you need is to install an Android simulator for Windows or Mac and then install your App Inventor .apk app into the simulator. This way you can run your apps on Windows or Mac!

This short video shows you how to do that – take a look!

 

There are several Android simulators for both Windows and Mac OS X.

This video demonstrates using BlueStacks for Windows (also available for Mac OS X) and Nox App Player for Mac OS X.

Android Development, Tips

Can you create an MIT App Inventor app without a computer? YES

Leave a comment

Several people have asked me if it is possible to create an Android app without using a computer. Yes, it is possible!

All you need do is access appinventor.mit.edu in the web browser on your Android device. App Inventor works the same as it does on a computer.

You’ll need to go in to Android Settings | Security and check the option to allow installation of apps from Unknown Sources.

Then, in the App Inventor web interface, you will use Build | App (save .apk to my computer). The app will be “compiled” (translated into an executable program file for Android known as an “apk” file – short for Android package) and then downloaded to your computer.

The download part will vary depending on what browser you are using as well as what version of Android you have. You might find the download icon (a down arrow) in the notification bar. Swype down from the top and then select the downloaded file, open it and select Install to install your app. Once installed, you can run the app directly – or the app will appear in the list of apps installed on your device and you can run it directly from the app list. The exact way this all happens will vary depending on your system and browser.

The following video tutorial shows I how I did this on Android using the Opera browser. Note that I used a Bluetooth keyboard and a Bluetooth mouse – so the screen looks like I am using a computer because I am not touching anything!

 

App Inventor News

MIT App Inventor team receives Distinguished Leadership Award from the Mass Technology Leadership Council

Leave a comment

The MIT App Inventor team accepted the Council’s Distinguished Leadership Award for working to make application development universally accessible.

Source: Wayfair CEO Niraj Shah, athenahealth, and Toast Take Top Honors at 20th Annual Mass Technology Leadership Awards

Congratulations to the team! Well done! Well deserved!

Appy Builder, Components

Appy Builder: Using the BatteryStatus component #AppInventor #AppyBuilder #STEM #Programming

Leave a comment

A reader asked if there is a way to determine the status of the Android device battery in MIT App Inventor. Unfortunately, App Inventor does not provide a way to check the battery status … but Appy Builder does!

To answer that question, our first Appy Builder app is a simple tutorial showing how to use the BatteryStatus component in Appy Builder.

User Interface

The output is displayed after pressing the Start button and shows that my phone’s battery is at 99% and was plugged in to the AC power charger.

In this screen shot, the phone was unplugged from the battery charger and the “plugged in” status has changed to UNKNOWN.

Designer View

I created this screen by adding a Button control, and then adding six HorizontalLayouts. Inside each layout, I dragged two Label controls, setting one to the descriptive text (such as “Battery level:” and the second to be used to display the status for that property).

Blocks View

The BatteryManager has several properties that describe aspects of the battery.

Before the properties may be used you must activate the BatteryManager by setting the .StartMonitoring property to true; this must be done separately as shown below. Errors occurred when I put that code inside the button’s .Click handler. Instead, I moved the StartMonitoring assignment to the Screen1.Initialize event handler and everything worked fine.

  • BatteryLevel – the battery’s current level in percent
  • BatteryTemperature – the temperature of the battery in degrees Celsius
  • BatteryPresent – true (my phone does not permit me to remove the battery)
  • BatteryPlugged – returns “AC” if the device is connected to a charger, or UNKNOWN if the device is not plugged in. This might also return “WIRELESS” if the device is currently using a wireless charger (based on Android BatteryManager API).
  • BatteryVoltage – battery voltage. A typically value will be near 4 volts plus or minus for most phones.
  • BatteryHealth – GOOD. I presume this returns a value corresponding to the Android BatteryManager API, which includes COLD, DEAD, GOOD, OVERHEAT, OVER_VOLTAGE, UNKNOWN and UNSPECIFIED_FAILURE.

Download Source

Right-click (or Ctrl-click on Mac OS X) and use your browser’s feature to save this file to your computer: BatteryStatus.aia

Then, use Projects | Import selected project (.aia) from my computer … to load the file into Appy Builder

Appy Builder, Products

What is Appy Builder? Why should App Inventor programmers be interested?

1 Comment

Appy Builder is an independent and enhanced version of MIT App Inventor that builds upon App Inventor by adding many new features.

For the most part, Appy Builder’s interface is nearly the same as that of MIT App Inventor. If you have been programming apps with App Inventor, switching over to Appy Builder is very easy.

More Features

Appy Builder is built upon the App Inventor base but expands by adding new features and components:

  • Appy Builder adds components that enable you to earn money with your apps by adding paid advertising within your apps or by offering items for sale from within your apps
  • Appy Builder adds enhanced data storage features including SQL Lite
  • Access to more “sensor” controls on your Android device, including Battery Status information. Access to some WiFi connection information (Is WiFi currently connected?)
  • More components and properties (the User Interface Palette in Appy Builder has 22 components while MIT App Inventor has 14)
  • Many components have more features. For example, a Label in MIT App Inventor has six properties but in Appy Builder, a Label has 16 properties that you can set.
  • Improved Google Mapping capabilities.
  • You can control the use of the camera flash in Appy Builder but not in MIT App Inventor.
  • Appy Builder has an online forum for asking questions, answering others’ questions

The above is only a general summary to give you an idea of the enhancements available at Appy Builder.

MIT App Inventor showed the world that programming can be made easier by using a graphical user interface programming model. Further, App Inventor demonstrated that remarkably powerful apps can be created using this simplified approach to programming.

Appy Builder takes the App Inventor ease of use model and extends that to add more capabilities. Clearly, drag and drop programming makes programming accessible to more people. Appy Builder is an important contribution to the continually improving and evolving world of app development.

How to Use Appy Builder?

Go to: http://appybuilder.com

And sign in for a free account or a paid account. Paid accounts offer more features and capabilities.

Try it out! In addition to the generic “Free” account, you can also get 30 days free access to their Gold account to learn about their more advanced features and decide if those features are right for you.

More Coming

I will be publishing tutorials on some Appy Builder features – I know that many readers are already looking for solutions that are provided by Appy Builder.

General, Uncategorized

New web address Learn2c.org

Leave a comment

To make accessing this web page easier, I created a new web address for my App Inventor “how to” web site:

The name is short for “Learn to Code”. A short URL makes it easy to visit the web site!

I duplicated the old web site at the new address and everything looks the same. The new web site is “live” now although I will still be posting here for a bit.

I will keep you updated on the switch over, perhaps later in the week. But go ahead – check out the new web site – it is up and running now!

By creating a new web site, the two older web sites will remain online. All links from Facebook, Twitter, Google+, Tumblr and personal pages will still work and point back to the original articles from when they were first posted.

Components, Programming Method

An App Inventor recommended way of handling multiple similar screens

Leave a comment

MIT App Inventor supports apps having multiple screens, but due to the way that App Inventor is implemented, they recommend that apps have no more than 10 screens total – or risk running out of memory or seeing the Blocks editor crash or hang!

They have a page of information about this issue and you should look at that if you are writing an app with more than about 10 screens.

They suggest it may be possible to simulate multiple screens using just one extra screen, depending on the application. They provide hints as to how to do those hints may be insufficient for new App Inventor programmers.

A reader asked for help on this so I created this tutorial.

Since this app has two screens, this tutorial is split into two sections, one for each screen, and then a third section discussing optional modifications.

The basic app is called ManyScreens. The optional modifications are in ManyScreens2_Buttons (source code links at end of this post)

User View

This demonstration app features 4 buttons – the first button displays “Screen 1”, the second button displays “Screen 2” and so on. These buttons could have any label on them appropriate for your application, such as “Register Account”, “Reserve a space”, “Display reservations” or what ever make sense for your app.

Pressing Screen 1 displays this screen – note the label at the top and the photo on the page.

This screen appears when pressing Screen 3. Note that the text label references Screen 3.

The button Do Something! is a placeholder for adding code to do something unique for this screen. For this application all it does is close the screen and return to the main app screen, Screen1.

Continue reading An App Inventor recommended way of handling multiple similar screens →

Components, Programming Method, Tips

How to center an image on the screen using App Inventor

Leave a comment

A reader asked, “How can I center an image on the screen in an App Inventor app?”

There is an easy way to do this and there is a more complicated method (using the Canvas and other graphics objects). In this tutorial, we show the easy way to center an image on screen!

Our app uses the camera to take a photo and then displays that photo on screen. A secondary feature of the app demonstrates how the “image object” in App Inventor is the filename where the image is stored. In this way, the “image object” can be stored in TinyDB – its not really the binary data representing the photo or image – it is, in fact, just the filename. (TinyDB only stores text).

User Interface View

To demonstrate image centering, we use the camera to take a photo (creating the image) and then a Show pictures button to display the image on screen.

When you press Take a picture, the app launches the Android camera app to take the photo. When done taking the photo, click on the “check mark” (as it appears on my Android 7 phone) at upper right of the screen. The camera app returns to our app, which displays the file name and location on our Android device where the JPG image file has been stored.

Press “Show pictures” to display the photo. The default image size is small – but centered! We will see how to show the photo at a larger size.

Designer View

Continue reading How to center an image on the screen using App Inventor →

Components, Programming Method, Tips

Can App Inventor have a button or control that rotates on screen?

Leave a comment

A reader asked: Is there is a way to have a control, such as a button, rotate on the screen?

With a simple trick, the answer is Yes!

The trick is to use ImageSprites that are made to look like buttons. Then, instead of .Click event handler, as used on a Button, we use one of the “touch” events defined for the ImageSprite class. To rotate the sprite, change the sprite’s Heading property. Easy!

If you would like to learn more about ImageSprites, please read my online tutorial “Using ImageSprites for animated App Inventor Graphics”.

I’ve also written an inexpensive 227 page e-book all about graphics, animation and charts available from many online e-book outlets. You may find that text helpful to you as well.

Tutorial Video

The tutorial is shown here as a video – or page down for a written version of the tutorial.

User View

Watch this video to see what a rotating button looks like:

Designer View

Creating the user interface is the same as creating other App Inventor user interfaces – except we use a graphical drawing area called the Canvas and add an ImageSprite to the Canvas.

Continue reading Can App Inventor have a button or control that rotates on screen? →

The quick and easy way to write Android Apps