takumi 0.68.13

Render your React components to images.
Documentation 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39

use image::RgbaImage;
use taffy::Layout;

use crate::{
  layout::style::{Affine, BorderStyle, Color, ImageScalingAlgorithm, Sides, SpacePair},
  rendering::{BorderProperties, Canvas},
};

/// Draws debug borders around the node's layout areas.
pub fn draw_debug_border(canvas: &mut Canvas, layout: Layout, transform: Affine) {
  // border-box
  BorderProperties {
    width: Sides([1.0; 4]).into(),
    color: Color([255, 0, 0, 255]), // red
    radius: Sides([SpacePair::from_single(0.0); 4]),
    image_rendering: ImageScalingAlgorithm::Auto,
    style: BorderStyle::Solid,
  }
  .draw::<RgbaImage>(canvas, layout.size, transform, None);

  // content-box
  BorderProperties {
    width: Sides([1.0; 4]).into(),
    color: Color([0, 255, 0, 255]), // green
    radius: Sides([SpacePair::from_single(0.0); 4]),
    image_rendering: ImageScalingAlgorithm::Auto,
    style: BorderStyle::Solid,
  }
  .draw::<RgbaImage>(
    canvas,
    layout.content_box_size(),
    transform
      * Affine::translation(
        layout.padding.left + layout.border.left,
        layout.padding.top + layout.border.top,
      ),
    None,
  );
}