1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
|
/*
* Copyright 2000-2014 Vaadin Ltd.
*
* 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.vaadin.ui;
import java.util.Iterator;
import java.util.LinkedList;
import org.jsoup.nodes.Element;
import com.vaadin.event.LayoutEvents.LayoutClickEvent;
import com.vaadin.event.LayoutEvents.LayoutClickListener;
import com.vaadin.event.LayoutEvents.LayoutClickNotifier;
import com.vaadin.shared.Connector;
import com.vaadin.shared.EventId;
import com.vaadin.shared.MouseEventDetails;
import com.vaadin.shared.ui.csslayout.CssLayoutServerRpc;
import com.vaadin.shared.ui.csslayout.CssLayoutState;
import com.vaadin.ui.declarative.DesignContext;
/**
* CssLayout is a layout component that can be used in browser environment only.
* It simply renders components and their captions into a same div element.
* Component layout can then be adjusted with css.
* <p>
* In comparison to {@link HorizontalLayout} and {@link VerticalLayout}
* <ul>
* <li>rather similar server side api
* <li>no spacing, alignment or expand ratios
* <li>much simpler DOM that can be styled by skilled web developer
* <li>no abstraction of browser differences (developer must ensure that the
* result works properly on each browser)
* <li>different kind of handling for relative sizes (that are set from server
* side) (*)
* <li>noticeably faster rendering time in some situations as we rely more on
* the browser's rendering engine.
* </ul>
* <p>
* With {@link CustomLayout} one can often achieve similar results (good looking
* layouts with web technologies), but with CustomLayout developer needs to work
* with fixed templates.
* <p>
* By extending CssLayout one can also inject some css rules straight to child
* components using {@link #getCss(Component)}.
*
* <p>
* (*) Relative sizes (set from server side) are treated bit differently than in
* other layouts in Vaadin. In cssLayout the size is calculated relatively to
* CSS layouts content area which is pretty much as in html and css. In other
* layouts the size of component is calculated relatively to the "slot" given by
* layout.
* <p>
* Also note that client side framework in Vaadin modifies inline style
* properties width and height. This happens on each update to component. If one
* wants to set component sizes with CSS, component must have undefined size on
* server side (which is not the default for all components) and the size must
* be defined with class styles - not by directly injecting width and height.
*
* @since 6.1 brought in from "FastLayouts" incubator project
*
*/
public class CssLayout extends AbstractLayout implements LayoutClickNotifier {
private CssLayoutServerRpc rpc = new CssLayoutServerRpc() {
@Override
public void layoutClick(MouseEventDetails mouseDetails,
Connector clickedConnector) {
fireEvent(LayoutClickEvent.createEvent(CssLayout.this,
mouseDetails, clickedConnector));
}
};
/**
* Custom layout slots containing the components.
*/
protected LinkedList<Component> components = new LinkedList<Component>();
/**
* Constructs an empty CssLayout.
*/
public CssLayout() {
registerRpc(rpc);
}
/**
* Constructs a CssLayout with the given components in the given order.
*
* @see #addComponents(Component...)
*
* @param children
* Components to add to the container.
*/
public CssLayout(Component... children) {
this();
addComponents(children);
}
/**
* Add a component into this container. The component is added to the right
* or below the previous component.
*
* @param c
* the component to be added.
*/
@Override
public void addComponent(Component c) {
// Add to components before calling super.addComponent
// so that it is available to AttachListeners
components.add(c);
try {
super.addComponent(c);
} catch (IllegalArgumentException e) {
components.remove(c);
throw e;
}
}
/**
* Adds a component into this container. The component is added to the left
* or on top of the other components.
*
* @param c
* the component to be added.
*/
public void addComponentAsFirst(Component c) {
// If c is already in this, we must remove it before proceeding
// see ticket #7668
if (equals(c.getParent())) {
removeComponent(c);
}
components.addFirst(c);
try {
super.addComponent(c);
} catch (IllegalArgumentException e) {
components.remove(c);
throw e;
}
}
/**
* Adds a component into indexed position in this container.
*
* @param c
* the component to be added.
* @param index
* the index of the component position. The components currently
* in and after the position are shifted forwards.
*/
public void addComponent(Component c, int index) {
// If c is already in this, we must remove it before proceeding
// see ticket #7668
if (equals(c.getParent())) {
// When c is removed, all components after it are shifted down
if (index > getComponentIndex(c)) {
index--;
}
removeComponent(c);
}
components.add(index, c);
try {
super.addComponent(c);
} catch (IllegalArgumentException e) {
components.remove(c);
throw e;
}
}
/**
* Removes the component from this container.
*
* @param c
* the component to be removed.
*/
@Override
public void removeComponent(Component c) {
components.remove(c);
super.removeComponent(c);
}
/**
* Gets the component container iterator for going trough all the components
* in the container.
*
* @return the Iterator of the components inside the container.
*/
@Override
public Iterator<Component> iterator() {
return components.iterator();
}
/**
* Gets the number of contained components. Consistent with the iterator
* returned by {@link #getComponentIterator()}.
*
* @return the number of contained components
*/
@Override
public int getComponentCount() {
return components.size();
}
@Override
public void beforeClientResponse(boolean initial) {
super.beforeClientResponse(initial);
// This is an obsolete hack that was required before Map<Conenctor, ?>
// was supported. The workaround is to instead use a Map<String, ?> with
// the connector id as the key, but that can only be used once the
// connector has been attached.
getState().childCss.clear();
for (Iterator<Component> ci = getComponentIterator(); ci.hasNext();) {
Component child = ci.next();
String componentCssString = getCss(child);
if (componentCssString != null) {
getState().childCss.put(child, componentCssString);
}
}
}
@Override
protected CssLayoutState getState() {
return (CssLayoutState) super.getState();
}
/**
* Returns styles to be applied to given component. Override this method to
* inject custom style rules to components.
*
* <p>
* Note that styles are injected over previous styles before actual child
* rendering. Previous styles are not cleared, but overridden.
*
* <p>
* Note that one most often achieves better code style, by separating
* styling to theme (with custom theme and {@link #addStyleName(String)}.
* With own custom styles it is also very easy to break browser
* compatibility.
*
* @param c
* the component
* @return css rules to be applied to component
*/
protected String getCss(Component c) {
return null;
}
/* Documented in superclass */
@Override
public void replaceComponent(Component oldComponent, Component newComponent) {
// Gets the locations
int oldLocation = -1;
int newLocation = -1;
int location = 0;
for (final Iterator<Component> i = components.iterator(); i.hasNext();) {
final Component component = i.next();
if (component == oldComponent) {
oldLocation = location;
}
if (component == newComponent) {
newLocation = location;
}
location++;
}
if (oldLocation == -1) {
addComponent(newComponent);
} else if (newLocation == -1) {
removeComponent(oldComponent);
addComponent(newComponent, oldLocation);
} else {
if (oldLocation > newLocation) {
components.remove(oldComponent);
components.add(newLocation, oldComponent);
components.remove(newComponent);
components.add(oldLocation, newComponent);
} else {
components.remove(newComponent);
components.add(oldLocation, newComponent);
components.remove(oldComponent);
components.add(newLocation, oldComponent);
}
markAsDirty();
}
}
@Override
public void addLayoutClickListener(LayoutClickListener listener) {
addListener(EventId.LAYOUT_CLICK_EVENT_IDENTIFIER,
LayoutClickEvent.class, listener,
LayoutClickListener.clickMethod);
}
/**
* @deprecated As of 7.0, replaced by
* {@link #addLayoutClickListener(LayoutClickListener)}
**/
@Override
@Deprecated
public void addListener(LayoutClickListener listener) {
addLayoutClickListener(listener);
}
@Override
public void removeLayoutClickListener(LayoutClickListener listener) {
removeListener(EventId.LAYOUT_CLICK_EVENT_IDENTIFIER,
LayoutClickEvent.class, listener);
}
/**
* @deprecated As of 7.0, replaced by
* {@link #removeLayoutClickListener(LayoutClickListener)}
**/
@Override
@Deprecated
public void removeListener(LayoutClickListener listener) {
removeLayoutClickListener(listener);
}
/**
* Returns the index of the given component.
*
* @param component
* The component to look up.
* @return The index of the component or -1 if the component is not a child.
*/
public int getComponentIndex(Component component) {
return components.indexOf(component);
}
/**
* Returns the component at the given position.
*
* @param index
* The position of the component.
* @return The component at the given index.
* @throws IndexOutOfBoundsException
* If the index is out of range.
*/
public Component getComponent(int index) throws IndexOutOfBoundsException {
return components.get(index);
}
/*
* (non-Javadoc)
*
* @see com.vaadin.ui.AbstractComponent#readDesign(org.jsoup.nodes .Element,
* com.vaadin.ui.declarative.DesignContext)
*/
@Override
public void readDesign(Element design, DesignContext designContext) {
// process default attributes
super.readDesign(design, designContext);
// handle children
for (Element childComponent : design.children()) {
Component newChild = designContext.createChild(childComponent);
addComponent(newChild);
}
}
/*
* (non-Javadoc)
*
* @see com.vaadin.ui.AbstractComponent#writeDesign(org.jsoup.nodes.Element
* , com.vaadin.ui.declarative.DesignContext)
*/
@Override
public void writeDesign(Element design, DesignContext designContext) {
// synchronize default attributes
super.writeDesign(design, designContext);
CssLayout def = designContext.getDefaultInstance(this);
// handle children
if (!designContext.shouldWriteChildren(this, def)) {
return;
}
Element designElement = design;
for (Component child : this) {
Element childNode = designContext.createElement(child);
designElement.appendChild(childNode);
}
}
}
|