Deserialize IDrawingLine on server console application?

[maslewandowski]

Hi there,
I thought that it would be genius to transfer drawingline sketches via json to the server and the server should deserialize the IDrawingLines and create an image of it to save this image.

Well i created a .net 8 project and added the CommunityToolkit.Maui package to use the DrawingView.GetImageStream method.
sadly this does not work. there is no exception, but i guess it is because i dont' call the UseMauiCommunityToolkit() method at the start of my app. the returnvalue of a valid enumeration of IDrawingLine that comes from the GetImageStream method is always null.

Well my question now ist: Is it possible to use the CommunityToolkit.Maui.DrawingView in a .net 8 console application to create an image of IDrawingLine enumerable?

using var signatureImageStream = await DrawingView.GetImageStream(visitor.Signature, new Size(1024, 1024), Microsoft.Maui.Graphics.Colors.White);

[maslewandowski]

newtonsoft.json serializes the idrawinglines like this:
i added a identifier as guid

"Sketches": [
  {
    "Identifier": "0a7c3302-ce7b-4b9a-b496-9230d8ab5139",
    "Lines": [
      {
        "LineColor": "#008000",
        "LineWidth": 3.0,
        "Points": [ "592.5, 126.5", "586, 122.5", "580, 122.5", "571, 122.5", "560.5, 122.5", "546.5, 122.5", "532.5, 122.5", "517.5, 124.5", "498.5, 132", "480.5, 142", "462, 154.5", "445.5, 167.5", "429.5, 181", "415, 195.5", "401.5, 210", "389.5, 225", "379.5, 237.5", "370, 250.5", "362, 261", "356.5, 270", "352.5, 279", "349, 287.5", "347.5, 295.5", "347, 306", "347, 315.5", "347, 325", "349, 334", "354, 342.5", "358.5, 349", "365.5, 356", "373, 362", "380.5, 367", "389.5, 370.5", "398.5, 373.5", "408.5, 375.5", "419, 377.5", "429.5, 378", "440.5, 378.5", "452.5, 378.5", "476, 377.5", "610.5, 302.5", "620.5, 296.5", "629.5, 292", "636.5, 289", "644.5, 287", "651, 286.5", "656, 286.5", "661.5, 289", "664.5, 295", "666.5, 303", "667, 313", "667, 324", "665, 337.5", "660, 350", "653.5, 362.5", "646, 375.5", "637.5, 387", "629, 397", "621.5, 405", "612.5, 412.5", "604, 419", "594.5, 423.5", "585.5, 426", "576.5, 426.5", "569, 426.5", "561.5, 419.5", "556.5, 410", "554, 399", "553.5, 391", "553.5, 385", "553.5, 380", "553.5, 378", "553.5, 377.5", "552, 386", "545.5, 399", "537.5, 411.5", "528.5, 422.5", "519, 431.5", "510, 437.5", "500.5, 442", "491, 444", "482.5, 444.5", "472.5, 444.5", "465, 443", "457.5, 440", "447.5, 436", "472, 442", "480, 454.5", "488.5, 465.5", "498.5, 474.5", "510.5, 482", "525, 487", "542, 490.5", "563, 491.5", "584.5, 491.5", "606.5, 489.5", "629.5, 483.5", "651.5, 476" ],
        "Granularity": 5,
        "ShouldSmoothPathWhenDrawn": true
      },
      {
        "LineColor": "#008000",
        "LineWidth": 5.0,
        "Points": [ "304.5, 104.5", "299, 105", "291.5, 105", "278.5, 111", "265, 117.5", "251, 121.5", "243, 124", "235.5, 126", "227.5, 128.5", "220.5, 130.5", "214.5, 132.5", "208, 135", "202.5, 137", "196.5, 139", "191.5, 141", "187, 143.5", "183, 146", "179.5, 149.5", "176.5, 153.5", "174.5, 157.5", "173.5, 163", "173.5, 170.5", "173.5, 178.5", "173.5, 188.5", "175.5, 198", "178.5, 210.5", "182, 223", "185.5, 236", "188.5, 250", "192, 264.5", "195, 278.5", "197.5, 294", "200.5, 308.5", "203, 324", "206, 339.5", "208.5, 354.5", "211, 369", "213, 382.5", "214.5, 394.5", "215.5, 404.5", "221, 456.5", "223.5, 457", "226.5, 457.5", "230, 458", "234.5, 458.5", "239.5, 459", "245.5, 459.5", "253, 459.5", "262, 460", "270, 460.5", "280, 461.5", "289.5, 462.5", "299.5, 464", "309, 465.5", "318, 467.5", "325.5, 469", "332.5, 471", "339.5, 472.5", "345.5, 473.5", "352.5, 476", "358.5, 477.5", "363.5, 479", "368.5, 481" ],
        "Granularity": 5,
        "ShouldSmoothPathWhenDrawn": true
      }
    ]
  },
  {
    "Identifier": "b386dd53-5034-4f70-85ce-6e0652a763c9",
    "Lines": [
      {
        "LineColor": "#800080",
        "LineWidth": 8.0,
        "Points": [ "736, 151", "726.5, 146.5", "721, 146", "715, 144.5", "708.5, 142.5", "701.5, 140", "693, 137", "683.5, 133.5", "674, 130.5", "663, 126.5", "650, 122.5", "638, 119", "625.5, 116", "611.5, 112.5", "598, 109", "568, 104.5", "354.5, 147", "338, 155.5", "323.5, 163.5", "307, 174", "293.5, 184.5", "282, 194.5", "270, 205.5", "259, 217.5", "249, 230.5", "240, 243.5", "231.5, 257.5", "224.5, 270.5", "219, 283.5", "214.5, 296", "211, 308.5", "208, 321", "206.5, 333", "205.5, 343.5", "205.5, 354.5", "205.5, 365.5", "205.5, 375.5", "208, 385", "212.5, 394.5", "217.5, 403.5", "224, 412", "231, 420", "239, 427.5", "247, 434", "256, 440.5", "265.5, 447", "275.5, 452.5", "287, 458.5", "297, 463", "310, 468.5", "322, 472.5", "334.5, 476", "347, 480", "360.5, 483.5", "374, 486.5", "388, 489.5", "402.5, 491.5", "416.5, 493.5", "431, 495", "445, 495.5", "459, 496", "473.5, 496", "501.5, 495.5", "631.5, 442", "640, 435.5", "647.5, 427.5", "654.5, 420", "661, 413", "666.5, 405.5", "671.5, 398.5", "676, 391.5", "680.5, 384", "683.5, 377", "686.5, 370", "689, 362.5", "690.5, 355", "692, 347.5", "692.5, 340.5", "693, 334.5", "693, 327.5", "693, 321.5", "690.5, 315.5", "687, 310", "683, 304.5", "678, 299", "672, 294", "666, 289.5", "659.5, 284.5", "651.5, 279.5", "644, 275.5", "638, 271.5", "629, 267", "621, 263", "613.5, 260", "603.5, 257", "594.5, 255.5", "585, 254.5", "575.5, 254.5", "565.5, 254.5", "556, 257.5", "546.5, 262", "537, 267", "527.5, 272.5", "519, 278", "510.5, 283", "504, 287.5", "496, 293", "489.5, 297", "482, 301.5", "475.5, 306.5", "469, 311.5", "456.5, 321", "432, 367", "431.5, 371.5", "431, 376.5", "431, 381", "430, 385", "429, 389.5", "428, 393", "426.5, 396", "424, 398.5", "421, 401", "416.5, 403", "412.5, 404", "407.5, 405", "402.5, 405", "395.5, 405", "389.5, 404.5", "383, 402", "375, 397.5", "368.5, 393.5", "360.5, 387.5", "353, 382", "347, 376", "340, 368.5", "334, 361", "328.5, 353.5", "324, 344.5", "320, 335.5", "317, 325", "315, 313", "314, 303", "314, 292.5", "314, 280", "318, 268", "323, 257", "328.5, 248.5", "335, 240.5", "342.5, 233.5", "351.5, 227", "360, 222", "369.5, 217.5", "379.5, 214", "389, 211.5", "399.5, 209.5", "409.5, 208.5", "420.5, 208", "431.5, 208", "444.5, 208", "469, 211", "616.5, 217", "630.5, 214.5", "644.5, 212", "657.5, 209", "670.5, 206", "682, 203.5", "692, 201.5", "701.5, 199", "710.5, 197.5", "717.5, 196", "725, 195.5", "731.5, 195.5", "737.5, 195.5", "744, 195.5", "749.5, 197.5", "755, 201.5", "760, 206.5", "764.5, 214.5", "768, 223", "771.5, 233.5", "774.5, 246", "777, 257.5", "780, 272", "782.5, 284", "785, 297", "787.5, 310.5", "791, 324.5", "794, 338.5", "797.5, 351.5", "800, 362", "802.5, 373", "804.5, 382", "806, 390", "806, 397", "806.5, 404", "806.5, 410", "806.5, 416", "806, 422.5", "804.5, 429", "802.5, 437", "801, 446", "800, 453.5", "800, 461", "800, 466", "800.5, 469.5", "803.5, 471" ],
        "Granularity": 5,
        "ShouldSmoothPathWhenDrawn": true
      }
    ]
  },
  {
    "Identifier": "c315ebaf-ad8c-4f37-814f-269edc672acc",
    "Lines": [
      {
        "LineColor": "#800080",
        "LineWidth": 8.0,
        "Points": [ "128.5, 408.5", "138, 393.5", "166.5, 342", "176.5, 322.5", "188.5, 302", "205.5, 278.5", "220.5, 254.5", "236, 233.5", "252.5, 214", "267.5, 196.5", "284.5, 178", "302, 161", "319.5, 145", "336.5, 130.5", "353, 118", "366.5, 109", "380, 102", "390, 97.5", "398, 96", "404, 95.5", "408.5, 95.5", "410, 102.5", "409.5, 117", "400, 138", "388.5, 162.5", "372, 194.5", "356, 225.5", "340, 257.5", "326, 284", "316, 310", "305.5, 337", "296.5, 363.5", "290.5, 385", "287, 405", "287, 418.5", "287, 427.5", "288.5, 433", "294.5, 434.5", "306.5, 433", "319, 423.5", "337, 408", "355, 389", "397.5, 338.5", "582.5, 177.5", "579, 196", "565, 224", "549.5, 254.5", "533.5, 283", "521.5, 309", "507, 337", "493.5, 365.5", "483.5, 393", "477, 414.5", "473.5, 434.5", "473, 449.5", "473, 462.5", "476, 471.5", "482.5, 479", "491.5, 482", "500.5, 482" ],
        "Granularity": 5,
        "ShouldSmoothPathWhenDrawn": true
      },
      {
        "LineColor": "#FF0000",
        "LineWidth": 8.0,
        "Points": [ "117, 123.5", "121.5, 126.5", "126.5, 129", "133, 132.5", "152, 143.5", "164, 151.5", "179.5, 162", "196, 172.5", "215, 184.5", "235.5, 196.5", "260.5, 210.5", "281.5, 222", "308.5, 235.5", "335, 247", "362.5, 258.5", "391.5, 269.5", "419, 279.5", "446.5, 289.5", "474.5, 299.5", "503.5, 310.5", "535.5, 320", "569, 331.5", "601.5, 342.5", "632, 353.5", "661, 363.5", "687.5, 374", "709.5, 382.5", "731, 391.5", "781, 413.5", "827, 435.5", "826.5, 432.5" ],
        "Granularity": 5,
        "ShouldSmoothPathWhenDrawn": true
      },
      {
        "LineColor": "#FF0000",
        "LineWidth": 8.0,
        "Points": [ "810, 627.5" ],
        "Granularity": 5,
        "ShouldSmoothPathWhenDrawn": true
      }
    ]
  }
]

[bijington]

We don't provide any support for .NET 8.0. You would need to translate the deserialised lines into an image yourself. You could use something like ImageSharp or SkiaSharp to handle that

[maslewandowski]

All right, thank you. Then I save these images as PNG on the device just before the data is transferred to the server.

[stephenquan]

Does ViewExtensions.CaptureAsync(IView) do anything for you?

https://learn.microsoft.com/en-us/dotnet/api/microsoft.maui.viewextensions.captureasync?view=net-maui-8.0#microsoft-maui-viewextensions-captureasync(microsoft-maui-iview)

[CliffAgius]

Closed as Answered.