javascript - ExtJS 标签方向

Question

如何使 ExtJS标签水平呈现，如下所示：

------------
-          -
------------

垂直渲染如下：

----
-  -
-  -
-  -
----

当然包括其中的文字。

在 css 中，我会设置文本的样式，writing-mode: vertical-lr;用于在适当的方向（source）编写文本。但是在这种情况下，为了使包含标签的组件以适当的大小呈现，我需要更改整个容器的方向。

因此，这在 ExtJS 4.1+ 中可行吗？如果是，如何？小提琴将不胜感激！

Answer 1

为了使用 ExtJS 执行此操作，您需要将文本项绘制为 90 度：

Ext.create('Ext.panel.Panel', {
    title: 'Panel with VerticalTextItem',
    width: 300,
    height: 200,
    lbar: {
        layout: {
            align: 'center'
        },
        items: [{
            xtype: 'text',
            text: 'Sample VerticalTextItem',
            degrees: 90
        }]
    },
    renderTo: Ext.getBody()
});

这将创建一个带有旋转到 90° 的文本项的面板。此代码示例可以在 Ext.draw.Text 上的 ExtJS 文档中找到，并且在 4.1.0 及更高版本中可用。这是根据要求对上述代码进行的修改。