Android Development for Beginners 13

App Inventor Video Tutorial 13In this part of my App Inventor video tutorial I pretty much finish the Android Weather app. I cover how to create a dynamic interface, pull data from a web service, work with colors and cover logic in App Inventor. This is basically a large review of everything I have covered while making my Android Weather app in App Inventor here.

All of the settings for the Design View and all the blocks used follow the video below.

If you like videos like this, it helps to tell Google Plus with a click here

Link to the Google Maps page that supplies latitude and longitude.

Download the Android Weather App

I’m not completely finished with the app, but because I received a request you can download the APK here. Feel free to do what ever you’d like with it.

App Inventor Weather App Blocks

Click the image below to view it full screen

App Inventor Weather App Blocks

App Inventor Weather App Design View Settings

Screen1 : Screen Orientation – Portrait

HorizontalArrangement1 : Width – Fill Parent
Image1 : Picture – TransparentPadding : Width – 15 px : Height – 22 px
CityTextBox : Fontsize – 11 : Hint – Enter City : Width – 256 px : Height – 30px
SearchButton : Image – SearchButton : Width – 37 px : Height – 30 px

HorizontalArrangement2 : Width – Fill Parent : Height – 4 px

HorizontalArrangement3 : Width – Fill Parent : Height – 22 px
Image2 : Picture – TransparentPadding : Width – 15 px : Height – Automatic
CityNameLabel : FontSize – 20 : Text – Pittsburgh : Width – Fill : Height – 22 px

HorizontalArrangement5 : Width – Fill Parent : Height – Automatic
Image3 (Margin) : Picture – None : Width – 15 px

TableArrangement1 : Column – 1 : Rows – 2 : Width – 167 px
CurrentTempLabel : FontSize – 48 : Text – 37˚
CurrentWeatherLabel : FontSize – 16 : Text – Chance Rain

Large Weather Image
HorizontalArrangement6 : Width – 107 px
CurrentWeatherIconImage : Picture – Rain.png

HorizontalArrangement8 : Width – Fill Parent : Height – 6 px

HorizontalArrangement7 : Width – Fill Parent
Image4 : Width – 15 px
CurrentWeatherReportLabel : FontSize – 14 : Text – Copy / Paste : Width – Fill

HorizontalArrangement10 : Width – Fill Parent : Height – 6 px

HorizontalArrangement9 : Width – Fill Parent : Height – 10 px
Image5 : Picture – TransparentPadding : Width – 15 px
DividingBar1Label : FontSize – 14 : Width – 290 px : Height – 4 px

HorizontalArrangement11 : Width – Fill Parent : Height – 6 px

TableArrangement2 : Column – 13 : Rows – 1 : Width – Fill Parent
Image6 : Picture – None : Width – 22 px
Image7 : Picture – LowTemp : Width – 12 px
Label1 : FontSize – 14 : Width – 19 px
CurrentLowLabel : FontSize – 14 : Text – 19˚ : Width – 43 px
Image8 : Picture – DewPoint : Width – 12 px
Label3 : FontSize – 14 : Width – 19 px
CurrentDewPointLabel : FontSize – 14 : Text – 22 : Width – 36 px
Image9 : Picture – WindChill : Width – 17 px
Label5 : FontSize – 14 : Width – 20 px
CurrentWindChillLabel : FontSize – 14 : Text – 27 : Width – 37 px
Image10 : Picture – Visibility : Width – 20 px
Label7 : FontSize – 14 : Width – 10 px
CurrentVisibilityLabel : FontSize – 14 : Text – 7.00 : Width – 42 px

HorizontalArrangement12 : Width – Fill Parent : Height – 6 px

TableArrangement3 : Column – 13 : Rows – 1 : Width – Fill Parent
Image11 : Picture – None : Width – 22 px
Image12 : Picture – LowTemp : Width – 12 px
Label8 : FontSize – 14 : Width – 19 px
CurrentHighLabel : FontSize – 14 : Text – 19˚ : Width – 43 px
Image13 : Picture – DewPoint : Width – 12 px
Label9 : FontSize – 14 : Width – 19 px
CurrentHumidityLabel : FontSize – 14 : Text – 22 : Width – 36 px
Image14 : Picture – WindChill : Width – 17 px
Label11 : FontSize – 14 : Width – 20 px
CurrentWindSpeedLabel : FontSize – 14 : Text – 27 : Width – 37 px
Image15 : Picture – Visibility : Width – 20 px
Label14 : FontSize – 14 : Width – 10 px
WindDirectionLabel : FontSize – 14 : Text – 7.00 : Width – 42 px

HorizontalArrangement13 : Width – Fill Parent : Height – 10 px

HorizontalArrangement14 : Width – Fill Parent : Height – 10 px
Image16 : Picture – Transparent : Width – 15 px
DividingBar2Label : FontSize – 14 : Width – 290 px : Height – 4 px

________NEW_________

HorizontalArrangement15 : Width – Fill Parent : Height – 6 px

TableArrangement4 : Columns – 10 : Rows – 1 : Width – Fill
Label15 : Width – 15 px
NextWeatherPeriodLabel : FontBold : FontSize – 16 : Text – Tonight : Width – 114
NextWeatherPeriodImage : Picture – CloudyNight : Width – 30 : Height – 26
Label16 : Width – 24
NextWeatherPeriodLowImage : Picture – LowTemp : Width – 12
Label17 : Width – 5
NextWeatherPeriodLowLabel : Text – 19˚ : Width – 36
NextWeatherPeriodHighImage : Picture – HighTemp : Width – 12
Label19 : Width – 5
NextWeatherPeriodHighLabel : Text – 38˚

HorizontalArrangement16 : Width – Fill : Height – 9

HorizontalArrangement17 : Width – Fill
Label21 : Width – 15
NextWeatherPeriodDescLabel : Width – 284 : Text – Copy & Paste

HorizontalArrangement18 : Width – Fill : Height – 9

TableArrangement5 : Columns – 10 : Row – 1 : Width – Fill
Label22 : Width – 15
LastWeatherPeriodLabel : FontBold : FontSize – 16 : Text – Tomorrow : Width – 114
LastWeatherPeriodImage : Picture – CloudyDay : Width – 30 : Height – 26
Label23 : Width – 24
LastWeatherPeriodLowImage : Picture – LowTemp : Width – 12
Label24 : Width – 5
LastWeatherPeriodLowLabel : Text – 19˚ : Width – 36
LastWeatherPeriodHighImage : Picture – HighTemp : Width – 12
Label25 : Width – 5
LastWeatherPeriodHighLabel : Text – 38˚

HorizontalArrangement19 : Width – Fill : Height – 9

HorizontalArrangement20 : Width – Fill
Label26 : Width – 15
LastWeatherPeriodDescLabel : Text – Copy & Paste : Width – 284

HorizontalArrangement21 : Width – Fill : Height – 9

4 Responses to “Android Development for Beginners 13”

  1. Moshe says:

    I have already commented that I miss an easy way to document the program (on your sixth part of this series). How did you create this documentation? I assume in a hard way. Keep up the excellent work. I enjoy it very much

  2. Hairs says:

    Do you have any tutorials relate to google api like find the location where the person and if it is new location for app give msg to user do you want to save it and update the database of app..its like a an app which give the information to user about location where he or she wants to visit to resive sit for them before moving there if no sit available they move to next place and app gives them msg new location found of their interest do you want to save

Leave a Reply

Your email address will not be published.

Google+