Introduction to C# API

Customer's Canvas 5 provides a software development kit (SDK). This SDK allows you to both create product designs from scratch in the Design Atoms Framework and work directly with the Customer's Canvas object model.

The back-end C# API allows you to create custom design editors on your servers as well as stand-alone desktop applications. Alternatively to this back-end API, you can create your product designs on the front end by using the Design Atoms Framework.

Now, let us describe how you can create product designs from scratch and render them through the C# API:

Creating a Product

For your product, you need to create an instance of the Product class and add a collection of Surfaces to this instance.

C#
var product = new Product();
var surface = new Surface(800, 800);

product.Surfaces.Add(surface);
Note

The default measurement units in Customer's Canvas are points.

Adding Design Elements

To add new design elements, first create the Main container for them.

C#
var mainContainer = new Container {Name = Configuration.MAIN_CONTAINER_NAME};
surface.Containers.Add(mainContainer);

After that, you can create new elements and add them to the Items collection. Let us see how you can add such elements as bounded text, image placeholders, and barcodes.

C#
// Add an image placeholder with a rectangular frame.
var photoFile = new FileInfo(Server.MapPath("https://example.com/c.bennett.jpg"));
var photoImage = new ImageItem(photoFile, new PointF(91, 146), 156, 234);
var photoPlaceholder = new PlaceholderItem()
{
    SourcePath = Path.CreateRectanglePath(new RectangleF(86 + 12, 159 + 12, 147, 184)),
    ManipulationPermissions = new ManipulationPermissions(false),
    Content = photoImage,
    Name = "photo"
};
mainContainer.Items.Add(photoPlaceholder);

// Add a bounded text item supporting copyfitting.
var nameItem = new BoundedTextItem("Cristopher Bennett", new RectangleF(112, 362, 120, 60), "Roboto-Bold", 25)
{
    Alignment = TextAlignment.Center,
    VerticalAlignment = TextVerticalAlignment.Center,
    OverflowStrategy = OverflowStrategy.FitToBox,
    OriginalFontSize = 25,
    Name = "employee"
};
mainContainer.Items.Add(nameItem);

// Add a barcode.
var barcode = new BarcodeItem(BarcodeFormat.EAN_8, "1234567", 
    new BarcodeItem.EncodingOptions{ PureBarcode = true }, new PointF(71, 418), 202, 50)
{
    Name= "barcode"
};
mainContainer.Items.Add(barcode);

Adding Mockups

You can add both overlaying and underlying mockups to your product surfaces by adding your images to the SurfaceMockup.OverContainers and SurfaceMockup.UnderContainers collections.

C#
var fileInfo = new FileInfo(Server.MapPath("https://example.com/mockup.png"));
var mockupImage = new ImageItem(fileInfo, new PointF(0, 0), surface.Width, surface.Height);
var mockupContainer = new MockupContainer(new[] {mockupImage});
surface.Mockup.OverContainers.Add(mockupContainer);

Changing Design Elements

You can find elements that fit by some criterion and change their content. In the following example, a bounded text element with the "employee" name gets new content.

C#
var item = product.AllItems.OfType<BoundedTextItem>().FirstOrDefault(x => x.Name == "employee");
if (item != null)
{
    item.Text = "John Wood";
}

Adding Safety Lines

To define an area to be printed, you need to create an instance of the PrintArea class. You can specify a bleed zone by adding SafetyLines and CropMarks to print areas. For example, let us see how you can add safety lines.

C#
var printArea = new PrintArea(new RectangleF(0, 0, surface.Width, surface.Height));
var safetyLine = new SafetyLine
{
    Margin = new Margin(10, 70),
    Color = RgbColor.Lime,
    StepPx = 3
};

printArea.SafetyLines.Add(safetyLine);
surface.PrintAreas.Add(printArea);

Rendering the Product

You can use the IProductRenderer interface to render proof images and hi-res outputs.

C#
var productRenderer = Injector.Instance.Resolve<IProductRenderer>();
var proofId = productRenderer.RenderProof(product.Surfaces.First(), null);
var hiresId = productRenderer.RenderHiRes(product, null);

Here, we use the dependency injection service that instantiates all necessary dependencies of IProductRenderer.

These methods return string identifiers of the proof image for the specified surface and the hi-res output for specified printArea. You can retrieve obtained images from the cache as follows:

C#
var proofImage = Injector.Instance.Resolve<IFileCache>.GetReadStream(proofId);
var hiresImage = Injector.Instance.Resolve<IFileCache>.GetReadStream(hiresId);

See Also

Manual