konvajs - Konva:如何垂直居中文本
问题描述
我正在尝试构建一个内容垂直居中的 Konva Text 容器;
var infoText = new Konva.Text({
x: 0,
y: 0,
text: `my long long ... text`,
fontSize: 18,
fontFamily: 'Arial',
width: 50,
height: 50,
align: 'center'
});
我在文档中找到了align属性,但它只能使文本水平居中。如何垂直居中?
解决方案
可以从Konva v2.3.0
:
const text = new Konva.Text({
text: 'vertical align',
x: 20,
height: rect.height(),
verticalAlign: 'middle'
});
演示: http: //jsbin.com/budekuhopi/edit ?html,js,output
老答案:
目前(v2.2.2),Konva
无法自动执行此操作。您必须进行手动调整:
const text = new Konva.Text({
text: 'vertical align',
x: 20,
});
layer.add(text);
text.y(containerHeight / 2 - text.getHeight() / 2);
推荐阅读
- c# - 带有 Sendgrid 的 ASP.NET Core 2 EmailSender 异常
- java - 如何在Android中使用线程每秒运行代码
- java - Firebase - 按值将数据检索到外部变量
- php - PHP CodeIgniter - 如何为网站根目录设置默认页面
- trace32 - 将所有函数符号及其基地址转储到 trace32 中的文本文件
- python - 预测另一个列表的对应列表时应采用什么形状的数据
- arrays - 通过 Postman 发送 JSON 会导致我的 Node.js 服务出错
- machine-learning - 什么是 epsilon/k 它是如何出现在 epsilon 贪心算法中的
- python - SymPy dsolve 为数学等效的微分方程返回不同的结果
- mysql - 使用 Laravel 查询 sql 中的 json 列