Revision: 6799 Author: j...@google.com Date: Tue Nov 10 10:16:43 2009 Log: Fixing various IE6/7/8 layout bugs, including jiggly animation. Also fixes a couple of errors in the test. Review: bobv (desk check) http://code.google.com/p/google-web-toolkit/source/detail?r=6799
Added: /trunk/user/src/com/google/gwt/layout/client/LayoutImplIE8.java Modified: /trunk/user/src/com/google/gwt/layout/Layout.gwt.xml /trunk/user/src/com/google/gwt/layout/client/LayoutImpl.java /trunk/user/src/com/google/gwt/layout/client/LayoutImplIE6.java /trunk/user/test/com/google/gwt/layout/client/LayoutTest.java ======================================= --- /dev/null +++ /trunk/user/src/com/google/gwt/layout/client/LayoutImplIE8.java Tue Nov 10 10:16:43 2009 @@ -0,0 +1,121 @@ +/* + * Copyright 2009 Google Inc. + * + * Licensed under the Apache License, Version 2.0 (the "License"); you may not + * use this file except in compliance with the License. You may obtain a copy of + * the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT + * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the + * License for the specific language governing permissions and limitations under + * the License. + */ +package com.google.gwt.layout.client; + +import com.google.gwt.dom.client.Style; +import com.google.gwt.dom.client.Style.Unit; +import com.google.gwt.layout.client.Layout.Layer; + +/** + * This implementation is used on IE7 and IE8. Unlike {...@link LayoutImpl}, it + * converts all values to pixels before setting them. This is necessary because + * these browsers incorrectly calculate the relative sizes and positions of CSS + * properties specified in certain units (e.g., when the value of an 'em' is + * non-integral in pixels). + */ +public class LayoutImplIE8 extends LayoutImpl { + + public void layout(Layer layer) { + Style style = layer.container.getStyle(); + + if (layer.setLeft) { + setValue(layer, "left", layer.left, layer.leftUnit, false, false); + } else { + style.clearLeft(); + } + if (layer.setRight) { + setValue(layer, "right", layer.right, layer.rightUnit, false, false); + } else { + style.clearRight(); + } + if (layer.setTop) { + setValue(layer, "top", layer.top, layer.topUnit, true, false); + } else { + style.clearTop(); + } + if (layer.setBottom) { + setValue(layer, "bottom", layer.bottom, layer.bottomUnit, true, false); + } else { + style.clearBottom(); + } + if (layer.setWidth) { + setValue(layer, "width", layer.width, layer.widthUnit, false, true); + } else { + style.clearWidth(); + } + if (layer.setHeight) { + setValue(layer, "height", layer.height, layer.heightUnit, true, true); + } else { + style.clearHeight(); + } + + style = layer.child.getStyle(); + switch (layer.hPos) { + case BEGIN: + style.setLeft(0, Unit.PX); + style.clearRight(); + break; + case END: + style.clearLeft(); + style.setRight(0, Unit.PX); + break; + case STRETCH: + style.setLeft(0, Unit.PX); + style.setRight(0, Unit.PX); + break; + } + + switch (layer.vPos) { + case BEGIN: + style.setTop(0, Unit.PX); + style.clearBottom(); + break; + case END: + style.clearTop(); + style.setBottom(0, Unit.PX); + break; + case STRETCH: + style.setTop(0, Unit.PX); + style.setBottom(0, Unit.PX); + break; + } + } + + private void setValue(Layer layer, String prop, double value, Unit unit, + boolean vertical, boolean noNegative) { + switch (unit) { + case PX: + case PCT: + // Leave PX and PCT alone. PX doesn't need to be translated, and PCT + // can't be. + break; + + default: + value = value + * (int) getUnitSizeInPixels(layer.container, unit, vertical); + unit = Unit.PX; + break; + } + + if (noNegative) { + if (value < 0) { + value = 0; + } + } + + layer.getContainerElement().getStyle().setProperty(prop, value, unit); + } +} ======================================= --- /trunk/user/src/com/google/gwt/layout/Layout.gwt.xml Tue Aug 4 14:08:06 2009 +++ /trunk/user/src/com/google/gwt/layout/Layout.gwt.xml Tue Nov 10 10:16:43 2009 @@ -18,6 +18,11 @@ <inherits name="com.google.gwt.dom.DOM"/> <inherits name="com.google.gwt.animation.Animation"/> + <replace-with class="com.google.gwt.layout.client.LayoutImplIE8"> + <when-type-is class="com.google.gwt.layout.client.LayoutImpl"/> + <when-property-is name="user.agent" value="ie8"/> + </replace-with> + <replace-with class="com.google.gwt.layout.client.LayoutImplIE6"> <when-type-is class="com.google.gwt.layout.client.LayoutImpl"/> <when-property-is name="user.agent" value="ie6"/> ======================================= --- /trunk/user/src/com/google/gwt/layout/client/LayoutImpl.java Wed Oct 28 09:10:53 2009 +++ /trunk/user/src/com/google/gwt/layout/client/LayoutImpl.java Tue Nov 10 10:16:43 2009 @@ -17,7 +17,6 @@ import static com.google.gwt.dom.client.Style.Unit.EM; import static com.google.gwt.dom.client.Style.Unit.EX; -import static com.google.gwt.dom.client.Style.Unit.IN; import static com.google.gwt.dom.client.Style.Unit.PX; import com.google.gwt.dom.client.DivElement; @@ -42,9 +41,8 @@ private static DivElement fixedRuler; static { - Document doc = Document.get(); - fixedRuler = createRuler(IN, IN); - doc.getBody().appendChild(fixedRuler); + fixedRuler = createRuler(Unit.CM, Unit.CM); + Document.get().getBody().appendChild(fixedRuler); } protected static DivElement createRuler(Unit widthUnit, Unit heightUnit) { @@ -111,15 +109,15 @@ case EX: return relativeRuler.getOffsetHeight() / 10.0; case CM: - return fixedRuler.getOffsetWidth() / 10.0; + return fixedRuler.getOffsetWidth() * 0.1; // 1.0 cm / cm case MM: - return fixedRuler.getOffsetWidth() / 100.0; + return fixedRuler.getOffsetWidth() * 0.01; // 0.1 cm / mm case IN: - return fixedRuler.getOffsetWidth() / 25.4; + return fixedRuler.getOffsetWidth() * 0.254; // 2.54 cm / in case PT: - return fixedRuler.getOffsetWidth() / 284; + return fixedRuler.getOffsetWidth() * 0.00353; // 0.0353 cm / pt case PC: - return fixedRuler.getOffsetWidth() / 23.6; + return fixedRuler.getOffsetWidth() * 0.0423; // 0.423 cm / pc default: case PX: return 1; @@ -150,7 +148,8 @@ style = layer.child.getStyle(); switch (layer.hPos) { case BEGIN: - style.clearLeft(); + style.setLeft(0, Unit.PX); + style.clearRight(); break; case END: style.clearLeft(); @@ -164,7 +163,8 @@ switch (layer.vPos) { case BEGIN: - style.clearTop(); + style.setTop(0, Unit.PX); + style.clearBottom(); break; case END: style.clearTop(); ======================================= --- /trunk/user/src/com/google/gwt/layout/client/LayoutImplIE6.java Wed Oct 28 09:10:53 2009 +++ /trunk/user/src/com/google/gwt/layout/client/LayoutImplIE6.java Tue Nov 10 10:16:43 2009 @@ -36,7 +36,7 @@ * Because this implementation gets compiled in for both IE6 and 7, it * dynamically detects IE7 and punts to the super implementation. */ -class LayoutImplIE6 extends LayoutImpl { +class LayoutImplIE6 extends LayoutImplIE8 { private static boolean isIE6 = isIE6(); @@ -393,10 +393,8 @@ switch (_hPos) { case 0: // BEGIN child.style.left = '0px'; - child.style.width = ''; break; case 1: // END - child.style.width = ''; child.style.left = (container.offsetWidth - childDecoWidth - child.offsetWidth) + 'px'; break; case 2: // STRETCH @@ -409,10 +407,8 @@ switch (_vPos) { case 0: // BEGIN child.style.top = '0px'; - child.style.height = ''; break; case 1: // END - child.style.height = ''; child.style.top = (container.offsetHeight - childDecoHeight - child.offsetHeight) + 'px'; break; case 2: // STRETCH ======================================= --- /trunk/user/test/com/google/gwt/layout/client/LayoutTest.java Mon Oct 12 13:35:17 2009 +++ /trunk/user/test/com/google/gwt/layout/client/LayoutTest.java Tue Nov 10 10:16:43 2009 @@ -146,34 +146,35 @@ * Tests child alignment within a layer. */ public void testChildAlignment() { - child0.getStyle().setWidth(64, PX); - child0.getStyle().setHeight(128, PX); - layer0.setTopHeight(0, PX, 128, PX); - layer0.setLeftWidth(0, PX, 256, PX); + layer0.setLeftWidth(0, PX, 128, PX); + layer0.setTopHeight(0, PX, 256, PX); layer0.setChildHorizontalPosition(Alignment.STRETCH); layer0.setChildVerticalPosition(Alignment.STRETCH); layout.layout(); assertEquals(0, child0.getOffsetLeft()); - assertEquals(0, child1.getOffsetTop()); + assertEquals(0, child0.getOffsetTop()); assertEquals(128, child0.getOffsetWidth()); - assertEquals(256, child1.getOffsetHeight()); + assertEquals(256, child0.getOffsetHeight()); + + child0.getStyle().setWidth(64, PX); + child0.getStyle().setHeight(128, PX); layer0.setChildHorizontalPosition(Alignment.BEGIN); layer0.setChildVerticalPosition(Alignment.BEGIN); layout.layout(); assertEquals(0, child0.getOffsetLeft()); - assertEquals(0, child1.getOffsetTop()); + assertEquals(0, child0.getOffsetTop()); assertEquals(64, child0.getOffsetWidth()); - assertEquals(128, child1.getOffsetHeight()); + assertEquals(128, child0.getOffsetHeight()); layer0.setChildHorizontalPosition(Alignment.END); layer0.setChildVerticalPosition(Alignment.END); layout.layout(); assertEquals(64, child0.getOffsetLeft()); - assertEquals(128, child1.getOffsetTop()); + assertEquals(128, child0.getOffsetTop()); assertEquals(64, child0.getOffsetWidth()); - assertEquals(128, child1.getOffsetHeight()); + assertEquals(128, child0.getOffsetHeight()); } /** @@ -276,6 +277,15 @@ testHorizontalSplit(PC); testHorizontalSplit(PT); testHorizontalSplit(PX); + + testVerticalSplit(CM); + testVerticalSplit(EM); + testVerticalSplit(EX); + testVerticalSplit(IN); + testVerticalSplit(MM); + testVerticalSplit(PC); + testVerticalSplit(PT); + testVerticalSplit(PX); } /** --~--~---------~--~----~------------~-------~--~----~ http://groups.google.com/group/Google-Web-Toolkit-Contributors -~----------~----~----~----~------~----~------~--~---
