Mercurial > dive4elements > river
comparison flys-client/src/main/java/de/intevation/flys/client/client/ui/map/MapOutputTab.java @ 4402:c84630d544a1
Get rid of HorizontalLayout in MapOutputTab and use manual resizing.
The OpenLayers Map widget is now resized and positioned manually by a
ResizeHandler method. The automatic HorizontalLayout was obviously
broken in combination with the OpenLayers widget.
This should fix various layout issues with the OpenLayers Map.
author | Christian Lins <christian.lins@intevation.de> |
---|---|
date | Mon, 05 Nov 2012 15:17:58 +0100 |
parents | 93e023131546 |
children | 099d136b215b |
comparison
equal
deleted
inserted
replaced
4401:6dad08f54369 | 4402:c84630d544a1 |
---|---|
1 package de.intevation.flys.client.client.ui.map; | 1 package de.intevation.flys.client.client.ui.map; |
2 | 2 |
3 import com.google.gwt.core.client.GWT; | 3 import com.google.gwt.core.client.GWT; |
4 import com.google.gwt.user.client.rpc.AsyncCallback; | 4 import com.google.gwt.user.client.rpc.AsyncCallback; |
5 import com.google.gwt.user.client.ui.Widget; | 5 import com.google.gwt.user.client.ui.AbsolutePanel; |
6 | 6 |
7 import com.smartgwt.client.util.SC; | 7 import com.smartgwt.client.util.SC; |
8 import com.smartgwt.client.widgets.Canvas; | 8 import com.smartgwt.client.widgets.Canvas; |
9 import com.smartgwt.client.widgets.events.ResizedEvent; | 9 import com.smartgwt.client.widgets.events.ResizedEvent; |
10 import com.smartgwt.client.widgets.events.ResizedHandler; | 10 import com.smartgwt.client.widgets.events.ResizedHandler; |
46 | 46 |
47 import java.util.List; | 47 import java.util.List; |
48 | 48 |
49 import org.gwtopenmaps.openlayers.client.Bounds; | 49 import org.gwtopenmaps.openlayers.client.Bounds; |
50 import org.gwtopenmaps.openlayers.client.Map; | 50 import org.gwtopenmaps.openlayers.client.Map; |
51 import org.gwtopenmaps.openlayers.client.MapWidget; | |
51 import org.gwtopenmaps.openlayers.client.event.VectorFeatureAddedListener; | 52 import org.gwtopenmaps.openlayers.client.event.VectorFeatureAddedListener; |
52 import org.gwtopenmaps.openlayers.client.event.VectorFeatureRemovedListener; | 53 import org.gwtopenmaps.openlayers.client.event.VectorFeatureRemovedListener; |
53 import org.gwtopenmaps.openlayers.client.feature.VectorFeature; | 54 import org.gwtopenmaps.openlayers.client.feature.VectorFeature; |
54 import org.gwtopenmaps.openlayers.client.format.GeoJSON; | 55 import org.gwtopenmaps.openlayers.client.format.GeoJSON; |
55 import org.gwtopenmaps.openlayers.client.layer.Layer; | 56 import org.gwtopenmaps.openlayers.client.layer.Layer; |
85 protected FLYSConstants MSG = GWT.create(FLYSConstants.class); | 86 protected FLYSConstants MSG = GWT.create(FLYSConstants.class); |
86 | 87 |
87 protected MapToolbar controlPanel; | 88 protected MapToolbar controlPanel; |
88 protected ThemePanel themePanel; | 89 protected ThemePanel themePanel; |
89 protected Canvas themePanelCanvas; | 90 protected Canvas themePanelCanvas; |
90 protected Widget mapPanel; | 91 protected MapWidget mapPanel; |
91 protected Canvas mapPanelCanvas; | 92 protected Canvas mapPanelCanvas; |
92 | 93 protected VLayout rootLayout = new VLayout(); |
94 protected AbsolutePanel absPan = new AbsolutePanel(); | |
93 protected FloodMap floodMap; | 95 protected FloodMap floodMap; |
94 | 96 |
95 | 97 |
96 public MapOutputTab( | 98 public MapOutputTab( |
97 String title, | 99 String title, |
119 if (initial == null) { | 121 if (initial == null) { |
120 GWT.log("Warning: No initial extent set."); | 122 GWT.log("Warning: No initial extent set."); |
121 initial = max; | 123 initial = max; |
122 } | 124 } |
123 | 125 |
124 setFloodmap(new FloodMap(c.getSrid(), max)); | 126 setFloodmap(new FloodMap(c.getSrid(), max, "100%", "100%")); |
125 | 127 |
126 initLayout(); | 128 initLayout(); |
127 initBarriers(); | 129 initBarriers(); |
128 | 130 |
129 GWT.log("MAX EXTENT: " + max); | 131 GWT.log("MAX EXTENT: " + max); |
134 ); | 136 ); |
135 } | 137 } |
136 | 138 |
137 | 139 |
138 protected void initLayout() { | 140 protected void initLayout() { |
139 VLayout rootLayout = new VLayout(); | |
140 rootLayout.setHeight100(); | 141 rootLayout.setHeight100(); |
141 rootLayout.setWidth100(); | 142 rootLayout.setWidth100(); |
142 rootLayout.setMembersMargin(2); | 143 rootLayout.setMembersMargin(2); |
143 | 144 |
144 final HLayout hlayout = new HLayout(); | 145 final HLayout hlayout = new HLayout(); |
145 hlayout.setMembersMargin(2); | 146 hlayout.setMembersMargin(0); |
146 | 147 |
147 this.themePanelCanvas = createThemePanel(); | 148 this.themePanelCanvas = createThemePanel(); |
148 | 149 |
149 controlPanel = createControlPanel(); | 150 controlPanel = createControlPanel(); |
150 //mapPanel = new Image(); | |
151 //((Image)mapPanel).setUrl("http://www.hedweb.com/animimag/cool-pony.jpg"); | |
152 mapPanel = floodMap.getMapWidget(); | 151 mapPanel = floodMap.getMapWidget(); |
153 hlayout.addMember(themePanelCanvas); | |
154 hlayout.addMember(mapPanel); | |
155 | 152 |
156 rootLayout.addMember(controlPanel); | 153 rootLayout.addMember(controlPanel); |
157 rootLayout.addMember(hlayout); | 154 rootLayout.addMember(absPan); |
158 | 155 absPan.setWidth("100%"); |
159 hlayout.addResizedHandler(new ResizedHandler() { | 156 absPan.setHeight("100%"); |
157 absPan.add(themePanelCanvas); | |
158 absPan.add(mapPanel); | |
159 | |
160 rootLayout.addResizedHandler(new ResizedHandler() { | |
160 @Override | 161 @Override |
161 public void onResized(ResizedEvent e) { | 162 public void onResized(ResizedEvent e) { |
162 int height = hlayout.getHeight(); | 163 doLayout(); |
163 int width = hlayout.getWidth() - | |
164 (themePanelCanvas.isVisible() ? themePanelCanvas.getWidth() : 0); | |
165 | |
166 height = height * 99 / 100; | |
167 width = width * 99 / 100; | |
168 | |
169 String w = String.valueOf(width) + "px"; | |
170 String h = String.valueOf(height) + "px"; | |
171 | |
172 mapPanel.setSize(w, h); | |
173 } | 164 } |
174 }); | 165 }); |
175 | 166 |
176 setPane(rootLayout); | 167 setPane(rootLayout); |
168 } | |
169 | |
170 | |
171 protected void doLayout() { | |
172 if(!rootLayout.isVisible()) { | |
173 return; | |
174 } | |
175 | |
176 // Manually set the height of the AbsolutePanel, somehow this is necessary | |
177 absPan.setHeight(String.valueOf( | |
178 rootLayout.getHeight() - controlPanel.getHeight() - 2) + "px"); | |
179 | |
180 // Calculate bounds of Map | |
181 int height = rootLayout.getHeight() - | |
182 controlPanel.getHeight() - 6; | |
183 int width = controlPanel.getWidth() - | |
184 (themePanelCanvas.isVisible() ? themePanelCanvas.getWidth() + 4 : 0); | |
185 | |
186 // Set size and position of Map | |
187 String w = String.valueOf(width) + "px"; | |
188 String h = String.valueOf(height) + "px"; | |
189 GWT.log("width=" + w); | |
190 | |
191 mapPanel.setSize(w, h); | |
192 if(themePanelCanvas.isVisible()) { | |
193 absPan.setWidgetPosition(mapPanel, themePanelCanvas.getWidth() + 2, 0); | |
194 } | |
195 else { | |
196 absPan.setWidgetPosition(mapPanel, 0, 0); | |
197 } | |
198 | |
199 // Set bounds of ThemePanelCanvas | |
200 themePanelCanvas.setSize(themePanelCanvas.getWidthAsString(), String.valueOf(height + 2) + "px"); | |
177 } | 201 } |
178 | 202 |
179 | 203 |
180 protected void initBarriers() { | 204 protected void initBarriers() { |
181 Vector vector = floodMap.getBarrierLayer(); | 205 Vector vector = floodMap.getBarrierLayer(); |
571 } | 595 } |
572 } | 596 } |
573 | 597 |
574 public void toogleThemePanel() { | 598 public void toogleThemePanel() { |
575 this.themePanelCanvas.setVisible(!themePanelCanvas.isVisible()); | 599 this.themePanelCanvas.setVisible(!themePanelCanvas.isVisible()); |
576 this.themePanelCanvas.setSize(themePanelCanvas.getWidthAsString(), | 600 |
577 themePanelCanvas.getHeightAsString()); | 601 // Trigger resize event handler |
602 doLayout(); | |
578 } | 603 } |
579 | 604 |
580 | 605 |
581 @Override | 606 @Override |
582 public void onOutputParameterChanged(OutputParameterChangeEvent evt) { | 607 public void onOutputParameterChanged(OutputParameterChangeEvent evt) { |