From fb30121d333447f73fa8a204094256ffcb734477 Mon Sep 17 00:00:00 2001 From: Artur Signell Date: Sat, 5 Jan 2013 01:54:03 +0200 Subject: [PATCH] Fixed subpixel measuring in IE9+ (#10636) Change-Id: Ia8441b47a0b2a8dd290afa1f2cfe49db633f3865 --- client/src/com/vaadin/client/Util.java | 92 ++++++++++++++++++++++++-- 1 file changed, 87 insertions(+), 5 deletions(-) diff --git a/client/src/com/vaadin/client/Util.java b/client/src/com/vaadin/client/Util.java index e0389c260d..6947b14d9d 100644 --- a/client/src/com/vaadin/client/Util.java +++ b/client/src/com/vaadin/client/Util.java @@ -561,7 +561,58 @@ public class Util { notifyParentOfSizeChange(widget, false); } - public static native int getRequiredWidth( + /** + * Gets the border-box width for the given element, i.e. element width + + * border + padding. Always rounds up to nearest integer. + * + * @param element + * The element to check + * @return The border-box width for the element + */ + public static int getRequiredWidth(com.google.gwt.dom.client.Element element) { + int reqWidth = getRequiredWidthBoundingClientRect(element); + if (BrowserInfo.get().isIE() && !BrowserInfo.get().isIE8()) { + int csSize = getRequiredWidthComputedStyle(element); + if (csSize == reqWidth + 1) { + // If computed style reports one pixel larger than requiredWidth + // we would be rounding in the wrong direction in IE9. Round up + // instead. + // We do not always use csSize as it e.g. for 100% wide Labels + // in GridLayouts produces senseless values (see e.g. + // ThemeTestUI with Runo). + return csSize; + } + } + return reqWidth; + } + + /** + * Gets the border-box height for the given element, i.e. element height + + * border + padding. Always rounds up to nearest integer. + * + * @param element + * The element to check + * @return The border-box height for the element + */ + public static int getRequiredHeight( + com.google.gwt.dom.client.Element element) { + int reqHeight = getRequiredHeightBoundingClientRect(element); + if (BrowserInfo.get().isIE() && !BrowserInfo.get().isIE8()) { + int csSize = getRequiredHeightComputedStyle(element); + if (csSize == reqHeight + 1) { + // If computed style reports one pixel larger than + // requiredHeight we would be rounding in the wrong direction in + // IE9. Round up instead. + // We do not always use csSize as it e.g. for 100% wide Labels + // in GridLayouts produces senseless values (see e.g. + // ThemeTestUI with Runo). + return csSize; + } + } + return reqHeight; + } + + public static native int getRequiredWidthBoundingClientRect( com.google.gwt.dom.client.Element element) /*-{ if (element.getBoundingClientRect) { @@ -572,7 +623,39 @@ public class Util { } }-*/; - public static native int getRequiredHeight( + public static native int getRequiredHeightComputedStyle( + com.google.gwt.dom.client.Element element) + /*-{ + var cs = element.ownerDocument.defaultView.getComputedStyle(element); + var heightPx = cs.height; + var borderTopPx = cs.borderTop; + var borderBottomPx = cs.borderBottom; + var paddingTopPx = cs.paddingTop; + var paddingBottomPx = cs.paddingBottom; + + var height = heightPx.substring(0,heightPx.length-2); + var border = borderTopPx.substring(0,borderTopPx.length-2)+borderBottomPx.substring(0,borderBottomPx.length-2); + var padding = paddingTopPx.substring(0,paddingTopPx.length-2)+paddingBottomPx.substring(0,paddingBottomPx.length-2); + return Math.ceil(height+border+padding); + }-*/; + + public static native int getRequiredWidthComputedStyle( + com.google.gwt.dom.client.Element element) + /*-{ + var cs = element.ownerDocument.defaultView.getComputedStyle(element); + var widthPx = cs.width; + var borderLeftPx = cs.borderLeft; + var borderRightPx = cs.borderRight; + var paddingLeftPx = cs.paddingLeft; + var paddingRightPx = cs.paddingRight; + + var width = widthPx.substring(0,widthPx.length-2); + var border = borderLeftPx.substring(0,borderLeftPx.length-2)+borderRightPx.substring(0,borderRightPx.length-2); + var padding = paddingLeftPx.substring(0,paddingLeftPx.length-2)+paddingRightPx.substring(0,paddingRightPx.length-2); + return Math.ceil(width+border+padding); + }-*/; + + public static native int getRequiredHeightBoundingClientRect( com.google.gwt.dom.client.Element element) /*-{ var height; @@ -1070,9 +1153,8 @@ public class Util { } return null; - }-*/ - ; - + }-*/; + /** * Gets the currently focused element for Internet Explorer. * -- 2.39.5