152 lines
9.8 KiB
Plaintext
152 lines
9.8 KiB
Plaintext
|
|
Episode: 2191
|
||
|
|
Title: HPR2191: Building a Soundboard Android App with App Inventor
|
||
|
|
Source: https://hub.hackerpublicradio.org/ccdn.php?filename=/eps/hpr2191/hpr2191.mp3
|
||
|
|
Transcribed: 2025-10-18 15:30:24
|
||
|
|
|
||
|
|
---
|
||
|
|
|
||
|
|
This is HPR episode 2191 entitled, Building a Soundboard Android App with App Inventor.
|
||
|
|
It is hosted by Groups and is about 10 minutes long and carrying a clean flag.
|
||
|
|
The summary is, Groups walks us through how to build Android Apps with App Inventor and Lock Based Language.
|
||
|
|
This episode of HPR is brought to you by an Honesthost.com.
|
||
|
|
Get 15% discount on all shared hosting with the offer code HPR15.
|
||
|
|
That's HPR15.
|
||
|
|
Better web hosting that's Honest and Fair at An Honesthost.com.
|
||
|
|
Welcome to HPR, this is Groups.
|
||
|
|
Today we're going to be using App Inventor to make Android Apps.
|
||
|
|
I have a Kindle Fire and my Samsung phone and they're both running Android and we're
|
||
|
|
going to make some apps for them.
|
||
|
|
Now since this is HPR we're going to do something with noise and we're going to make a soundboard.
|
||
|
|
And a soundboard is just simply some buttons that you can press to play noises.
|
||
|
|
And since I'm classy I'm going to use fart noises.
|
||
|
|
Also my children love this and I help them to build an app like this recently with a
|
||
|
|
picture of my really good friend and when you press the picture of my really good friend
|
||
|
|
it plays awesome fart noises.
|
||
|
|
This is a really cool app and App Inventor I used a lot in my junior high classes so that
|
||
|
|
we can build cool things really easily, really quickly with kind of the basics of programming
|
||
|
|
but it's graphical, it's web based and it kind of makes it easy to have ideas and then
|
||
|
|
make something with them.
|
||
|
|
So we've got App Inventor pulled up, or AppInventor.mit.edu and on my phone I have MIT AI2 companion
|
||
|
|
installed which allows me to install the apps on my Android device or you could just
|
||
|
|
have a QR reader and do it that way or you can download the APK and install it.
|
||
|
|
There's lots of ways to do it but the MIT AI2 companion is really easy.
|
||
|
|
So go ahead and install that on your phone and go to AppInventor create an account and
|
||
|
|
let's get started.
|
||
|
|
I have some pictures on the HPR website, there's some screenshots of the soundboard so that
|
||
|
|
you can kind of walk through it with us.
|
||
|
|
Now when you open up AppInventor and you create a new app, I'm calling mine, HPR Soundboard,
|
||
|
|
it shows kind of a mock up of the Android screen that shows your palette over to the
|
||
|
|
left with buttons and check boxes and date pickers and images and things you can throw
|
||
|
|
in there.
|
||
|
|
When you drag, for example, button into your viewer, it will show up under Components
|
||
|
|
so you can select it and there's properties overhead over on the right.
|
||
|
|
So the first thing that we're going to do, we open this thing up, is we're going to create
|
||
|
|
two buttons.
|
||
|
|
You can have as many buttons as you want, you can lay out this thing however you want.
|
||
|
|
We're going to make it kind of simple.
|
||
|
|
So I'm going to drag a button over and it will put a button on the viewer that says
|
||
|
|
Text for button 1, button doesn't do anything, I'm going to drag another button over and
|
||
|
|
do the same, you know, look the same.
|
||
|
|
Next, I'm going to change the height in the width and I'm going to change them both to
|
||
|
|
fill parent because I'm a lazy designer and that will fill the screen.
|
||
|
|
Now it won't fill it by height but it will totally fill it by width.
|
||
|
|
You have to add some more of the layout tools if you want to change it to fill by height.
|
||
|
|
I go ahead and change that and then you can change, this is all in the properties section.
|
||
|
|
You can change the text and I've changed the first one to fart, the first button to fart
|
||
|
|
and the second button to just other noise.
|
||
|
|
Now I need to add some sounds.
|
||
|
|
There's a media section where you can click upload files but we're not going to get to
|
||
|
|
that first.
|
||
|
|
We're going to go into the palette and go down to media where there's camcorder options
|
||
|
|
or camera options or image picker.
|
||
|
|
We're going to pick sound and I'm going to drag two sounds into the viewer and they will
|
||
|
|
not show up on the viewer but they will show up below it where it says non visible components.
|
||
|
|
Now I have to add two sounds because I'm playing two different sounds and this is simply
|
||
|
|
a variable that's going to or an object that's going to hold information about your sound.
|
||
|
|
So I'm going to drag both the sounds in and then we are going to and the properties for
|
||
|
|
the sound once it's selected.
|
||
|
|
You can select it in the viewer.
|
||
|
|
You can select it on components.
|
||
|
|
I'm going to click on source and upload file and I have a large collection of fart and
|
||
|
|
B3s apparently and so I'm going to click upload file.
|
||
|
|
I'm going to navigate to my fart sound and hit OK.
|
||
|
|
Now I've gotten one sound uploaded.
|
||
|
|
I've got my two buttons.
|
||
|
|
Let's go drag some code.
|
||
|
|
So in the upper right hand side you'll notice that there's two buttons.
|
||
|
|
One says designer, one says blocks.
|
||
|
|
I'm going to go from designer which is the currently selected one to blocks and this
|
||
|
|
allows me to add my code for what my app is going to do.
|
||
|
|
So when I click on the, excuse me, when I click on the blocks button, it brings me to
|
||
|
|
the blocks page.
|
||
|
|
I'm going to scroll down the blocks section to screen one which is my main screen.
|
||
|
|
I'm going to select button one and it will pop up some code blocks that I can drag
|
||
|
|
over for my button.
|
||
|
|
There's lots of options.
|
||
|
|
You can have it if it loses focus or if you touch up or if it gets focus or if it clicks.
|
||
|
|
So I'm going to obviously just check click and I'm going to drag that over and it's a
|
||
|
|
little block that says when button one dot click do and there's kind of like a mouth
|
||
|
|
and the mouth holds other code.
|
||
|
|
So then I'm going to click on sound one and I'm going to drag over two blocks.
|
||
|
|
One block for call sound one dot stop and one for call sound one dot play.
|
||
|
|
Now the stop button is not required or the stop block is not required but you're going
|
||
|
|
to have a lot of noises playing over each other if you press a bunch of buttons at the
|
||
|
|
same time.
|
||
|
|
So I like to call that sound to stop.
|
||
|
|
Now if we were doing this much more, you know, proficiently we would create a procedure
|
||
|
|
called stop all sounds and we would put all the sounds dot stop into it so that I could
|
||
|
|
have 10 buttons and then call that procedure when every button is clicked to stop all the
|
||
|
|
other sounds from playing.
|
||
|
|
But we're just making a simple little app totally want you to play with this and get
|
||
|
|
there.
|
||
|
|
All right.
|
||
|
|
So I've got my sound to stop I've got my sound to play.
|
||
|
|
I'm going to click back over to the designer view, take a look at my app.
|
||
|
|
Now I want to make this thing, you know, uber professional.
|
||
|
|
So I'm going to click on icon in the property section for screen one and I'm going to choose
|
||
|
|
an icon to upload and this would be the icon for the app.
|
||
|
|
So I've I've done that.
|
||
|
|
I'm ready to test my app and I'm going to click up on build at the very top which provides
|
||
|
|
a drop down where I can get a QR code for the APK or I can just save the APK to my computer.
|
||
|
|
I'm going to click provide QR code which will generate a little build the app then it
|
||
|
|
will generate a QR code and that QR code lets me open up my AI2 companion and or just
|
||
|
|
any QR code reader and scan it.
|
||
|
|
And then once it's scanned my phone will say, oh no, what's this?
|
||
|
|
Once this is trying to install and you have to go and enable to install this one, you
|
||
|
|
know, package and then hit run and then you have an app and I've got an app that I just
|
||
|
|
wrote that short amount of time that's on my phone that plays the fart noise and that's
|
||
|
|
great.
|
||
|
|
And so that when I'm recording HPR I can totally add in my sounds or what I'm making
|
||
|
|
my own podcast or if I'm just really amusing my children, I can play these fart noises
|
||
|
|
and it's just great stuff.
|
||
|
|
My kids love playing with the soundboard and when you're learning to code you can either
|
||
|
|
be real old school with it and learn the fundamentals of it and type a bunch of text
|
||
|
|
in them and but when you're a kid that's not exciting like, ooh I access the database
|
||
|
|
or ooh I add it to numbers together.
|
||
|
|
But having something physical like these apps is really fun to do that.
|
||
|
|
My daughter is really getting into scratch which is very similar to this, it doesn't
|
||
|
|
make apps, it makes little animation games but it's block based and we can hook our
|
||
|
|
little bits into it and we've got a little Arduino for the little bits and now we can
|
||
|
|
interface with stuff we build with our little bits into scratch and it's cool and I can
|
||
|
|
build these little apps for them and they're having just the best time kind of learning
|
||
|
|
about computer science and logically thinking through things like I don't know block based
|
||
|
|
languages I wouldn't use it professionally but it's really easy for kids or for someone
|
||
|
|
who's learning to code to kind of come into the fold with it.
|
||
|
|
Anyway so I've got my fart app, I'm going to go play with my fart noises, an advanced
|
||
|
|
fart app that we made has a timer and so you click it and then 10 seconds later it
|
||
|
|
farts and so the kids will take my phone and they will go put it behind somebody, click
|
||
|
|
the button and then talk to them until there's a noise behind them, I guess I have a sound
|
||
|
|
board, I don't have to make the fart noise by hand and then they have a joke that it's
|
||
|
|
really easy to make the app when people ask them where they got it and that they wrote
|
||
|
|
it but the hard part was recording the fart noises.
|
||
|
|
You've been listening to Hacker Public Radio at HackerPublicRadio.org.
|
||
|
|
We are a community podcast network that releases shows every weekday Monday through Friday.
|
||
|
|
Today's show, like all our shows, was contributed by an HBR listener like yourself if you ever
|
||
|
|
thought of recording a podcast then click on our contributing to find out how easy it
|
||
|
|
really is.
|
||
|
|
Hacker Public Radio was founded by the digital dog pound and the infonomicom computer club
|
||
|
|
and is part of the binary revolution at binrev.com.
|
||
|
|
If you have comments on today's show please email the host directly leave a comment on
|
||
|
|
the website or record a follow-up episode yourself unless otherwise status, today's show
|
||
|
|
is released on the creative comments, attribution, share a live 3.0 license.
|