• Skip to primary navigation
  • Skip to main content
  • Skip to primary sidebar

HelpGurus

  • Apps
  • Games
  • PPSSPP
  • Latest News

How to add TapTargetVew to your Android Apps in Sketchware

October 20, 2020 by Chidey 2 Comments

Have you thought about how you can quickly tell your users the new features of your Application?  It is very easy to do that, just use TapTargetView.
Today you will learn how to implement TapTargetView in your Sketchware-built Android Application.

With TapTargetView, you can tell your users ‘the specific function for each buttons and widgets in your Application’ in a way you or them will find ‘unique’.

Now, you might be thinking “What is TapTargetView?“, “How can I use it in my App?“, “I can’t use it in my App, I don’t know Java“. But not to worry, I will cover everything concerning TapTargetView in  this article.

Contents Navigation Table hide      
  • What is Tap Target view in Android?
  • What is the importance of Tap Target ?
  • How to Add TapTarget to your Sketchware project
  • How to display multiple TapTargets (one after the other) in your Sketchware-made Application
  • Frequently Asked Questions
    • Why did you use a SharedPreferences component in every if block?
    • More than one TapTargetView are displaying at once, how I can stop this?
    • Can I use this codes to display TapTargetView in an Android Studio or AIDE project? If possible, how can I do it?
    • What should be the proper implementation method in other avoid bugs in my project ?
  • Conclusion

What is Tap Target view in Android?

TapTargetView is an view mainly used to highlight features of your App to your new users. It is just like a taking your users on a quick tour in your App and explaining every about every function they should know just like “this button does this”, “a click on the other Button does”.
 This helps in improving your UX (user experience) because when your users knows the full function of your App, it helps them produce great results.

What is the importance of Tap Target ?

At this point, I’m sure you need much explanations about the usefulness of TapTargetView, lol.
     But still, the common importance of TapTargetView is :
  • It helps in giving your users full knowledge about your Application features.
  • It help increases your users’ first impressions.
  • It is a more unique way of welcoming new Users.
  • It helps draw the user’s attention so you can quickly display the Terms of Use/Terms and Conditions of your Application.
And there are so many more I can’t explain to you but you will figure it when you finally use TapTargetView in your Application.

How to Add TapTarget to your Sketchware project

Implementing TapTargetView in Sketchware doesn’t require any extra library and it is very easy due to the fact that there is already a Moreblock for that function.
   To easily implement TapTargetView in your Sketchware project, follow this steps:

 Open your Sketchware project (preferably a new one for testing) and go to Logic > Moreblock > Shared Moreblocks

 Search for “TapTarget” (without Quotes) and scroll down till you see the moreblock for TapTarget added by ‘Usman’ ( check the Image below to understand )

Moreblocks in Sketchware
Tap it and import the Moreblock into your Sketchware project.
 Now head to the component area and add a SharedPreferences component to your project.
  •  Go to Moreblock and create a new Moreblock and name it “startTapTargetView”.

Define “startTapTargetView” Moreblock by adding this blocks.

 Set your Target view (ex. button), set the Title of TapTargetView, set the message, set the background color you wish (ex. #ffffff) and lastly set the Time (milliseconds) which will delay the TapTargetView.

When that is done, go to the onCreate event of your activity and call for the TapTargetView by using this blocks. Set the time according to your taste.
Sketchware Tutorials - HelpGurus
That is all, you can now run your project and see that it works.
 However, you can’t display multiple TapTargetView respectively with only that you would still need to add some few things which is clearly explained below.

How to display multiple TapTargets (one after the other) in your Sketchware-made Application

Displaying multiple TapTargetView in Sketchware apps is not difficult, all you need to do follow this steps :

Go to Moreblock area and open the “NewTapTarget” moreblock then you replace the codes in the first ASD (add source directly) block with the one below

How to add TapTargetView in Android
//change "MainActivity" to your specific Activity TapTargetView.showFor(MainActivity.this, TapTarget.forView(_view, _title, _msg) .outerCircleColorInt(Color.parseColor(_bgcolor)) .outerCircleAlpha(0.96f) .targetCircleColorInt(Color.parseColor("#FFFFFF")) .titleTextSize(25) .titleTextColorInt(Color.parseColor("#FFFFFF")) .descriptionTextSize(18) .descriptionTextColor(android.R.color.white) .textColorInt(Color.parseColor("#FFFFFF")) .textTypeface(Typeface.SANS_SERIF) .dimColor(android.R.color.black) .drawShadow(true) .cancelable(false) .tintTarget(true) .transparentTarget(true) //.icon(Drawable) .targetRadius(60), //LISTENER// new TapTargetView.Listener() { @Override public void onTargetClick(TapTargetView view) { //ON CLICKED// super.onTargetClick(view); _startTapTargetView(); } });

Go back and open the “startTapTargetView” moreblock and insert this additional blocks. Do this for as many views you want to display, but just make sure it goes in this format.

TapTargetView in Sketchware - HelpGurus
To make it more easy and fast, just copy the previous blocks and then add it to the ‘else’ event of the previous one and change the string value (ex. Title, message, etc) and also change to the focus View to next one you wish to display.
The images below will explain better.

NOTE: Always put “Tap it to continue” at the end of your message because the TapTargetView won’t dismiss until the Target is clicked.

When done with done with that, change the data of the SharedPreferences (use the data of the previous TapTargetView as an “if” condition, then you change it). For a clear understanding, take a look at this images

Shared Preferences in Sketchware

Go back to your onCreate event and make this blocks are still there.

Tap Target View in Android

 Run your project and see the good result you have achieved.

Final Result
Our Final Result

Frequently Asked Questions

Why did you use a SharedPreferences component in every if block?

SharedPreferences is used to locally save data. In this tutorial, we used the data of a particular key “taptarget” as a condition. If that condition is met, the assigned TapTargetView for that condition will be displayed, then, you will have to change the data of the to prevent the displayed TapTarget from displaying again.

More than one TapTargetView are displaying at once, how I can stop this?

   To stop this, you just have to make sure you didn’t repeat the same SharedPreferences data.
And also make sure you blocks like this:
if ( condition ) {
//display TapTargetView for the second view
}else{
 if ( condition ) {
 //display TapTargetView for the third view 
  }else{
    if ( condition ) {
   display TapTargetView for the fourth view
    }else{
       if ( condition ) {
       //display TapTargetView the last view
        }
     }
  }
}
This can go on depending on how many widgets you will want to highlight.
The next TapTargetView you want to display should go in the ‘else’ event of the previous  one.

Can I use this codes to display TapTargetView in an Android Studio or AIDE project? If possible, how can I do it?

 I haven’t personally tried to use this codes in Android studio or AIDE, but if you want to use the codes in your Android Studio project;

 

  • Finish the whole process and run the Application.
  • Open XML EDITOR PRO.
  • Open the project in XML Editor Pro and go to the activity which you implemented the codes and easily copy it from there ( if you don’t know how, read this article)

Paste the codes in the specific events which you need TapTargetView.

What should be the proper implementation method in other avoid bugs in my project ?

  To avoid bugs or compile errors in your project, just make sure:
  1. You start the TapTargetView display in the onCreate event in your Application.
  2. You use new components and variables.

Conclusion

I hope this article helped you understand TapTargetView and how you can implement it in your Sketchware project. If you still have additional questions, don’t hesitate to comment below or you contact us.
Share this with your friends and have a nice day 🙂

Related posts:

  1. Creating a simple Quiz App in Sketchware (Beginners Guide)
  2. How to add Bottom Navigation View to your Sketchware Android Projects

Filed Under: How To, Sketchware Tutorials

Reader Interactions

Comments

  1. Admin says

    June 19, 2020 at 1:51 PM

    Wow

    Thank you so much.
    This lightened up my day in so many ways

    I'm glad to see you understood everything 🙂
    I wish to you around, thank you once again.

    Reply
  2. Aadarsh Roy says

    June 17, 2020 at 10:39 AM

    Hey HelpGurus ,

    Great post with effective tips to add Tap-Target-view on android apps in sketch-ware. It is my first time commenting on your blog post and i must say
    that you have done a fantastic work and suggested great tips to add Tap-Target-view.

    It is absolutely true that Tap-Target-View helps user in providing full knowledge about application features and is really a unique way for welcoming new users.

    Your each of the suggested steps to add Tap-Target to sketch-ware project and steps to display multiple Tap-Targets are so clear, easy to understand and
    follow, whereas following these steps will helps a lot.

    Truly helpful post and thanks for sharing.

    Reply

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

Primary Sidebar

Looking for stuff, Search it here!

Recent Posts

  • Sengoku Basara – Battle Heroes PPSSPP Iso Game (Highly Compressed)
  • Jetpack Joyride Metal Slug Mod APK v1.37.2 (Unlimited Coins)
  • RollerCoaster Tycoon Touch MOD APK + Obb Data v3.15.5 (Unlimited Currency)
  • Ben 10 Ultimate Alien Cosmic Destruction PPSSPP ISO Zip File Download for Android and PC (Highly Compressed)
  • Monster Hunter Freedom 2 Iso Zip File PSP Game For Android & PC {Highly Compressed}

Related Topics

Rexdl  Revdl, Techbigs , Blackmod , Techylist Divyanet , Ytricks , Reddit , an1 Happymod, HelpGurus. apkdone | moddroid | android 1 | apkmody.io | dlandroid |  Cracked APK | APK Mod | Hacked version download | platinmods | cheats | apkpure | uptodown.

Copyright © 2021

We use cookies on our website to give you the most relevant experience by remembering your preferences and repeat visits. By clicking “Accept”, you consent to the use of ALL the cookies.
Cookie settingsACCEPTCookie Policy
Privacy & Cookies Policy

Privacy Overview

This website uses cookies to improve your experience while you navigate through the website. Out of these, the cookies that are categorized as necessary are stored on your browser as they are essential for the working of basic functionalities of the website. We also use third-party cookies that help us analyze and understand how you use this website. These cookies will be stored in your browser only with your consent. You also have the option to opt-out of these cookies. But opting out of some of these cookies may affect your browsing experience.
Necessary
Always Enabled

Necessary cookies are absolutely essential for the website to function properly. This category only includes cookies that ensures basic functionalities and security features of the website. These cookies do not store any personal information.

Non-necessary

Any cookies that may not be particularly necessary for the website to function and is used specifically to collect user personal data via analytics, ads, other embedded contents are termed as non-necessary cookies. It is mandatory to procure user consent prior to running these cookies on your website.