Doodle App in MIT App Inventor

Hello friends and welcome to Obsidian Soft.

In this tutorial, I will teach you how to make a basic doodle app with sharing feature. You can share your doodles with friends and family using WhatsApp, email, or even post them on Facebook or Instagram.

Start a new project and call it ShareDoodleApp.

Go to media and upload square-size images that will serve as background for eraser, pencil, new doodle, and share doodle buttons.

I am using these images:

https://www.flaticon.com/free-icons/eraser https://www.flaticon.com/free-icons/share https://www.flaticon.com/free-icons/pencil https://www.flaticon.com/free-icons/blank-page

After uploading media, go to screen1 properties and make the screen orientation portrait. Drag and drop a Canvas from Drawing and Animation. For the canvas1 properties, make the background color yellow,  height 80%, width fill parent, line width: 4.0, and paint color black.

Drag and drop a Horizontal Arrangement from the Layout and put it below the canvas. Make height 15% and width fill parent. Make align horizontal and align vertical center and make background-color: white.

Drag and drop a Button from User Interface inside the horizontal arrangement. Rename to eraserBtn and make height and width 50 pixels. Choose the uploaded eraser image as the Image property and make the text property empty.

Duplicate eraserBtn by selecting it and pressing Ctrl + C and Ctrl + V for Windows OR Command + C and Command + V for MacOS.

Rename to pencilBtn and change the image property to pencil image.

Duplicate pencilBtn and rename to clearBtn and change image property to new doodle image.

Duplicate clearBtn and rename to shareBtn and change image property to share doodle image.

From the Social palette, drag and drop a Sharing component.

Screen Design is done so let’s go to the blocks section. 

When someone drags his/her finger on the screen, canvas’s Dragged event is triggered so drag and drop that from canvas1 and use canvas’s drawLine procedure to draw a line from the previous position to the current position.



When someone just touches the canvas, we only want to draw a circle there so get canvas’s
Touched event and call canvas.DrawCircle at x and y with radius 2.

When eraserBtn is clicked, we are just going to change the canvas’s paint color to canvas’s background color however this doesn’t work for iPhones so to make sure that it works even for iPhones, use the actual color block for the color that you have chosen for canvas’s background.

When the pencilbtn is clicked, change the paint color to black.

When the clearBtn is clicked, just clear the canvas so that a new doodle can be done but also reset the paint color back to black.


When the shareBtn is clicked, just share the file returned by canvas’s Save procedure.

This simple doodle app with sharing feature is done. You can refine it further by adding color buttons or even a color palette by following my previous tutorials on making drawing apps.

🎨 Paint App with Color Buttons: https://youtu.be/prmTeD0cacw Paint App with Color picker/ color palette feature: https://youtu.be/6lFi7jCDBek


You can have a look at the video tutorial for Doodle App here:

Please like my videos and share them with your friends and family. Also, subscribe to my channel and press the bell icon so you don't miss any of the great projects I have planned for you.


Please like my Facebook page and Instagram page for more educational resources and tips.

Pinterest:
https://www.pinterest.co.uk/obsidiansoft/_created/
For links to free educational apps, have a look at the educational apps page

Comments

Post a Comment

Popular posts from this blog

Jolly Phonics Group 1

Image
Free Jolly Phonics Group 1 worksheets (s, a, t, i, p, n) According to Oxford Dictionary, phonics is a "method of teaching people to read by correlating sounds with symbols in an alphabetic writing system". In simple words, each letter of the alphabet has a sound. Instead of teaching young children the names of these alphabets, the sounds are taught. For example "a" makes the sound /a/...this is exactly the sound that comes from your mouth in the beginning when you say the word " apple " or " ant ". The letter "a" makes a different sound in words like " arm " and " ate " but these rules are taught later.  Jolly Phonics is a synthetic phonics system where all the letters of the alphabet have been split into seven groups. Each group contains 6 letters or their combinations so a total of 42 sounds are taught. What do I mean by a combination of letters? Remember that the combination of letters "s" and "h&
Read more

Jolly Phonics Group 2

Image
Free Jolly Phonics Group 2 worksheets (c/k, e, h, r, m, d) Hello Friends, I am back with another set of worksheets for helping children learn their phonics sounds. As you might already know, I am a strong proponent of the Jolly Phonics system of synthetic phonics sounds. Jolly Phonics system follows a particular order of teaching alphabet sounds in which there are seven groups. The following image shows the seven groups of Jolly Phonics along with an extra group taught by my Phonics app on Google Play Store. My app called  Phonics Fun  is 100% Free so you can download it and use it on all your Android devices.  It teaches all the letter sounds and different phonics rules and follows the pattern of Jolly Phonics but it is available for free. It is the perfect way to master phonics as you can hear phonics sounds and also test learning by playing many matching games. Coming back to printable Jolly phonics worksheets, I have already published worksheets for practicing Group 1 (s, a, t,
Read more

Jolly Phonics Flash Cards

Image
Gone are the days of A for apple, B for Ball...this is the time of synthetic phonics where each alphabet has a sound. Now, you don't teach children the name of the letter but the sound made by the letter. A has the sound that comes when we say the word apple, b has the sound that comes when we say bed, and so on and so forth. There are different systems of synthetic phonics but I have felt that Jolly Phonics is the best system. In fact, I made my first mobile app for my son based on the Jolly Phonics style of teaching. However, I know that many people want to limit screen exposure for their children so I decided to make these flashcards.  You can use these flashcards independently or you can use them along with my app called Phonics Fun , available on the Google Play Store. You can hear the sounds from my app. Practice using these flashcards and then, test learning using my app too...a win-win situation :) The Jolly Phonics flash cards are double-sided. I have told you in my previ
Read more