Getting started with HISPlayer consists of implementing the following steps:
-
Import and configure package
1.1. Import package
1.2. Configure Unity for WebGL
-
Create your own sample
2.1 Setup HISPlayer Manager
2.2 Attach Unity Resources
2.3 Configure HISPlayer Properties
2.4 Build and Run
It's also possible to import the HISPlayer Sample after completing step 1. The sample is a comprehensive example scene using the HISPlayerSDK to help demonstrate features like play, pause, seek, etc.
The HISPlayer Sample is included in the HISPlayer SDK Unity Package.
Importing the package is the same as importing other normal packages in Unity. Select the package of HISPlayer SDK and import it.
Assets > Import Package > Custom Package > HISPlayerSDK unity package
Refer to Import HISPlayer Sample to know more about the HISPlayer Sample.
In the case you don't want to include the HISPlayer Sample, please disable it from the Import Unity Package window.
Importing the package is the same as importing other normal packages in Unity. Select the package of HISPlayer SDK and import it.
Assets > Import Package > Custom Package > HISPlayerSDK unity package
Only the SDK will be imported using HISPlayer SDK versions lower than 3.4.0. Refer to Import HISPlayer Sample to know more about the HISPlayer Sample.
Open the window Tools > HISPlayer located in the upper side of the screen > Click on Player Settings Configuration > Select Build Target to WebGL > Set all the required settings.
Copy the WebGLTemplates folder from the HISPlayer package folder into the Unity Assets folder. You can refer to WebGL Templates for more information.
Select the HisPlayerTemplate by opening Tools > HISPlayer and click Use WebGL HISPlayer Template:
You may skip this section if you are using HISPlayerSample. The code set-up is already included in the sample script (HISPlayerSample.cs).
Create a new script which will inherit from HISPlayerManager, for example, WebGLStreamController . It is necessary to add the ‘using HISPlayerAPI;’ dependancy. Then, add this component to a new game object (recommended to be empty).
Call the SetUpPlayer() function in order to initialize the stream environment internally. This function can be called whenever it’s needed. For example, using the Awake function:
For example, using the Awake function:
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using HISPlayerAPI;
public class WebGLStreamController : HISPlayerManager
{
protected override void Awake()
{
base.Awake();
SetUpPlayer();
}
}It is strictly necessary to use SetUpPlayer before using anything else. This function initializes everything else that will be needed during the usage of HISPlayer APIs.
Remember to call the Release function after closing the app or before changing scenes in Unity for freeing the internal resources.
Move to Unity Editor to attach all the resources. The rendering system is supporting Material, RawImage and RenderTexture Unity’s components.
Create a new Material from Assets > Create > Material and attach it to the GameObject that is going to be used as screen and to the stream controller component.
You can also use the Resources > Materials > HISPlayerDefaultMaterial.mat we provide in our package.
This action will be related to Unity’s Canvas. If there is not a Canvas created yet, creating a Raw Image will create one automatically.
For the creation, select GameObject > UI > Raw Image. Once it is created, attach it to the stream controller component
For this you can use the RenderTexture we provide or create a RenderTexture from zero. In the first case, go to the Resources folder of our package and attach the Resources > Materials > HISPlayerDefaultMaterialRenderTexture.mat to the GameObject that is going to be used as screen and the Resources > RenderTextures > HISPlayerRenderTexture.renderTexture to the stream controller component.
For creating it from zero, select Assets > Create > Render Texutre and then create a Material referencing the Render Texture. This last action can be done automatically by grabbing the Render Texture and dropping it at the end of a GameObject's Inspector with the component Mesh Renderer with Material field empty. This will create the new material inside a Materials folder.
Once all this process it’s done, associate the RenderTexture to the script component.
If you received a license key from HISPlayer, please input the license key in the License Key field.
If the license key is not valid, the player won't work and will throw an error message. License key is not required for Unity Editor usage.
Use Multi Stream Properties to set all the configuration needed for multi stream. It starts with 0 elements. Each element added has its own configuration for multiple players and corresponds to 1 Render Surface. If you just need a single stream, then you just need to add 1 element with 1 URL.
- Render Mode: Select the render surface. It can be RenderTexture, Material, RawImage or NONE.
- Material: Attach the Material asset created to the Material section of the element.
- Raw Image: Attach the RawImage asset created to the RawImage section of the element.
- Render Texture: Attach the RenderTexture to the RenderTexture section of the element.
- URL: Add the URL associated to the stream. Each stream can have multiple URLs, therefore users can use the same render surface to play different URLs.
- URL MIME Types: Set the MIME types of each URL. URL Extension is set by default. Setting this property will not take any effect for WebGL.
- Autoplay: Property to determine whether the player will start automatically after set up.
- LoopPlayback: Loop the current playback. It's true by default.
- AutoTransition: Change the playback to the next video in the playlist. This action won't have effect when loopPlayback is true. It's false by default.
- AdsProperties: List of properties to configure advertisement insertions for each player in the scene. For more information, please refer to Playing Ads
Now the configuration it’s done, so it’s time to Build And Run. Open Build Settings and test it.
