Fixed an issue where the DeckPanel flickers in IE7 when switching from one widget to another because the new widget is completely visible for an instant, even though its container is set to a height of 0px. This patch starts the height at 1px instead of 0px, which corrects the problem. This patch also uses a new method to determine if the deck panel has a fixed height, which in turn determines how we do the animation. The old method wasn't 100% accurate in some common use cases, but the new method should be.
Patch by: jlabanca
Review by: ecc
Issue: 2339
git-svn-id: https://google-web-toolkit.googlecode.com/svn/trunk@2571 8db76d5a-ed1c-0410-87a9-c151d255dfc7
diff --git a/reference/code-museum/src/com/google/gwt/museum/client/defaultmuseum/DefaultMuseum.java b/reference/code-museum/src/com/google/gwt/museum/client/defaultmuseum/DefaultMuseum.java
index 0b21af2..9bb6ce3 100644
--- a/reference/code-museum/src/com/google/gwt/museum/client/defaultmuseum/DefaultMuseum.java
+++ b/reference/code-museum/src/com/google/gwt/museum/client/defaultmuseum/DefaultMuseum.java
@@ -33,5 +33,6 @@
addIssue(new Issue2321());
addIssue(new Issue2331());
addIssue(new Issue2338());
+ addIssue(new Issue2339());
}
}
diff --git a/reference/code-museum/src/com/google/gwt/museum/client/defaultmuseum/Issue2339.java b/reference/code-museum/src/com/google/gwt/museum/client/defaultmuseum/Issue2339.java
new file mode 100644
index 0000000..ce70cce
--- /dev/null
+++ b/reference/code-museum/src/com/google/gwt/museum/client/defaultmuseum/Issue2339.java
@@ -0,0 +1,63 @@
+/*
+ * Copyright 2008 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.museum.client.defaultmuseum;
+
+import com.google.gwt.museum.client.common.AbstractIssue;
+import com.google.gwt.user.client.ui.HTML;
+import com.google.gwt.user.client.ui.TabPanel;
+import com.google.gwt.user.client.ui.Widget;
+
+/**
+ * When you change to a different widget in the DeckPanel, there is a flicker in
+ * IE7 where the new widget is completely visible for an instant, and then the
+ * animation continues normally.
+ */
+public class Issue2339 extends AbstractIssue {
+ private static final String[] TAB_BACKGROUNDS = {"#f88", "#88f", "#8f8", "#8ff", "#f8f"};
+
+ @Override
+ public Widget createIssue() {
+ final TabPanel tabPanel = new TabPanel();
+ String contentText = "";
+ for (int i = 0; i < TAB_BACKGROUNDS.length; i++) {
+ contentText += "Each tab has more text.<br>";
+ HTML content = new HTML(contentText);
+ content.getElement().getStyle().setProperty("background",
+ TAB_BACKGROUNDS[i]);
+ tabPanel.add(content, "Tab " + i);
+ }
+
+ tabPanel.selectTab(0);
+ tabPanel.getDeckPanel().setAnimationEnabled(true);
+ return tabPanel;
+ }
+
+ @Override
+ public String getInstructions() {
+ return "Switch to a different tab and you should not see a flicker";
+ }
+
+ @Override
+ public String getSummary() {
+ return "DeckPanel flickers when switching between widgets";
+ }
+
+ @Override
+ public boolean hasCSS() {
+ return false;
+ }
+
+}
diff --git a/user/src/com/google/gwt/user/client/ui/DeckPanel.java b/user/src/com/google/gwt/user/client/ui/DeckPanel.java
index efac341..47b59ac 100644
--- a/user/src/com/google/gwt/user/client/ui/DeckPanel.java
+++ b/user/src/com/google/gwt/user/client/ui/DeckPanel.java
@@ -90,6 +90,21 @@
@Override
public void onStart() {
+ // Figure out if the deck panel has a fixed height
+ com.google.gwt.dom.client.Element deckElem = container1.getParentElement();
+ int deckHeight = deckElem.getOffsetHeight();
+ if (growing) {
+ fixedHeight = container2.getOffsetHeight();
+ container2.getStyle().setPropertyPx("height", fixedHeight - 1);
+ } else {
+ fixedHeight = container1.getOffsetHeight();
+ container1.getStyle().setPropertyPx("height", fixedHeight - 1);
+ }
+ if (deckElem.getOffsetHeight() != deckHeight) {
+ fixedHeight = -1;
+ }
+
+ // Start the animation
onUpdate(0.0);
UIObject.setVisible(container1, true);
UIObject.setVisible(container2, true);
@@ -113,6 +128,16 @@
height1 = (int) (progress * fixedHeight);
height2 = fixedHeight - height1;
}
+
+ // Issue 2339: If the height is 0px, IE7 will display the entire content
+ // widget instead of hiding it completely.
+ if (height1 == 0) {
+ height1 = 1;
+ height2 = Math.max(1, height2 - 1);
+ } else if (height2 == 0) {
+ height2 = 1;
+ height1 = Math.max(1, height1 - 1);
+ }
DOM.setStyleAttribute(container1, "height", height1 + "px");
DOM.setStyleAttribute(container2, "height", height2 + "px");
}
@@ -155,12 +180,6 @@
growing = true;
}
- // Figure out if we are in a fixed height situation
- fixedHeight = DOM.getElementPropertyInt(oldContainer, "offsetHeight");
- if (fixedHeight == oldWidget.getOffsetHeight()) {
- fixedHeight = -1;
- }
-
// Start the animation
if (animate) {
run(350);
@@ -315,7 +334,7 @@
DOM.setStyleAttribute(container, "height", "100%");
w.setSize("100%", "100%");
}
-
+
/**
* Reset the dimensions of the widget when it is removed.
*/
