Power up your DJI Ryze Tello drone with .NET

The DJI Ryze Tello of DJI is an entry-level drone. It not only has a very wide range of applications in STEM education, but also can be used as the first choice for getting started with programming. Calling the DJI Ryze Tello SDK through the UDP protocol allows the DJI Ryze Tello drone to perform take-off, landing, steering and different fancy actions. This article will create an application to control DJI Ryze Tello through .NET.

.NET UDP Programming

What is UDP

"UDP (User Datagram Protocol) is a long-term protocol used with the IP protocol to send data where transmission speed and efficiency are more important than security and reliability. UDP uses a simple, minimal protocol mechanism A connectionless communication model. UDP uses checksums to ensure data integrity, and uses port numbers to distinguish different applications in the data sender and receiver. It does not require a handshake session, which directly exposes the unreliable underlying network to the user's Application: No guarantee of message delivery, no guarantee of delivery order, and no guarantee of non-duplication of messages. If error correction at the network interface level is required, the application can use the Transmission Control Protocol (TCP) or Stream Control Transmission Protocol designed for this purpose (SCTP)."

In the field of on-site real-time measurement and control, if there are requirements for real-time, anti-interference, security, etc., UDP can be used to transmit data. I think this is why DJI Ryze Tello uses UDP protocol for communication.

C# calls UDP Client

Under System.Net.Sockets, you can use the UdpClient class to complete the related calls of the UDP protocol. This is the example given to us by the official

The UdpClient class provides simple methods for sending and receiving connectionless UDP datagrams in blocking synchronous mode. Because UDP is a connectionless transport protocol, there is no need to establish a remote host connection before sending and receiving data. However, you do have the option of establishing a default remote host in one of two ways:

Create an instance of the UdpClient class with the remote hostname and port number as parameters

Create an instance of the UdpClient class and call the Connect method

You can send data to a remote device using any of the send methods available in UdpClient. Use the Receive method to receive data from a remote host.

Connect DJI Ryze Tello with .NET Polyglot Notebook

Interactive programming of .NET can be done through Polyglot Notebook. Before packaging the DJI Ryze Tello SDK with .NET, we can use Notebooks to connect to DJI Ryze Tello for related prototype testing.

To connect to DJI Ryze Tello SDK, you need to connect to 192.168.10.1 and port 11111 through UDP.

The way to call UDPClient connection through C# is as follows

string telloIP = "192.168.10.1";

int telloPort = 8889;

UdpClient udpClient = new UdpClient();

udpClient.Connect(telloIP,telloPort);

And encapsulate the method of instruction execution

public  void Command(UdpClient udpClient,string cmd)
{

    Byte[] sendCmdBytes = null;
            
    sendCmdBytes = Encoding.UTF8.GetBytes(cmd);
      
    udpClient.Send(sendCmdBytes, sendCmdBytes.Length);
}

After completing the above settings, you can execute the corresponding command to complete the operation of controlling DJI Ryze Tello

Command(udpClient,"command");

Command(udpClient,"takeoff");

Command(udpClient,"land");

Combined with .NET Polyglot Notebook, the operation of DJI Ryze Tello and related technical tests can be completed. The following video is the specific effect of Notebooks controlling DJI Ryze Tello

.NET Notebooks control DJI Tello

Building the DJI Ryze Tello app with .NET MAUI

.NET MAUI is a cross-platform, cross-device front-end application technology. The development team can use a programming language C# to complete the application development of iOS / Android / macOS / Windows. Now is the era of multiple terminals. It is great to control your DJI Ryze Tello through different devices and build multiple application scenarios. This series mainly controls DJI Ryze Tello through iOS and Android mobile devices, the following are some key steps

Build front-end UI with .NET Comet

Comet is a modern way to write cross-platform UI (  GitHub - dotnet/Comet: Comet is an MVU UIToolkit written in C#  ). Based on .NET MAUI, it adopts Model - Views - Update (MVU) mode. Compared with traditional XAML, it has several notable features

1. Based on functional programming

2. Comet refers to the way SwiftUI and Flutter describe the interface, making it easier to write page-level logic, such as:

       3. Using Comet to develop .NET MAUI applications can be developed not only on Visual Studio, but also on Visual Studio Code.

Note:  If you need to debug .NET MAUI applications in Visual Studio Code, please install C# and .NET Comet components

Techniques for Binding iOS/Android Native Libraries

A good application needs to integrate a lot of scenarios, such as payment, e-commerce, maps, etc. As a development team, there is no need to repeatedly build a car, and it can directly call different SDKs to complete related operations. .NET MAUI solves the problems of cross-platform application interface and most of the page logic and business logic. But when we use the third-party SDK, you will find that there is a lack of native libraries related to .NET MAUI. Through Binding, .NET MAUI can be bound to native libraries of iOS/Android.

From the DJI Ryze Tello SDK documentation, we can know that DJI Ryze Tello can be controlled through UDP, and the camera signal of DJI Ryze Tello can also be transmitted in real time through UDP. At this time, we need to use the libVLC library to perform H264 encoding and decoding services on the UDP signal provided by the DJI Ryze Tello camera and display it on the interface of the mobile application.

On .NET MAUI, I usually create iOS / Android native binding projects through the command line, as follows 

dotnet new iosbinding -o VLCSharp.iOS 

dotnet new android-bindinglib -o VLCSharp.Droid

iOS binding libVLC library related skills

1. Do initial conversion with Sharpie

We bind the libVLC library MobileVLCKit.framework for iOS by installing Sharpie, and quickly convert the libVLC library by executing the following command

sharpie bind -framework ./MobileVLCKit.framework --namespace MobileVLCKit -sdk iphoneos16.1

Note: The iOS version corresponding to the iOS native library, otherwise you will not be able to convert

After conversion, replace StructsAndEnums.cs and ApiDefinitions.cs in the project and add MobileVLCKit.framework to the iOS binding project VLCSharp.iOS

      2. Modify the csproj file and add all the libraries that the native library depends on

<Project Sdk="Microsoft.NET.Sdk">
  <PropertyGroup>
    <TargetFramework>net7.0-ios</TargetFramework>
    <RootNamespace>MobileVLCKit</RootNamespace>
    <Nullable>enable</Nullable>
    <ImplicitUsings>true</ImplicitUsings>
    <IsBindingProject>true</IsBindingProject>
	<AllowUnsafeBlocks>true</AllowUnsafeBlocks>
	<NoBindingEmbedding>false</NoBindingEmbedding>
  </PropertyGroup>

  <ItemGroup>
    <ObjcBindingApiDefinition Include="ApiDefinition.cs" />
    <ObjcBindingCoreSource Include="StructsAndEnums.cs" />
  </ItemGroup>

  <ItemGroup>
    <NativeReference Include="MobileVLCKit.framework">
      <Kind>Framework</Kind>
      <IsCxx>True</IsCxx>
      <ForceLoad>True</ForceLoad>
      <SmartLink>True</SmartLink>
      <Frameworks>MediaPlayer Accelerate AssetsLibrary AVFoundation CoreMedia AudioToolbox CoreData CoreMedia CoreSpotlight MobileCoreServices CoreAudio OpenGLES CFNetwork CoreText QuartzCore CoreGraphics UIKit Security StoreKit SystemConfiguration VideoToolbox</Frameworks>
      <LinkerFlags>-lbz2 -liconv -lstdc++</LinkerFlags>
    </NativeReference>
  </ItemGroup>
</Project>

      3. To compile, please   download and replace StructsAndEnums.cs and ApiDefinitions.cs from GitHub https://github.com/kinfey/dotNETMauiHOL/tree/main/code/apps/02.Binding/TelloApp.Bindings/VLCSharp.iOS

After the replacement, the compilation is successful

If you want to learn more about iOS Binding knowledge and related skills, you can learn about  AMapMAUIControls/01.iOSBinding.md at main · kinfey/AMapMAUIControls · GitHub

Android binding libVLC library related skills

1. Create a Jars folder and add Android's libVLC library org.videolan.libvlc.aar to the bound project Jars folder

2. Modify the .csproj file

   <Project Sdk="Microsoft.NET.Sdk">
     <PropertyGroup>
       <TargetFramework>net7.0-android</TargetFramework>
       <SupportedOSPlatformVersion>21</SupportedOSPlatformVersion>
       <Nullable>enable</Nullable>
       <ImplicitUsings>enable</ImplicitUsings>
     </PropertyGroup>
   
     <ItemGroup>
       <LibraryProjectZip Include="Jars\org.videolan.libvlc.aar" />
     </ItemGroup>
   
     <ItemGroup>
       <TransformFile Include="Transforms\Metadata.xml" />
       <TransformFile Include="Transforms\EnumFields.xml" />
       <TransformFile Include="Transforms\EnumMethods.xml" />
     </ItemGroup>
   </Project>

3. Compilation, same compilation error as iOS, please  download from GitHub https://github.com/kinfey/dotNETMauiHOL/tree/main/code/apps/02.Binding/TelloApp.Bindings/VLCSharp.Droid
   
   and replace EnumMethods.xml after replacement , the compilation is successful. If you want to know more about Android Binding knowledge and related skills, you can learn about it through this link  https://github.com/kinfey/AMapMAUIControls/blob/main/tutorial/cn/02.DroidBinding.md

Custom interface controls

.NET MAUI can build custom interface controls through Handler. We bind LibVLC through Handler to realize image transmission, and it is different from general custom page controls. Although libVLC library is used, the calling method and construction method are different on different platforms. Yes, so it is necessary to complete the definition for different controls on Platforms, respectively define the iOS folder to add VideoPlayerView.ios.cs, and the Android folder to add VideoPlayerView.android.cs

Afterwards, the definition of the custom VLC control is completed by invoking the classes inherited from Handler

We can seamlessly add custom VLC controls to our application, which is seamlessly connected with Commet UI 

new VStack{
    new VlcUI().Padding(20).Alignment(Alignment.TopLeading)
}.Frame(width:400,height:300).Alignment(Alignment.Center),

We can take a look at the implementation effect on Android. Through image transmission, we can obtain the camera signal of DJI Ryze Tello on the application side in real time.

After we finish building the page logic and business logic, we can use the iOS/Android app built with .NET MAUI to quickly start DJI Ryze Tello. The picture below shows the effect of controlling the takeoff and landing of DJI Ryze Tello on the iPhone, as well as real-time image transmission.

.NET MAUI build drone application

summary

This is the main steps to control DJI Ryze Tello through .NET. If you want to know more details and more detailed content, please visit  https://github.com/kinfey/dotNETMauiHOL  , which includes complete learning content, and For specific details, I hope you can better grasp the skills of using .NET MAUI cross-platform applications and make more interesting applications. You can learn related content in the following order

learning topics	related information	Enter
Development environment configuration	Development environment construction skills, including the installation of .NET MAUI environment, the configuration of development tools and the conditions to be prepared for the development of iOS/Android applications	Enter
C# UDP Programming Fundamentals	Learn C# UDP programming, and connect to DJI Ryze Tello through Notebooks to complete the construction of prototype development	Enter
.NET MAUI Basic Learning	Learn about .NET MAUI, including iOS/Android development	Enter
.NET MAUI Comet UI build application interface	Learn about .NET MAUI Comet and use .NET MAUI Comet to build application interfaces	Enter
.NET MAUI native library for binding mobile applications	Learn to migrate native libraries of mobile applications to .NET MAUI	Enter
.NET MAUI build a complete project skills	Skills for building a complete project with .NET MAUI, including knowledge of different platform settings and custom controls	Enter

related resources

1. Build DJI Ryze Tello drone application series with .NET MAUI  https://github.com/kinfey/dotNETMauiHOL

2. Learn .NET MAUI  https://aka.ms/mauiBlog.Learn

3. About .NET Polyglot Notebook  https://aka.ms/mauiBlog.Notebook

4. .NET MAUI binding iOS native library  https://aka.ms/mauiBlog.iOSBinding

5. .NET MAUI binding Android native library  https://aka.ms/mauiBlog.DroidBinding

6. .NET MAUI Custom Page Control  https://aka.ms/mauiBlog.CustomUI

7. C# calls UDP  https://aka.ms/mauiBlog.UDP