ZK - Open Source Ajax Java FrameworkZK - Open Source Ajax Java Framework

RTL (Right-To-Left) problem

hosarb
8 Feb 2012 12:06:36 GMT
8 Feb 2012 12:06:36 GMT

Hi every body

I am using zk 5.0.9 ee version.

My application must be in rtl mode.

To apply that, I am using zk sample. (using direction:rtl)

The solutions work fine in display, but some actions are still in the left-to-right mode.

For example, when I use a grid and set the sizable of its columns to true, for resizing each column, I expect the re-size being done to the column on the right side of the mouse cursor, but it is not.

this is a sample that shows the case :

<?xml version="1.0" encoding="UTF-8"?>
<zk xmlns="http://www.zkoss.org/2005/zul">
    <style>
        .reverse,
        .reverse .z-window-embedded-header,
        .reverse .z-label {
        unicode-bidi: bidi-override;
        direction: rtl;
        }
    </style>
    <window xmlns="http://www.zkoss.org/2005/zul" height="100%" width="100%" sclass="reverse">
    <div id="centerDiv" sclass="center-div" height="89%">

        <paging id="reportItemsPaging" detailed="true" width="100%" visible="true" style="direction:ltr;" pageSize="5"
                />
        <grid width="300%" paginal="${reportItemsPaging}" mold="paging">
            <columns sizable="true">
                <column hflex="1"><label value="10"/></column>
                <column hflex="1"><label value="11"/></column>
                <column hflex="1"><label value="12"/></column>
                <column hflex="1"><label value="13"/></column>
                <column hflex="1"><label value="14"/></column>
                <column hflex="1"><label value="15"/></column>
                <column hflex="1"><label value="16"/></column>
                <column hflex="1"><label value="17"/></column>
                <column hflex="1"><label value="18"/></column>
                <column hflex="1"><label value="19"/></column>
            </columns>
            <rows>
                <row>
                    <label value="100"/>
                    <label value="110"/>
                    <label value="120"/>
                    <label value="130"/>
                    <label value="140"/>
                    <label value="150"/>
                    <label value="160"/>
                    <label value="170"/>
                    <label value="180"/>
                    <label value="190"/>
                </row>
                <row>
                    <label value="101"/>
                    <label value="111"/>
                    <label value="121"/>
                    <label value="131"/>
                    <label value="141"/>
                    <label value="151"/>
                    <label value="161"/>
                    <label value="171"/>
                    <label value="181"/>
                    <label value="191"/>
                </row>
                <row>
                    <label value="102"/>
                    <label value="112"/>
                    <label value="122"/>
                    <label value="132"/>
                    <label value="142"/>
                    <label value="152"/>
                    <label value="162"/>
                    <label value="172"/>
                    <label value="182"/>
                    <label value="192"/>
                </row>
                <row>
                    <label value="103"/>
                    <label value="113"/>
                    <label value="123"/>
                    <label value="133"/>
                    <label value="143"/>
                    <label value="153"/>
                    <label value="163"/>
                    <label value="173"/>
                    <label value="183"/>
                    <label value="193"/>
                </row>
                <row>
                    <label value="104"/>
                    <label value="114"/>
                    <label value="124"/>
                    <label value="134"/>
                    <label value="144"/>
                    <label value="154"/>
                    <label value="164"/>
                    <label value="174"/>
                    <label value="184"/>
                    <label value="194"/>
                </row>
                <row>
                    <label value="105"/>
                    <label value="115"/>
                    <label value="125"/>
                    <label value="135"/>
                    <label value="145"/>
                    <label value="155"/>
                    <label value="165"/>
                    <label value="175"/>
                    <label value="185"/>
                    <label value="195"/>
                </row>
                <row>
                    <label value="106"/>
                    <label value="116"/>
                    <label value="126"/>
                    <label value="136"/>
                    <label value="146"/>
                    <label value="156"/>
                    <label value="166"/>
                    <label value="176"/>
                    <label value="186"/>
                    <label value="196"/>
                </row>
                <row>
                    <label value="107"/>
                    <label value="117"/>
                    <label value="127"/>
                    <label value="137"/>
                    <label value="147"/>
                    <label value="157"/>
                    <label value="167"/>
                    <label value="177"/>
                    <label value="187"/>
                    <label value="197"/>
                </row>
                <row>
                    <label value="108"/>
                    <label value="118"/>
                    <label value="128"/>
                    <label value="138"/>
                    <label value="148"/>
                    <label value="158"/>
                    <label value="168"/>
                    <label value="178"/>
                    <label value="188"/>
                    <label value="198"/>
                </row>
                <row>
                    <label value="109"/>
                    <label value="119"/>
                    <label value="129"/>
                    <label value="139"/>
                    <label value="149"/>
                    <label value="159"/>
                    <label value="169"/>
                    <label value="179"/>
                    <label value="189"/>
                    <label value="199"/>
                </row>
                <row>
                    <label value="109"/>
                    <label value="219"/>
                    <label value="229"/>
                    <label value="239"/>
                    <label value="249"/>
                    <label value="259"/>
                    <label value="269"/>
                    <label value="279"/>
                    <label value="289"/>
                    <label value="299"/>
                </row>
            </rows>
        </grid>
    </div>
</window>
</zk>