private string StrokeRect(ICanvasRenderingContext2D ctx) { ctx.fillStyle = "#0f0"; ctx.strokeStyle = "#0f0"; ctx.shadowColor = "#00f"; ctx.shadowOffsetX = 32; ctx.shadowOffsetY = 16; ctx.shadowBlur = 8; ctx.strokeRect(32, 25, 128, 128); return @"Originals\Shadows\StrokeRect.png"; }
private string sample15(ICanvasRenderingContext2D ctx) { // Create gradients var lingrad = (ILinearCanvasGradient) ctx.createLinearGradient(0, 0, 0, 150); lingrad.addColorStop(0, "#00ABEB"); lingrad.addColorStop(0.5, "#fff"); lingrad.addColorStop(0.5, "#26C000"); lingrad.addColorStop(1, "#fff"); var lingrad2 = (ILinearCanvasGradient) ctx.createLinearGradient(0, 50, 0, 95); lingrad2.addColorStop(0.5, "#000"); lingrad2.addColorStop(1, "rgba(0,0,0,0)"); ctx.fillStyle = lingrad; ctx.fillRect(10, 10, 130, 130); ctx.strokeStyle = lingrad2; ctx.strokeRect(50, 50, 50, 50); return @"Originals\Gradients\sample15.png"; }
private string sample29(ICanvasRenderingContext2D ctx) { // Create gradients var lingrad = (ILinearCanvasGradient) ctx.createLinearGradient(0, 0, 0, 450); lingrad.addColorStop(0, "#00ABEB"); lingrad.addColorStop(0.5, "#fff"); lingrad.addColorStop(0.5, "#26C000"); lingrad.addColorStop(1, "#fff"); var lingrad2 = (ILinearCanvasGradient) ctx.createLinearGradient(150, 175, 220, 200); lingrad2.addColorStop(0.5, "#000"); lingrad2.addColorStop(0.7, "red"); lingrad2.addColorStop(1, "rgba(0,0,0,0)"); // assign gradient to fill ctx.fillStyle = lingrad; // draw shape ctx.fillRect(0, 0, 390, 390); // assign gradient to stroke ctx.strokeStyle = lingrad2; // draw shape ctx.strokeRect(100, 100, 150, 150); return @"Originals\Gradients\sample29.png"; }
private string sample14(ICanvasRenderingContext2D ctx) { // Clear canvas ctx.clearRect(-5, 0, 250, 250); // Draw guides ctx.strokeStyle = "#09f"; ctx.lineWidth = 2; ctx.strokeRect(-5, 50, 160, 50); // Set line styles ctx.strokeStyle = "#000"; ctx.lineWidth = 10; // check input ctx.miterLimit = 10; ctx.lineJoin = "miter"; // Draw lines ctx.beginPath(); //ctx.moveTo(0, 0); ctx.moveTo(0, 100); for (int i = 0; i < 24; i++) { int dy = i%2 == 0 ? 25 : -25; ctx.lineTo(Math.Pow(i, 1.5)*2, 75 + dy); } ctx.stroke(); return @"Originals\Lines\sample14.png"; }