在 KonvaJS 中水平和垂直居中文本

【问题标题】：Center text horizontally and vertically in KonvaJS在 KonvaJS 中水平和垂直居中文本
【发布时间】：2018-08-23 12:51:30
【问题描述】：

我有这样的事情：

<Stage>
  <Layer>
    <Rect />
      <Text
        ref={this.text}
        draggable 
        align="center"
      />
  </Layer>
</Stage>

文本居中对齐，但我需要垂直对齐。我怎样才能做到这一点？

我知道使用普通画布你可以做到 textBaseline="center"，但 Konva 的等价物是什么？

【问题讨论】：

【解决方案1】：

从Konva v2.3.0 你可以使用verticalAlign 属性：

<Text
  x={20}
  y={20}
  width={150}
  height={50}
  text="vertical align"
  verticalAlign="middle"
/>

【讨论】：