Create Android Simple Music Player With Admob Kodular / App Inventor

Hi Everyone, this tutorial will show you how to use admob component to monetize your android application Kodular. Lets create simple music player with admob components

Components

Here is the list of components

  • List View
  • Card View
  • Text Label
  • Slider
  • Button
  • Clock
  • Exo Player
  • Admob

Layouts

Drag the List View component to screen, this component will use to showing the list of songs. Upload mp3 file to assets.

Find the mp3 files, and make sure the size is not to big. Maybe below 1mb.

In List View component Properties, find the Element from String Property, insert value, this is for the song name or track name, to make it more than 1 separate it with comma, for example “Track 1, Track 2, Track 3” etc.

Drag the Card View to screen, then drag the Label, Slider and Button into Card View.

Drag the Admob Banner, to use the Admob banner, you must create the admob account here https://admob.google.com/home/ after register, create the new App ID for your app, create Banner ID and Interestial Ads, after that you will get the ad unit id.

Monetization Components

Now for the Player drag the Exo Player Components, this component will be use for playing the mp3 files.

Here is the Ad unit, change the Ad unit with your Ad unit Id, enable the test mode, so we can test if the admob will showing the ads.

Blocks

Intialize Blocks & Load Ad

Block Convert Milliseconds to Timestamp

Block Selected Song

Timer Interval Update Duration label and slider position.

All Blocks

How it works

  1. Declaring variable for storing mp3 file names, duration of the music.
  2. The purple block are a function to showing the duration of music files like this “1:30” and it will showing in the label, the duration exo player in milliseconds and we need to convert into seconds and minutes.
  3. When initialize load the banner ad
  4. List view After picking event /click, it will play the mp3 files based on the selected index.
  5. Clock timer interval are used for updating the label of time stamp and the slider based on duration of music. The interval running at 1000 ms, or 1 seconds.

LIVE TESTing

Test your app in the companion, select the song and you will see the music playing and it will show the interestial ads and banner.

Download the AIA here and the Demo APK. See you in the next post!

3 thoughts on “Create Android Simple Music Player With Admob Kodular / App Inventor

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s