Giter Site home page Giter Site logo

finger563 / unreal-rtsp-display Goto Github PK

View Code? Open in Web Editor NEW
15.0 1.0 6.0 212 KB

Unreal Engine 5 Example for receiving video streams over RTSP (using FSockets and FRunnables) and displaying their image data in a texture.

License: MIT License

C# 2.64% C++ 97.21% C 0.15%
mjpeg mjpeg-player rtsp-client rtsp-player rtsp-stream ue5 unreal-engine runnable

unreal-rtsp-display's Introduction

unreal-rtsp-display

Example code for receiving video streams over RTSP using Unreal Engine FSockets and displaying them in real time.

unreal-rtsp-ui-compressed.mp4

When running this example, you will need to configure the address, port, and path of your RTSP server on the actor:

CleanShot 2023-07-18 at 13 42 36

Note: this example currently only supports MJPEG streams over RTSP, which are parsed with the RtpJpegPacket class into JpegFrames. This example uses Unreal Engine's built-in image decoding to decode the jpeg frames into uncompressed image data for use in a UTexture2D.

This example contains a few components:

  1. The RtspClientComponent class: This component can be added to an actor and exposes some functions for connecting to an RTSP server and configuring / controlling the stream. Inside its TickComponent function, it waits for new images (decompressed) to be available and if so, creates a new transient UTexture2D and writes the decompressed data to the new texture. It then broadcasts this new texture using the multicast delegate to any registered listeners.
  2. The RtpPacket, RtpJpegPacket, JpegHeader, and JpegFrame classes which handle the parsing of the media data (as RTP over UDP from the server to the client) and reassembling of multiple networks packets into a single jpeg frame.
  3. The MyRunnable class: used by the RtspClientComponent when it connects to a server it spawns two runnables (Unreal Engine threads) for receiving data from the server on the RTP/UDP socket and the RTCP/UDP socket. The RTP runnable runs a bound function from the RtspClientComponent class which receives the raw data, parses it into jpeg frames, decompresses the jpeg frames, and then updates some mutex-protected data to inform the game thread (RtspClientComponent::TickComponent) that new data is available. This class is also used to allow the FSocket::Connect (TCP connection from RTSP Client to RTSP Server) to run without blocking the main / game thread.
  4. M_Display and M_Display_Inst: these assets in the Content/Materials directory are simple materials which render a texture parameter with optional configuration for the UV mapping of the texture. This material instance is the base for the dynamic material instance that is created at runtime in the RtspDisplay blueprint.
  5. RtspDisplay: This blueprint actor contains an RtspClientComponent and a Plane static mesh component. On BeginPlay it creates a dynamic material instance of the M_Display_Inst which it stores a reference to so that it can dynamically update the texture parameter that the material is rendering. It sets this material on the plane static mesh component. It binds an event to the OnFrameReceived event from the RtspClientComponent and when it receives a message from that event, it sets the new texture to be the dynamic material instance's texture parameter.
  6. W_RtspDisplay: This user widget contains the UI (2D) for interacting with a RtspClientComponent. It is configured by the RtspDisplayMap's level blueprint to be added as the UI to the viewport for the first player controller and to control the RtspClientComponent of the RtspDisplay actor in the level. It provides the UI (display image, URL textbox, and buttons for connect, disconnect, play, and pause) for the RtspClientComponent.

Image of the running example in the editor:

Disconnected (With text box to write URI and connect button): CleanShot 2023-07-18 at 13 40 12 Connected: CleanShot 2023-07-18 at 13 40 27 Playing: CleanShot 2023-07-18 at 13 40 42

Details

RtspDisplay Actor Blueprint

CleanShot 2023-07-18 at 13 44 33

M_Display Material

CleanShot 2023-07-08 at 10 51 50@2x

RtspDisplay User Widget

CleanShot 2023-07-18 at 13 45 26 Note the image has been set with angle 180 and X scale of -1 so that it matches the camera image that I'm currently sending. May need to be changed for other streams depending on camera orientation.

Its blueprint: CleanShot 2023-07-18 at 13 48 23

Level Blueprint

CleanShot 2023-07-18 at 13 48 56

Setup for Android App

Follow the setup instructions here.

Note: you will likely have to modify the /Users/Shared/Epic\ Games/UE_5.2/Engine/Extras/Android/SetupAndroid.command file - possibly to point to the right JAVA_HOME directory. In my case I had to modify the JAVA_HOME export in the SetupAndroid.command file to point to /Library/Java/JavaVirtualMachines/adoptopenjdk-8.jdk/Contents/Home and had to install jdk8 specifically.

You will need to set the environment variables (under Android SDK) appropriately, e.g.:

  • Android SDK : /Users/bob/Library/Android/sdk
  • Android NDK : /Users/bob/Library/Android/sdk/ndk/25.1.8937393
  • Location of JAVA : /Library/Java/JavaVirtualMachines/adoptopenjdk-8.jdk/Contents/Home
  • SDK API Level : android-32
  • NDK API Level : android-32

For that version of java (jdk 8) which is required to successfully build for android, you can (on macos) install it via:

brew install --cask adoptopenjdk8

unreal-rtsp-display's People

Contributors

alexchunlin avatar finger563 avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar

unreal-rtsp-display's Issues

Username / Password Authentication

Answers checklist.

  • I have read the documentation and the issue is not addressed there.
  • I have searched the issue tracker for a similar issue and not found a similar issue.

General issue report

Hello, thank you very much for providing the plugin. If there is a password and account in my RTSP address, how should I fill it out, similar to this,rtsp://admin:XxXxX@[email protected]:554/Streaming/Channels/101。

Connect call blocks game thread

Answers checklist.

  • I have read the relevant documentation and the issue is not addressed there.
  • I have searched the issue tracker for a similar issue and not found a similar issue.

What is the expected behavior?

Calling connect should not block the game thread.

What is the actual behavior?

Connect will block the game thread until it either connects or times out (which could be a long time)

Steps to reproduce.

  1. Play the provided map in editor, with an invalid RTSP server address (or shut off the RTSP server)
  2. See that the entire editor hangs until the connect timeout

Build or installation Logs.

No response

More Information.

No response

Controls / UI when playing for configuring and controlling the RTSP Client

Is your feature request related to a problem?

Right now, there is no way to send commands such as PLAY or PAUSE to the RTSP server via the client while playing, and there is no way to change the server configuration. Similarly there is no way to monitor the connection state (other than by viewing the stream) and there is no way to explicitly connect / disconnect from the server.

Describe the solution you'd like.

Some basic UI (using UMG) which exposes some of the server parameters (such as address, port, path, etc.) as well as which provides controls for connecting, playing, pausing, disconnecting, etc. It should also show the connection state along with some other stats (such as received FPS, image size, bit rate, etc.).

Potentially the UI should have a static image showing the received stream as well (as an example of doing so as well as to allow the stream to be visible no matter where in the level you are)

Describe alternatives you've considered.

Continuing to only connect on begin play and to require stopping play to change any parameters.

Additional context.

Related to #1 as well

Mobile App Support

Is your feature request related to a problem?

Having to run the example on a computer is a little annoying, being able to run it on a phone would be nice :)

Describe the solution you'd like.

Make any necessary adjustments for allowing it to run on Android and iOS. Upload packages for those platforms as releases.

Describe alternatives you've considered.

No response

Additional context.

Related to #2

Build errors relating to use of char type and string_view

Answers checklist.

  • I have read the relevant documentation and the issue is not addressed there.
  • I have searched the issue tracker for a similar issue and not found a similar issue.

What is the expected behavior?

Building from source should compile successfully with no errors or warnings

What is the actual behavior?

"converting from int to char requires a narrowing conversion"
"= truncates a constant value"
etc.

Steps to reproduce.

  1. Build (might not be seen if using Clang)
  2. Cry

Build or installation Logs.

No response

More Information.

No response

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.