在第三期中，我们成功的利用TCP传输图片。
本期我们将图片连贯起来，利用ESP32_Cam传输图片，关于ESP32传输图片可以参考前面的公众号 欢迎大家加入交流群分享经验： **
656210280 ** ** **

[ 基于ESP32_Cam和Python的实时图像显示

](https://pic.qr2c.cn/s?__biz=MzkyMTUyMDE1OA==&mid=2247485118&idx=1&sn=4a79fb9c692e5c7fb193fa712b544508&chksm=c18317cff6f49ed9f79565e9e58e633c02b874c4f290d7415be62a84b411c58a04ac670ea4cd&scene=21#wechat_redirect)
源码放在文末

库安装

因为使用原来的Image控件的话会导致图片刷新的时候一闪一闪的很抽象。

FFImageLoading是一个用于Xamarin和.NET应用程序的强大的图片加载库，它支持缓存、异步加载和其他图像处理功能

在Nuget中获取FFImageLoading.Maui

在Xaml文件中导入命名空间。

添加一个CachedImage控件。

将之前代码中的文件路径更新替换成我们的新控件。

** 最后，初始化FFImageLoad！！！ **
** 效果展示 ** ** ESP32源码 **

---

#include "esp_camera.h"#include <WiFi.h>#include <HTTPClient.h>  
//// WARNING!!! PSRAM IC required for UXGA resolution and high JPEG quality//            Ensure ESP32 Wrover Module or other board with PSRAM is selected//            Partial images will be transmitted if image exceeds buffer size////            You must select partition scheme from the board menu that has at least 3MB APP space.//            Face Recognition is DISABLED for ESP32 and ESP32-S2, because it takes up from 15 //            seconds to process single frame. Face Detection is ENABLED if PSRAM is enabled as well  
// ===================// Select camera model// ===================//#define CAMERA_MODEL_WROVER_KIT // Has PSRAM//#define CAMERA_MODEL_ESP_EYE // Has PSRAM//#define CAMERA_MODEL_ESP32S3_EYE // Has PSRAM//#define CAMERA_MODEL_M5STACK_PSRAM // Has PSRAM//#define CAMERA_MODEL_M5STACK_V2_PSRAM // M5Camera version B Has PSRAM//#define CAMERA_MODEL_M5STACK_WIDE // Has PSRAM//#define CAMERA_MODEL_M5STACK_ESP32CAM // No PSRAM//#define CAMERA_MODEL_M5STACK_UNITCAM // No PSRAM#define CAMERA_MODEL_AI_THINKER // Has PSRAM//#define CAMERA_MODEL_TTGO_T_JOURNAL // No PSRAM//#define CAMERA_MODEL_XIAO_ESP32S3 // Has PSRAM// ** Espressif Internal Boards **//#define CAMERA_MODEL_ESP32_CAM_BOARD//#define CAMERA_MODEL_ESP32S2_CAM_BOARD//#define CAMERA_MODEL_ESP32S3_CAM_LCD//#define CAMERA_MODEL_DFRobot_FireBeetle2_ESP32S3 // Has PSRAM//#define CAMERA_MODEL_DFRobot_Romeo_ESP32S3 // Has PSRAM#include "camera_pins.h"  
// ===========================// Enter your WiFi credentials// ===========================const char* ssid = "yiyang";const char* password = "lly20030601";const char* serverUrl = "https://pic.qr2c.cn/";  // 替换为你的服务器地址  
void setupLedFlash(int pin);  
void setup() {  Serial.begin(115200);  Serial.setDebugOutput(true);  Serial.println();  //igitalWrite(4, HIGH);  camera_config_t config;  config.ledc_channel = LEDC_CHANNEL_0;  config.ledc_timer = LEDC_TIMER_0;  config.pin_d0 = Y2_GPIO_NUM;  config.pin_d1 = Y3_GPIO_NUM;  config.pin_d2 = Y4_GPIO_NUM;  config.pin_d3 = Y5_GPIO_NUM;  config.pin_d4 = Y6_GPIO_NUM;  config.pin_d5 = Y7_GPIO_NUM;  config.pin_d6 = Y8_GPIO_NUM;  config.pin_d7 = Y9_GPIO_NUM;  config.pin_xclk = XCLK_GPIO_NUM;  config.pin_pclk = PCLK_GPIO_NUM;  config.pin_vsync = VSYNC_GPIO_NUM;  config.pin_href = HREF_GPIO_NUM;  config.pin_sccb_sda = SIOD_GPIO_NUM;  config.pin_sccb_scl = SIOC_GPIO_NUM;  config.pin_pwdn = PWDN_GPIO_NUM;  config.pin_reset = RESET_GPIO_NUM;  config.xclk_freq_hz = 20000000;  config.frame_size = FRAMESIZE_UXGA;  config.pixel_format = PIXFORMAT_JPEG; // for streaming  //config.pixel_format = PIXFORMAT_RGB565; // for face detection/recognition  config.grab_mode = CAMERA_GRAB_WHEN_EMPTY;  config.fb_location = CAMERA_FB_IN_PSRAM;  config.jpeg_quality = 12;  config.fb_count = 1;    // if PSRAM IC present, init with UXGA resolution and higher JPEG quality  //                      for larger pre-allocated frame buffer.  if(config.pixel_format == PIXFORMAT_JPEG){    if(psramFound()){      config.jpeg_quality = 10;      config.fb_count = 2;      config.grab_mode = CAMERA_GRAB_LATEST;    } else {      // Limit the frame size when PSRAM is not available      config.frame_size = FRAMESIZE_SVGA;      config.fb_location = CAMERA_FB_IN_DRAM;    }  } else {    // Best option for face detection/recognition    config.frame_size = FRAMESIZE_240X240;#if CONFIG_IDF_TARGET_ESP32S3    config.fb_count = 2;#endif  }  
#if defined(CAMERA_MODEL_ESP_EYE)  pinMode(13, INPUT_PULLUP);  pinMode(14, INPUT_PULLUP);#endif  
  // camera init  esp_err_t err = esp_camera_init(&config);  if (err != ESP_OK) {    Serial.printf("Camera init failed with error 0x%x", err);    return;  }  
  sensor_t * s = esp_camera_sensor_get();  // initial sensors are flipped vertically and colors are a bit saturated  if (s->id.PID == OV3660_PID) {    s->set_vflip(s, 1); // flip it back    s->set_brightness(s, 1); // up the brightness just a bit    s->set_saturation(s, -2); // lower the saturation  }  // drop down frame size for higher initial frame rate  if(config.pixel_format == PIXFORMAT_JPEG){    s->set_framesize(s, FRAMESIZE_QVGA);  }  
#if defined(CAMERA_MODEL_M5STACK_WIDE) || defined(CAMERA_MODEL_M5STACK_ESP32CAM)  s->set_vflip(s, 1);  s->set_hmirror(s, 1);#endif  
#if defined(CAMERA_MODEL_ESP32S3_EYE)  s->set_vflip(s, 1);#endif  
// Setup LED FLash if LED pin is defined in camera_pins.h#if defined(LED_GPIO_NUM)  setupLedFlash(LED_GPIO_NUM);#endif  
  WiFi.begin(ssid, password);  WiFi.setSleep(false);  
  while (WiFi.status() != WL_CONNECTED) {    delay(500);    Serial.print(".");  }  Serial.println("");  Serial.println("WiFi connected");  Serial.print("Camera Ready! Use 'https://pic.qr2c.cn// 将图像帧转换为 Stream    WiFiClient client;    client.connect("192.168.137.226", 8081);    client.write(fb->buf, fb->len);  }  esp_camera_fb_return(fb);}