Ext-GWT文本轮换在Internet Explorer 8中不起作用

时间:2012-04-18 23:19:23

标签: gwt extjs gxt

我正在使用Ext-GWT 3.0版(特别是3.0.0-rc),并尝试通过TextSprite旋转一些文本。它适用于谷歌浏览器,但不适用于Internet Explorer 8。

Java源代码:

import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.user.client.ui.RootPanel;
import com.sencha.gxt.chart.client.draw.DrawComponent;
import com.sencha.gxt.chart.client.draw.sprite.TextSprite;
import com.sencha.gxt.widget.core.client.container.Viewport;

public class TextRotation implements EntryPoint {
    public void onModuleLoad() {
        TextSprite sprite = new TextSprite("Some text");
        sprite.setRotation(270);
        DrawComponent component = new DrawComponent();
        component.setViewBox(true);
        component.addSprite(sprite);
        Viewport vp = new Viewport();
        vp.add(component);
        RootPanel.get().add(vp);
    }
}

使用IE开发人员工具导出生成的源会产生以下结果。正在创建文本组件,但似乎位于可见区域之外:

<DIV style="WIDTH: 1268px; HEIGHT: 785px" class=GAOO-TBDNN>  <DIV style="WIDTH: 1268px; HEIGHT: 785px" __eventBits="100">
    <DIV style="WIDTH: 1268px; HEIGHT: 785px" class=x-vml-base>
      <?xml:namespace prefix = vml />
      <vml:shape style="Z-INDEX: 0" class="vml x-vml-sprite" coordsize = "21600,21600" filled = "t" fillcolor = "white" stroked = "f" path = " m0,0 l27388800,0,27388800,16956000,0,16956000 xe">
        <vml:skew class=vml on = "t" matrix = "935375f,0,0,935375f,0,0" offset = "34468954f,52315599f"></vml:skew>
        <vml:fill></vml:fill>
      </vml:shape>
      <vml:shape style="Z-INDEX: 10" class="vml x-vml-sprite" coordsize = "21600,21600" filled = "t" fillcolor = "black" stroked = "f" path = " m0,0 l1,0 e">
        <vml:skew class=vml on = "t" matrix = "0,935375f,-935376f,0,0,0" offset = "52315599f,-34468954f"></vml:skew>
        <vml:textpath style="LINE-HEIGHT: normal; FONT-VARIANT: normal; FONT-FAMILY: ; FONT-SIZE: 12px; v-text-align: left" class=vml on = "t" string = "Some text"></vml:textpath>
        <vml:path class=vml textpathok = "t"></vml:path>
        <vml:fill></vml:fill>
      </vml:shape>
    </DIV>
  </DIV>
</DIV>
<DIV style="POSITION: absolute; LINE-HEIGHT: normal; TEXT-TRANSFORM: none; FONT-STYLE: normal; FONT-FAMILY: null; LETTER-SPACING: normal; VISIBILITY: hidden; FONT-SIZE: 12px; TOP: -10000px; FONT-WEIGHT: 400; LEFT: -10000px"></DIV>

如果我然后注释掉“sprite.setRotation(270);”这一行。非旋转文本显示正常。除了“skew”条目的值之外,生成的HTML与上面的完全相同。差异如下:

10c10
<         <vml:skew class=vml on = "t" matrix = "935375f,0,0,935375f,0,0" offset = "34468954f,52315599f"></vml:skew>
---
>         <vml:skew class=vml on = "t" matrix = "1510899f,0,0,1510899f,0,0" offset = "1445363f,14325573f"></vml:skew>
14c14
<         <vml:skew class=vml on = "t" matrix = "0,935375f,-935376f,0,0,0" offset = "52315599f,-34468954f"></vml:skew>
---
>         <vml:skew class=vml on = "t" matrix = "1510899f,0,0,1510899f,0,0" offset = "1445363f,14325573f"></vml:skew>

谷歌搜索,检查Sencha论坛上的过去问题,这里没有给我任何线索。

感谢。

0 个答案:

没有答案