Category

Programming

Vuforia Cloud Recognition Multiple Targets Video Playback

By | Programming, Unity, Vuforia | No Comments

Vuforia Cloud Recognition Multiple Targets Video Playback

Hello and welcome back to another video.

I am back with another vuforia cloud recognition video as augmented reality tutorial for beginners, I am using Unity 2017.3 and Vuforia Cloud Recognition Multiple Targets Video Playback | Augmented Reality Tutorial

A lot of you guys have requested for this video play back on vuforia cloud targets video. So here it is.

[Suggested read: Augmented Reality Video Player]

We need to have an API system to provide us with the video url on the basis of the recognized target image. Watch the video for further instructions.

Let me know if you need me to do any more such video.

Support me and become my patron: https://www.patreon.com/mirimad

Thanks for watching 🙂 Follow for more game development, entrepreneurship, online earning, shopify, etc. videos.

❤ Like | Share | Comment | SUBSCRIBE ❤

Social Follow:

Twitter: https://twitter.com/mirimadahmed
Facebook: https://www.facebook.com/imadentrepreneur/

Subscribe my channel for more videos
https://www.youtube.com/c/MirImad

Check out my website:
https://mirimad.com/

Augmented Reality Video Player | Kids Poem in AR | Learn Vuforia Augmented Reality | Unity 2017.3

By | Programming, Unity, Vuforia | No Comments

Augmented Reality Video Player | Kids Poem in AR | Learn Vuforia Augmented Reality | Unity 2017.3

Hi Guys. Welcome back to another augmented reality tutorial about vuforia and unity. I am using unity 2017.3 and latest vuforia that comes with it. In this video I am going to make augmented reality video player app called Kids Poem in AR. Learn Vuforia Augmented Reality Unity by watching my tutorial.

I am going to use 3 short poem videos, we will display the videos on a Quad in Unity 3d as augmented reality overlay. We are going to add UI with Play, Pause, Next, Previous, Mute and UnMute functions as well.

Final outcome app of the video:
Install the app: https://play.google.com/store/apps/details?id=com.mirimad.kidspoemar
and try it on the image target:

augmented reality video player

vuforia video player image marker

Comment your thoughts about my programming style, ask questions if you don’t understand any part. Share your ideas about AR projects that I can do in future.

 

Support me and become my patron: https://www.patreon.com/mirimad

Thanks for watching 🙂 Follow for more augmented reality unity development, vuforia, ionic, entrepreneurship, online earning, shopify, etc. videos.

❤ Like | Share | Comment | SUBSCRIBE ❤

Social Follow:

Twitter: https://twitter.com/mirimadahmed
Facebook: https://www.facebook.com/imadentrepreneur/

Subscribe my channel for more videos
https://www.youtube.com/c/MirImad

Check how I made vuforia Cloud Recognition with Multiple Image Targets

Integrate AdMob Banner Ads in Ionic | Ionic tutorial | Ionic AdMob | Ionic 3 AdMob Part 1

By | Ionic, Programming | No Comments

Integrate AdMob Banner in Ionic | Ionic tutorial | Ionic AdMob | Ionic 3 AdMob

Do you like my videos? Support me and become a patron: https://www.patreon.com/mirimad 🙂

Hi guys this is Mir Imad.

I am back with another tutorial in the ionic 3 tutorials series. In this tutorial I am going to teach you guys how you can integrate admob banner ads using cordova plugin for ionic admob.

AdMob Ionic can be used to display ads in your mobile application and earn money from it.

Ionic 3 admob banner can be easily integrated if you do mobile app development in ionic framework. It can also work with ionic 2 and ionic 3.

Part 2: https://youtu.be/fB4MroorwEM

Follow my channel to learn how to create mobile app development.

Thanks for watching 🙂 Follow for more game development, entrepreneurship, online earning, shopify, etc. videos.
——————————————
❤ Like | Share | Comment ❤ #SUBSCRIBE

Social Follow:

Twitter: https://twitter.com/mirimadahmed
Facebook: https://www.facebook.com/imadentrepreneur/

Subscribe my channel for more videos
https://www.youtube.com/c/MirImad

Check out my website:
https://mirimad.com/

Unity Admob Banner | Unity Admob Plugin | AdMob Tutorial Unity | Unity Admob Integration

By | Programming, Unity | No Comments

Unity Admob Banner | Unity Admob Plugin | AdMob Tutorial Unity | Unity Admob Integration

Hi guys. First of all sorry if you feel my voice is low or something, I was not feeling well today but I did not missed my upload.

In this Admob Tutorial Unity:

Earning money is a cruical part of making games with unity 3d. I have worked a lot with unity 3d in making games or augmented reality projects. Admob is the best earning network for mobile ads I beleive. By showing unity admob banner in your app you can earn money. You can always have others as well – no problem.

In this Admob Tutorial Unity I am going to walk you through how to integrate unity admob banner, unity admob interstitial and unity admob rewarded video ad to your game or mobile app that you build with unity 3d.

Learn to place ads in ionic mobile apps.

Thanks for watching 🙂 Follow for more game development, entrepreneurship, online earning, shopify, etc. videos.
——————————————
❤ Like | Share | Comment ❤ #SUBSCRIBE

Social Follow:

Twitter: https://twitter.com/mirimadahmed
Facebook: https://www.facebook.com/imadentrepreneur/

Subscribe my channel for more videos
https://www.youtube.com/c/MirImad

Check out my website:
https://mirimad.com/

By | Programming, Unity | No Comments

Vuforia Cloud Recognition Multiple Targets | Unity 2017.3 | Augmented Reality | Unity Tutorial

Hi Everone. First of all sorry for the breaks and umhs and ahms. I am suffering from nausea these days.

Learn How To Download Asset Bundle From Server in Unity 3D | Under 2 Minutes

Welcome to another augmented reality tutorial video about Vuforia cloud recognition. I create augmented reality apps with vuforia every time. I bring you another augmented reality tutorial about vuforia cloud recognition.

In this vuforia cloud recognition sample I will teach you guys about vuforia cloud recognition multiple targets augmentation. I am using Unity 2017.3 for development.

Let me know in comments if you guys want more vuforia cloud recognition example videos.

Keep an eye for my markerless ar video coming soon.

Thanks for watching 🙂 Follow for more vuforia augmented reality, unity 5, game development, entrepreneurship, online earning, shopify, etc. videos.
——————————————
❤ Like | Share | Comment ❤ #SUBSCRIBE

Social Follow:

Twitter: https://twitter.com/mirimadahmed
Facebook: https://www.facebook.com/imadentrepreneur/

Subscribe my channel for more videos
https://www.youtube.com/c/MirImad

Check out my website:
https://mirimad.com/

By | Ionic, Programming | No Comments

Ionic AdMob Interstitial | Ionic Admob Integration | Ionic 3 AdMob Part 2 | Typescript

Hello Everyone. Welcome to Ionic Admob Series Part 2 about mobile app development with ionic framework.

Find Part 1 here: https://www.youtube.com/watch?v=vw_xNgjlpkM

Learn to validate domain in ionic

In this video I am going to teach you guys ionic admob integration. It works with ionic 3 and ionic2 as well. I am going to use Ionic 3 admob banner example from previous video further.

If you want to know about integration of the ionic admob free please refer to my Part 1 ionic tutorial about admob banner. Admob ionic is a package called ionic admob free available to be downloaded easily.

Learn ionic 3 admob intersitial ad or ionic admob integration with my tutorials easily.

Comment below if you want me to cover any specific topic you want.

Thanks for watching 🙂 Follow for more ionic, unity, game development, entrepreneurship, online earning, shopify, etc. videos.
——————————————
❤ Like | Share | Comment ❤ #SUBSCRIBE

Social Follow:

Twitter: https://twitter.com/mirimadahmed
Facebook: https://www.facebook.com/imadentrepreneur/

Subscribe my channel for more videos
https://www.youtube.com/c/MirImad

Check out my website:
https://mirimad.com/

Vuforia Play Video Unity | Learn Unity Mir Imad Ahmed

By | Programming, Unity, Vuforia | No Comments

Vuforia Play Video Unity

Vuforia play video unity, I will guid you through how to do that. Just like I explained how to unity play video on canvas. If you dont like reading you can follow my unity tutorials on youtube as well.

vuforia play video unity

vuforia play video unity

First of all you will have to get your project ready for Vuforia’s AR. You can do that by adding AR Camera and it will import everything required automatically.

Then you need to import your database from the vuforia developer console.

Add new Image Target like this:

unity add image target

unity add image target

Then you will have to add a Plane from the 3D Objects menu on to the image target. Place it a little over the image target just like this:

unity plane on AR

unity plane on AR

Add the unity video player component to the Plane.

You will notice that as soon as you add the video player to plane it will automatically get the material override as render mode and get reference of the material of plane. Just like this:

Unity Video in AR

Unity Video in AR

Now select the video you want to play from the project or you can set a URL as video source as well.

Now if you run the app anywhere and point the camera to the said image target you will notice that the video was already playing instead of playing when tracked.  To change this behavior, what you can do is:

Open your DefaultTrackableEventHandler.cs file and change the code a bit like this:

/*==============================================================================
Copyright (c) 2017 PTC Inc. All Rights Reserved.

Copyright (c) 2010-2014 Qualcomm Connected Experiences, Inc.
All Rights Reserved.
Confidential and Proprietary - Protected under copyright and other laws.
==============================================================================*/

using UnityEngine;
using Vuforia;

/// <summary>
///     A custom handler that implements the ITrackableEventHandler interface.
/// </summary>
public class DefaultTrackableEventHandler : MonoBehaviour, ITrackableEventHandler
{
     public UnityEngine.Video.VideoPlayer videoPlayer;
    #region PRIVATE_MEMBER_VARIABLES

    protected TrackableBehaviour mTrackableBehaviour;

    #endregion // PRIVATE_MEMBER_VARIABLES

    #region UNTIY_MONOBEHAVIOUR_METHODS

    protected virtual void Start()
    {
        mTrackableBehaviour = GetComponent<TrackableBehaviour>();
        if (mTrackableBehaviour)
            mTrackableBehaviour.RegisterTrackableEventHandler(this);
    }

    #endregion // UNTIY_MONOBEHAVIOUR_METHODS

    #region PUBLIC_METHODS

    /// <summary>
    ///     Implementation of the ITrackableEventHandler function called when the
    ///     tracking state changes.
    /// </summary>
    public void OnTrackableStateChanged(
        TrackableBehaviour.Status previousStatus,
        TrackableBehaviour.Status newStatus)
    {
        if (newStatus == TrackableBehaviour.Status.DETECTED ||
            newStatus == TrackableBehaviour.Status.TRACKED ||
            newStatus == TrackableBehaviour.Status.EXTENDED_TRACKED)
        {
            Debug.Log("Trackable " + mTrackableBehaviour.TrackableName + " found");
            OnTrackingFound();
        }
        else if (previousStatus == TrackableBehaviour.Status.TRACKED &&
                 newStatus == TrackableBehaviour.Status.NOT_FOUND)
        {
            Debug.Log("Trackable " + mTrackableBehaviour.TrackableName + " lost");
            OnTrackingLost();
        }
        else
        {
            // For combo of previousStatus=UNKNOWN + newStatus=UNKNOWN|NOT_FOUND
            // Vuforia is starting, but tracking has not been lost or found yet
            // Call OnTrackingLost() to hide the augmentations
            OnTrackingLost();
        }
    }

    #endregion // PUBLIC_METHODS

    #region PRIVATE_METHODS

    protected virtual void OnTrackingFound()
    {
          videoPlayer.Play();
        var rendererComponents = GetComponentsInChildren<Renderer>(true);
        var colliderComponents = GetComponentsInChildren<Collider>(true);
        var canvasComponents = GetComponentsInChildren<Canvas>(true);

        // Enable rendering:
        foreach (var component in rendererComponents)
            component.enabled = true;

        // Enable colliders:
        foreach (var component in colliderComponents)
            component.enabled = true;

        // Enable canvas':
        foreach (var component in canvasComponents)
            component.enabled = true;
    }


    protected virtual void OnTrackingLost()
    {
          videoPlayer.Stop();
          var rendererComponents = GetComponentsInChildren<Renderer>(true);
        var colliderComponents = GetComponentsInChildren<Collider>(true);
        var canvasComponents = GetComponentsInChildren<Canvas>(true);

        // Disable rendering:
        foreach (var component in rendererComponents)
            component.enabled = false;

        // Disable colliders:
        foreach (var component in colliderComponents)
            component.enabled = false;

        // Disable canvas':
        foreach (var component in canvasComponents)
            component.enabled = false;
    }

    #endregion // PRIVATE_METHODS
}

And in the editor side give reference of your video player component to the given script. Now you will notice that when the image target is being found it plays and when it is lost it stops.

Thanks for reading!

Unity Play Video On Canvas | Learn Unity Mir Imad Ahmed

By | Programming, Unity | No Comments

Unity Play Video On Canvas

With the release of the new unity video player component, the problem of unity play video on canvas raised.

unity play video on canvas

unity play video on canvas

I have had hard time figuring out that how can one play video on canvas. Unity docs were not that good at the time I started on unity video player component.

Without further a do, I will come straight to the point:

First of all, you will have to add a video player component to the scene like this.

unity video player

unity video player

Then we can either select video clip or URL as the video source and the most important thing that we have to do is to select the render mode to be API Only like this:

unity video player component

unity video player component

Now lets add a Raw Image from UI menu to our scene like this:

unity ui raw image

unity ui raw image

Now you can resize the Raw Image to be however you want unity play video on canvas.

Now what you will have to do is to write a script that will tell unity to render the texture of the video upon this raw image’s texture.

Go on and add a script. I called mine StreamVideo. The code looks like this:

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;
using UnityEngine.Video;

public class StreamVideo : MonoBehaviour {
     public RawImage rawImage;
     public VideoPlayer videoPlayer;
     public AudioSource audioSource;
  // Use this for initialization
  void Start () {
          StartCoroutine(PlayVideo());
  }
  IEnumerator PlayVideo()
     {
          videoPlayer.Prepare();
          WaitForSeconds waitForSeconds = new WaitForSeconds(1);
          while (!videoPlayer.isPrepared)
          {
               yield return waitForSeconds;
               break;
          }
          rawImage.texture = videoPlayer.texture;
          videoPlayer.Play();
          audioSource.Play();
     }
}

Now it should render the video on our Raw Image on canvas. We can add custom play, pause, stop or any other buttons and then write code behinds in the same file for the video player component.

Thanks for reading!

Watch my All Unity Tutorials on youtube.

Unity Video Player Explained Fully | Learn Unity Mir Imad Ahmed

By | Programming, Unity | No Comments

Unity Video Player Explained Fully

unity video player

unity video player

New unity video player component has been introduced lately from Unity. I have had a chance to play around with the component in my applications.

I wrote about using video player with Vuforia AR here.

I am going explain as much as I can. Here is how it looks like:

unity video player component

unity video player component

I will try to explain things one by one.

Source

  • Video Clip – It can be a video clip imported inside unity project.
  • URL – You can play a video directly from a URL be it served over web or file:// protocols.

Play On Awake

If you keep this checked unity video player will automatically play your video as soon as you run the project.

Wait For First Frame

If you keep this checked unity video player will wait till it gets the first frame of the video loaded into the memory.

Loop

Self explanatory, helps you if you want to loop your video and want it to play itself again when it ends.

Playback Speed

It helps you speed up or down your video speed.

Render Mode

It requires more than just one line explanation. It has 5 different rendering modes as shown:

unity video player render modes

unity video player render modes

Camera Far Plane

Render the video on the Camera’s far plane.

Camera Near Plane.

Render the video on the Camera’s near plane.

Render Texture

Render the video into a Render Texture.

Material Override

Render the video into a selected Texture property of a GameObject through its Renderer’s Material.

API Only

Render the video into the VideoPlayer.texture Scripting API property. You must use scripting to assign the Texture to its intended destination.

Aspect Ratio

The aspect ratio of the images that fill the Camera Near Plane, Camera Far Plane or Render Texture when the corresponding Render Mode is used.

Following are the aspect ratio options we have:

No Scaling

No scaling is used. The video is centered on the destination rectangle.

Fit Vertically

Scale the source to fit the destination rectangle vertically, cropping the left and right sides or leaving black areas on each side if necessary. The source aspect ratio is preserved.

Fit Horizontally

Scale the source to fit the destination rectangle horizontally, cropping the top and bottom regions or leaving black areas above and below if needed. The source aspect ratio is preserved.

Fit Inside

Scale the source to fit the destination rectangle without having to crop. Leaves black areas on the left and right or above and below as needed. The source aspect ratio is preserved.

Fit Outside

Scale the source to fit the destination rectangle without leaving black areas on the left and right or above and below, cropping as required. The source aspect ratio is preserved.

Stretch

Scale both horizontally or vertically to fit the destination rectangle. The source aspect ratio is not preserved.

Audio

Then comes another crucial part of how you want your video’s audio to be considered. Do you want no audio, play directly on the hardware or do you want to do audio tweaking as well. For that you will have to select Audio Source option.

If you select Audio source as the option you will have to provide the reference of the audio source component where you want the audio to be played through. Then in that audio source component you can do the tweaking.

Watch my All unity tutorials.

Learn how to unity play video on canvas in unity. 

validate domain ionic

Validate Domain Ionic 3 or 2 | Learn Form Validation in Ionic Part 1

By | Ionic, Programming

Validate Domain Ionic 3 or 2 | Learn Form Validation in Ionic Part 1

validate domain ionic

validate domain ionic

this.domainForm = FormGroup;
  this.domainForm = fb.group 
  ({
    'domain':[null, Validators.compose([Validators.required, Validators.pattern(/\b((?=[a-z0-9-]{1,63}\.)(xn--)?[a-z0-9]+(-[a-z0-9]+)*\.)+[a-z]{2,63}\b/)])]
  })

<ion-header>
  <ion-navbar>
    <ion-title>
      Ionic Blank
    </ion-title>
  </ion-navbar>
</ion-header>

<ion-content padding>
  <form [formGroup]="domainForm">
    <ion-item>
      <ion-input type="text" name="domain" placeholder="start typing" [formControl]="domainForm.controls['domain']">
      </ion-input>
    </ion-item>
    <button ion-button full block [disabled]="!domainForm.valid">Search Domain</button>
  </form>
</ion-content>

 

Need help to understand more?

Watch the video:

Thanks for reading.

Latest post: Learn to download asset bundle from server in unity

Created a mobile app for domain research. Its V0.1 for now so expect a simple and basic design.

I am open for your comments and suggestions on how can I improve the app.

iOS: https://goo.gl/5kzWFn

Android: https://goo.gl/3H3Zfj

#android #iosdevelopment #ionicframework #domainregistration #domainnames #hobbies