Tag Archives: responsive design

Components, Programming Method

Example of the new App Inventor “Responsive Design” Feature

2 Comments

MIT App Inventor introduced today their new “responsive design” features so that apps can work “better” on different sized screens. Using these new features, you can create a single app that should run on both a smart phone and a tablet, yet still display proportional user interface controls. Prior to this, your nicely designed smart phone app could end up having very small buttons or text boxes when run on a tablet; now, these components will resize as needed.

The name “responsive” comes from the ability of the app to “respond” to the size of the device and to change the size of controls so they maintain a similar size on each device. The terminology “responsive web design” also refers to web sites that are designed to work with different sized mobile device screens – here is a link to a great article about responsive web site design, passed to us by reader David – thanks!

Continue reading Example of the new App Inventor “Responsive Design” Feature →

App Inventor News, Components, Documentation

App Inventor to add “Responsive Design” features next week

8 Comments

MIT App Inventor upgrade coming next Monday – the upgrade will support apps running on devices with different size screens, such as a smart phone versus a tablet.

There’s one important rule when using App Inventor to create apps with responsive design:

Specify widths and heights of components as percentages of the screen width and height, rather than as fixed numbers of pixels.

For example, to make a button whose width is half the screen width, set the button’s width to be 50 percent rather than setting it to a specific number of pixels.

See Responsive Design in App Inventor

Please see the link for details on this upcoming change.

Apps written in Java and the Android SDK have access to additional methods of creating flexible design layouts, or even multiple layouts, for different screen sizes.