Smart At­ten­dance Reg­is­ter in App In­ven­tor 2

App In­ven­tor is a vis­ual block-build­ing lan­guage for cre­at­ing An­droid apps. Over the past few months, we have been de­vel­op­ing sim­ple An­droid apps through a se­ries of ar­ti­cles, each cov­er­ing a par­tic­u­lar as­pect of App In­ven­tor. Read on for the lat­est ad­dit

OpenSource For You - - Contents -

An­droid de­vices are be­gin­ning to play a larger role in our lives. Whether it is ac­cess­ing en­ter­tain­ment web­sites, net­work­ing on so­cial me­dia, watch­ing videos over the In­ter­net, chat­ting with rel­a­tives, mak­ing reser­va­tions/book­ings or per­form­ing bank­ing trans­ac­tions, An­droid has be­come a cru­cial need.

Tech en­thu­si­asts like you keep think­ing up ways to make An­droid even smarter by de­vel­op­ing use­ful apps. App In­ven­tor is a great tool for this pur­pose. So let’s pro­ceed in our quest of mas­ter­ing App In­ven­tor by cre­at­ing a more com­plex and use­ful An­droid ap­pli­ca­tion.

The theme of the ap­pli­ca­tion

Tak­ing at­ten­dance is a teacher’s first task. The class at­ten­dance reg­is­ter and pen are the only tools to ac­com­plish this task. What if we pro­vide a dig­i­tal so­lu­tion to han­dle this task? Sounds in­ter­est­ing, right? So let’s try to build a smart at­ten­dance reg­is­ter for our class so that the teacher need not note these de­tails on a piece of pa­per and then up­date them onto computers.

Our ap­pli­ca­tion will be smart enough to cap­ture at­ten­dance and up­date the records on the data­base, which will be per­sis­tent till we wish to clear it.

In an ear­lier tu­to­rial on App In­ven­tor, we had ex­plored how to cre­ate a Web data­base us­ing an open source cloud en­abled Fire­base data­base. In this tu­to­rial, we will use all the ex­per­tise we’ve acquired to de­liver a fully work­ing ap­pli­ca­tion.

For those who’ve missed the last tu­to­rial, I would like to re­vise things quickly. In our ap­pli­ca­tion we are go­ing to use Fire­base, a Google pro­vided cloud data­base, which is open source and freely avail­able for use.

Fea­tures of Fire­base

1. Fire­base uses a GUI based data cen­tre so that you can vis­ually see all the en­tries and can man­age them.

2. Be­ing on the cloud, it is ac­ces­si­ble to any de­vice, on the go.

3. Smart au­then­ti­ca­tion pro­vides se­cure ac­cess.

4. Its real-time data­base re­flects changes as soon as the data is up­dated.

5. It al­lows the ad­di­tion of col­lab­o­ra­tors so that mul­ti­ple peo­ple can man­age the data­base. 6. No cod­ing is re­quired for fetch­ing and stor­ing data.

Cre­at­ing a project in the Fire­base data­base

1. To use Fire­base, you must have a work­ing Google ac­count. The same will be needed to run App In­ven­tor.

2. Type https://con­­ com/ in the ad­dress bar of the browser you are us­ing and hit En­ter. 3. If asked for lo­gin cre­den­tials, give your Google ac­count cre­den­tials and pro­ceed.

4. Fol­low the on-screen instructions which are gen­er­ally about ac­cept­ing the terms of us­age, etc.

5. Once ev­ery­thing is done, you will

see the screen shown in Fig­ure 1.

6. Click on ‘Cre­ate New Project’.

7. Give the name of the project and spec­ify the coun­try/re­gion, as shown in Fig­ure 2.

8. Once your project is cre­ated, you will see the dash­board of your ap­pli­ca­tion. It will be sim­i­lar to that dis­played in Fig­ure 3.

9. Now se­lect Data­base from the left-hand pal­ette and then ‘Rules’ from the next page, which will dis­play some­thing like what’s shown in Fig­ure 4.

10. This time, we want to give all users ac­cess of the data­base; hence, we need to change the rules. You can man­u­ally do this by typ­ing val­ues as shown in Fig­ure 5. Once done, click on the Pub­lish but­ton.

So you have now suc­cess­fully cre­ated an empty space for your project in the Fire­base data­base, and given read and write per­mis­sions to all the users who have the URL.

If you are new to this An­droid jour­ney, do go through a few of the ar­ti­cles in this se­ries, tar­geted at be­gin­ners, to fa­mil­iarise your­self with App In­ven­tor.

GUI re­quire­ments

For ev­ery ap­pli­ca­tion, we have a graph­i­cal user in­ter­face or GUI, which helps the user to in­ter­act with the on-screen components. How each com­po­nent re­sponds to user ac­tions is de­fined in the block edi­tor sec­tion. In this ap­pli­ca­tion, we will have mul­ti­ple screens and will de­fine the look and feel for each of them.

There are two GUI screens and their names are:

1. Screen1

2. Stu­den­tAd­dScreen

Fig­ure 1: Fire­base dash­board

Fig­ure 4: Read­ing and writ­ing rules with au­then­ti­ca­tion

Fig­ure 3: Demo project in the Fire­base dash­board

Fig­ure 5: Rules with read and write per­mis­sions

Fig­ure 2: Cre­ate a new project

Newspapers in English

Newspapers from India

© PressReader. All rights reserved.