用 .NET 启动你的 DJI Ryze Tello 无人机

大疆的 DJI Ryze Tello 是入门级的无人机,不仅在 STEM 教育中有非常广泛的应用,也可以作为编程入门的首选。通过 UDP 协议调用 DJI Ryze Tello SDK 可以让 DJI Ryze Tello 无人机执行起飞,降落,转向以及不同的花式动作。本文将会通过 .NET 创建应用控制 DJI Ryze Tello。

1  .NET UDP 编程

1.什么是 UDP
“UDP(用户数据报协议)是一个与IP 协议一起使用的长期协议,用于在传输速度和效率比安全性和可靠性更重要的场合下发送数据。UDP 使用一个简单的、具有最小协议机制的无连接通信模型。UDP 使用校验和保证数据完整性,使用端口号以区分数据发送方和接收方中不同的应用程序。它无需握手会话,即将不可靠的底层网络直接暴露给了用户的应用程序:不保证消息交付、不保证交付顺序也不保证消息不重复。如果需要网络接口层面的纠错功能,则应用程序可以使用为此目的设计的传输控制协议(TCP)或者流控制传输协议(SCTP)。”.
在现场实时测控领域,如果有实时、抗干扰性、安全性等要求,都可以采用 UDP 传输数据。我想这也是 DJI Ryze Tello 为何使用 UDP 协议通信的原因。
2.C# 调用 UDP Client
在 System.Net.Sockets 下你可以通过类 UdpClient 来完成 UDP 协议的相关调用。这是官方给我们的例子
UdpClient 类提供了在阻塞同步模式下发送和接收无连接 UDP 数据报的简单方法。因为 UDP 是一种无连接的传输协议,所以在发送和接收数据之前不需要建立远程主机连接。但是,您确实可以选择通过以下两种方式之一建立默认远程主机:
使用远程主机名和端口号作为参数创建 UdpClient 类的实例
创建 UdpClient 类的实例,然后调用 Connect 方法
您可以使用 UdpClient 中提供的任何发送方法将数据发送到远程设备。使用 Receive 方法从远程主机接收数据。

2,用 .NET Polyglot Notebook 

连接 DJI Ryze Tello

用 .NET 封装 DJI Ryze Tello SDK 之前我们可以用 Notebooks 连接 DJI Ryze Tello 做相关原型测试。
要连通 DJI Ryze Tello SDK ,需要通过 UDP 连通 192.168.10.1 以及端口 11111.
通过 C# 调用 UDPClient 连接的方式如下
string telloIP = "192.168.10.1";

int telloPort = 8889;

UdpClient udpClient = new UdpClient();

udpClient.Connect(telloIP,telloPort);

并封装好指令执行的方法

public  void Command(UdpClient udpClient,string cmd)
{

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

完成上面的设置,你就可以执行对应的指令完成控制 DJI Ryze Tello 的操作

Command(udpClient,"command");

Command(udpClient,"takeoff");

Command(udpClient,"land");

结合 .NET Polyglot Notebook 就可以完成对 DJI Ryze Tello 的操作以及相关技术测试。以下视频是 Notebooks 控制 DJI Ryze Tello 的具体效果

用 .NET 启动你的 DJI Ryze Tello 无人机

用 .NET MAUI 

构建 DJI Ryze Tello 应用

.NET MAUI 是跨平台,跨设备的前端应用技术,开发团队使用一种编程语言 C# 就可以完成 iOS / Android / macOS / Windows 的应用开发。现在是多终端的年代,通过不同设备控制你手上的 DJI Ryze Tello , 搭建多应用场景是非常棒的。本系列主要通过 iOS 和 Android 移动设备控制 DJI Ryze Tello, 以下是一些关键步骤

1.通过 .NET Comet 构建前端 UI

Comet 是⼀种编写跨平台 UI 的现代⽅式 ( https://github.com/dotnet/Comet )。基于 .NET MAUI,它采⽤Model - Views - Update (MVU) 模式. 和传统的 XAML 相⽐ , 它有⼏个显著的特点

  • 基于函数式编程

  • Comet 参考了 SwiftUI 和 Flutter 描述界面的方式,更容易去编写页面层次逻辑,如:

用 .NET 启动你的 DJI Ryze Tello 无人机

  • 用 Comet 开发 .NET MAUI 应用不仅可以在 Visual Studio 上开发 ,也可以在 Visual Studio Code 上开发。

注意:如果需要在 Visual Studio Code 调试 .NET MAUI 应用,请安装 C# 和 .NET Comet 组件

2.绑定 iOS/Android 原生库的技巧

一个好的应用需要整合非常多的场景,如支付,电商,地图等,作为开发团队不需要重复造车,直接可以调用不同的 SDK 来完成相关的操作。.NET MAUI 解决了跨平台应用界面和绝大多数页面逻辑以及业务逻辑的问题。但当我们使用第三方 SDK 时你会发现缺少相关 .NET MAUI 的原生库,通过 Binding 可以让 .NET MAUI 绑定 iOS / Android 的原生库。
从 DJI Ryze Tello SDK 文档可知通过 UDP 可以控制 DJI Ryze Tello , 也可以通过 UDP 实时图传 DJI Ryze Tello 的摄像头信号。这个时候我们需要通过 libVLC 库对 DJI Ryze Tello 摄像头提供的 UDP 信号进行 H264 编码解码的服务并显示在移动应用的界面上。
在 .NET MAUI 上,我一般通过命令行创建 iOS / Android 原生绑定项目,如下
dotnet new iosbinding -o VLCSharp.iOS 

dotnet new android-bindinglib -o VLCSharp.Droid
3. 绑定 iOS/Android 原生库的技巧
  • 用 Sharpie 做初次转换

我们通过安装 Sharpie 针对 iOS 的 libVLC 库 MobileVLCKit.framework 进行绑定,通过执行以下命令可以快速转换 libVLC 的库

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

注意:iOS 原生库对应的 iOS 版本,否则你是没办法进行转换

转换后替换项目中的 StructsAndEnums.cs 和 ApiDefinitions.cs 以及把 MobileVLCKit.framework 添加到 iOS 绑定的项目 VLCSharp.iOS 中
  • 修改 csproj 文件,把原生库依赖的库都需要添加进去
<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>

编译,请从 GitHub https://github.com/kinfey/dotNETMauiHOL/tree/main/code/apps/02.Binding/TelloApp.Bindings/VLCSharp.iOS 下载并替换 StructsAndEnums.cs 和 ApiDefinitions.cs

替换后编译就成功了

如果希望了解更多 iOS Binding 的知识和相关技巧,你可以通过该链接了解

https://github.com/kinfey/AMapMAUIControls/blob/main/tutorial/cn/01.iOSBinding.md

4.Android 绑定 libVLC 库相关技巧

  • 创建 Jars 文件夹,把 Android 的 libVLC 的库 org.videolan.libvlc.aar 添加到绑定的项目 Jars 文件夹中

  • 修改 .csproj 文件

<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>
  • 编译,和 iOS ⼀样编译出错,请从 GitHub

https://github.com/kinfey/dotNETMauiHOL/tree/main/code/apps/02.Binding/TelloApp.Bindings/VLCSharp.Droid 下载并替换 EnumMethods.xml

替换后,编译成功了

如果希望了解更多 Android Binding 的知识和相关技巧,你可以通过该连接了解

https://github.com/kinfey/AMapMAUIControls/blob/main/tutorial/cn/02.DroidBinding.md

3  自定义界面控件

.NET MAUI 可以通过 Handler 构建自定义界面控件,我们通过 Handler 绑定 LibVLC 实现图传,而且和一般自定义页面控件不同虽然用的都是 libVLC 库,但在不同平台上调用方式以及构建方式是不同的,所以在 Platforms 上需要针对不同的控件来完成定义,分别定义 iOS 文件夹新增 VideoPlayerView.ios.cs , Android 文件夹新增 VideoPlayerView.android.cs

用 .NET 启动你的 DJI Ryze Tello 无人机

之后再通过继承 Handler 的类分别调用来完成自定义 VLC 控件的定义

用 .NET 启动你的 DJI Ryze Tello 无人机

我们可以无缝把自定义的 VLC 控件添加到我们的应用中,和 Commet UI 是无缝对接的
new VStack{
    new VlcUI().Padding(20).Alignment(Alignment.TopLeading)
}.Frame(width:400,height:300).Alignment(Alignment.Center),
我们可以看看那安卓上的实现效果,通过图传可以实时在应用端获取 DJI Ryze Tello 的摄像头信号

用 .NET 启动你的 DJI Ryze Tello 无人机

当我们完成页面逻辑和业务逻辑构建后,我们就可以用 .NET MAUI 构建的 iOS / Android 应用快速启动 DJI Ryze Tello ,下图是在 iPhone 控制 DJI Ryze Tello 起降的效果,以及实时图传。

用 .NET 启动你的 DJI Ryze Tello 无人机

4  小结

这就是通过 .NET 控制 DJI Ryze Tello 的主要步骤,如果⼤家希望了解更多细节和更详细内容,请访问https://github.com/kinfey/dotNETMauiHOL , 这⾥⾯包括了完整的学习内容,还有具体细节,希望各位能更好地掌握⽤ .NET MAUI 跨平台应⽤的技巧,做更多有趣的应⽤。