Components, Programming Method, Tips

Can you “gray out” a button until data entry is complete?

5 Comments

A reader asked  if it might be possible to “gray out” a button so that pressing it has no action, until appropriate data has been entered?

The answer is “Yes, we can do this.” After some thought, I came up with the following simple solution.

Update 1: Check the comments to this post for a reader’s great solution for doing this for Location services dependent function.

Update 2: Also, you can set the button component’s Enabled property to false, so that the button will not function. Then set Enabled to true once the data entry meets your app’s requirements.

User Interface

What we want to do is have the button look like it is “grayed out” and unusable until after some data is entered into the field. In the text box, I have set the  “hint” value to “Button available when data entered”:

Screenshot_20160317-202312After the user has entered some data, the button becomes “active” as shown here:

Screenshot_20160317-202334

Continue reading Can you “gray out” a button until data entry is complete? →

App Inventor News

Thunkable turns programming into a drag-and-drop solution – based on App Inventor

3 Comments

Thunkable is a spin off of the MIT App Inventor project. If you can program in App Inventor, you can program in Thunkable. Their goal is to get the App Inventor concept running on both Android and iOS (iPhone).

Visit Thunkable at http://thunkable.com

Thunkable, built on top of the open-source project MIT App Inventor, is a visual programming tool

Source: Thunkable turns programming into a drag-and-drop solution – SD Times

There are indications that MIT App Inventor will focus on education and training applications and that spin offs will offer more powerful (and likely complex) features such as increased database functionality or media handling. These new features, oriented perhaps towards businesses and organizations (rather than education) might become a subscription service – but with added value in terms of features and capabilities.

Documentation, General

More stuff coming soon …

6 Comments

Each week the past 3 weeks I thought I was going to have time to put together some new tutorials and post them, but “stuff happens” and I have not had time. I have a great list of tutorial suggestions that have come from readers and I really want to work on them and get them posted!

Sorry for the long delay!

In other news, I have completed the writing of Volume 4 of my App Inventor tutorial guide books. The book is now undergoing proof reading and final formatting. I hope to have it available as both an e-book and as a printed book.  I can now announce the title of the book “App Inventor: Graphics, Animation and Charts”. More details including a table of contents and sample pages as we get closer to release!

General

Update on FB – website link and Volume 4 App Inventor Guide

7 Comments

Facebook – Web site link

Short update – my web site at http://appinventor.pevest.com was linked directly to FB so that comments entered here, appeared there, and comments entered on the web site, appeared here on Facebook. All automatically.

However, that link is now broken. I was using a WordPress plugin to cross link the web site and FB page but last week, the makers of the plugin discontinued its use and the cross linking is no longer working. Hopefully I can find a new plugin to perform that function!

It was a nice to have feature as I could just check for updates on the web site without having to also check on FB. Oops! Now that this feature is gone, I will try to check the FB page more frequently.

Volume 4 Update

Volume 4 of my App Inventor guides is nearing completion. I have to write one last demo program,  the  text for one chapter, proof read the entire text, and begin the publishing process. I will announce the book topic once I get the final chapter written (I prefer not to pre-announce until I know the availability). I can announce now that Volume 4 should be available in both print and e-book formats! Producing the print version adds a little delay to the final release but the final result should be very good.

UPDATE: Sales of the print version of Volume 4 are being discontinued as of October 18, 2016, due to rampant copyright theft. There are more used copies for sale than the total number of printed books actually sold. Based on sales, readers prefer the e-book version – therefore I am in process of discontinuing sales of the print version. The e-book continues to be available.

Components, Programming Method, STEM Education

A “switch board” user interface panel for App Inventor apps

4 Comments

In the last post, we introduced some concepts for building “creative” App Inventor user interfaces that feature visually appealing user interface controls rather than the usual bland buttons.

In this post, we look at creating an array of toggle switches. Tapping a switch flips the switch from left to right, or right to left.

Concepts

In developing this user interface, we learn two concepts:

  1. We expand on the previous post and its use of images to create custom buttons.
  2. We see how a user interface control can be stored in a list and referenced like a variable within our apps.

Source code:

The User Interface

I called my app “Mission Control” because any good mission control panel needs lots of switches!

The user interface features 9 toggle switches in a 3 x 3 array. The purpose of this app is to demonstrate how to implement this type of interface – the app does not otherwise do anything interesting.

Tapping any toggle switch causes the switch lever to move to the other side of the switch. Here is a screen shot showing some toggle switches to the left and some to the right.

Screenshot_20160204-140323The Designer View

Continue reading A “switch board” user interface panel for App Inventor apps →

Android Development, Components, Programming Method, STEM Education, User Interface/Design

Making “pretty” App Inventor user interface controls

7 Comments

In the real world, “user interfaces” look like electric light switches, push buttons or control knobs, temperature dials on ovens, volume controls on radios and so forth. We can mimic these types of controls for our touch screen Android apps. We do not have to rely on the boring desktop-like clickable button or checkboxes in the App Inventor user interface palette.

A previous tutorial showed a trick to make the color of a button vary continuously. This tutorial shows how to use our own images, instead of the boring button, together with a bit of code to bring these buttons to life.

User Interface View

Below is a sample “toggle switch”. Press the switch icon once and the toggle moves to the right; press it again and the toggle moves back to the left.

toggleswitch1

toggleswitch2

Here is a slide switch. Press the slide switch once and the switch position moves to the right and the switch illuminates in green. Press the slide switch again and the switch returns to the left.

switch1

switch3

Here is a concept for a raised momentary push button. Pressing the button changes the appearance of the button while your finger is on the button – to look like the button is pressed in.

UI1

UI2

The Designer View

Continue reading Making “pretty” App Inventor user interface controls →

Learn to program with App Inventor