bs-webapi Canvas2d中的fillStyle是如何工作的

Question

我想知道如何在 ReasonML 中使用 bs-webapi 和 Canvas2d 接口创建和设置填充样式。

我想我可能需要的定义是this:

let fillStyle = (ctx: t) =>
  ctx |> fillStyle |> reifyStyle;

但是我很难理解它。

我以前使用 this project 作为示例的来源，但我认为 bs-webapi 自该项目创建以来已经发生了变化。至少以下行仿照示例：

Canvas2d.fillStyle(ctx, "rgba(0,255,255,255)");

给我这个错误：

Error: This function has type
         Webapi.Canvas.Canvas2d.t => (Webapi.Canvas.Canvas2d.style('a), 'a)
       It is applied to too many arguments; maybe you forgot a `;'.

Answer 1

你要的函数是setFillStyle:

Canvas2d.setFillStyle(ctx, String, "rgba(0,255,255,255)");

这是很久以前从fillStyle改名的，因为那时候还没有getter，惯例是getter fillStyle和[=36] =] setFillStyle。同时做了支持渐变和图案。

setFillStyle 现在的工作方式是第二个参数决定第三个参数的类型。如果将 String 作为第二个参数传递，则第三个参数必须是 string。如果你传递 Gradient，它需要是一个 gradient，你可以从 createLinearGradient 或 createRadialGradient 得到它。最后你可以传递 Pattern，这要求第三个参数是从 createPattern.

获得的 pattern

一般情况下，您应该参考the Canvas2d test file的用法示例。

bs-webapi Canvas2d中的fillStyle是如何工作的

How does fillStyle work in bs-webapi Canvas2d

html5-canvas

reason

bucklescript

bs-webapi