com.vaadin.polymer.paper.widget.PaperScrollHeaderPanel Maven / Gradle / Ivy
/*
* This code was generated with Vaadin Web Component GWT API Generator,
* from paper-scroll-header-panel project by The Polymer Authors
* that is licensed with http://polymer.github.io/LICENSE.txt license.
*/
package com.vaadin.polymer.paper.widget;
import com.vaadin.polymer.paper.element.*;
import com.vaadin.polymer.content.widget.event.ContentScrollEvent;
import com.vaadin.polymer.content.widget.event.ContentScrollEventHandler;
import com.vaadin.polymer.paper.widget.event.PaperHeaderTransformEvent;
import com.vaadin.polymer.paper.widget.event.PaperHeaderTransformEventHandler;
import com.vaadin.polymer.PolymerWidget;
import com.vaadin.polymer.elemental.*;
import com.google.gwt.core.client.JsArray;
import com.google.gwt.event.shared.HandlerRegistration;
import com.google.gwt.core.client.JavaScriptObject;
/**
* paper-scroll-header-panel
contains a header section and a content section. The
header is initially on the top part of the view but it scrolls away with the
rest of the scrollable content. Upon scrolling slightly up at any point, the
header scrolls back into view. This saves screen space and allows users to
access important controls by easily moving them back to the view.
* Important: The paper-scroll-header-panel
will not display if its parent does not have a height.
* Using layout classes or custom properties, you can easily make the paper-scroll-header-panel
fill the screen
* <body class="fullbleed layout vertical">
* <paper-scroll-header-panel class="flex">
* <paper-toolbar>
* <div>Hello World!</div>
* </paper-toolbar>
* </paper-scroll-header-panel>
* </body>
*
*
*
or, if you would prefer to do it in CSS, just give html
, body
, and paper-scroll-header-panel
a height of 100%:
* html, body {
* height: 100%;
* margin: 0;
* }
* paper-scroll-header-panel {
* height: 100%;
* }
*
*
*
paper-scroll-header-panel
works well with paper-toolbar
but can use any element
that represents a header by adding a paper-header
class to it.
* <paper-scroll-header-panel>
* <paper-toolbar>Header</paper-toolbar>
* <div>Content goes here...</div>
* </paper-scroll-header-panel>
*
*
*
Styling scroll-header-panel:
* To change background for toolbar when it is at its full size:
* paper-scroll-header-panel {
* --paper-scroll-header-panel-full-header: {
* background-color: red;
* };
* }
*
*
*
To change the background for toolbar when it is condensed:
* paper-scroll-header-panel {
* --paper-scroll-header-panel-condensed-header: {
* background-color: #f4b400;
* };
* }
*
*
*
*/
public class PaperScrollHeaderPanel extends PolymerWidget {
/**
* Default Constructor.
*/
public PaperScrollHeaderPanel() {
this("");
}
/**
* Constructor used by UIBinder to create widgets with content.
*/
public PaperScrollHeaderPanel(String html) {
super(PaperScrollHeaderPanelElement.TAG, PaperScrollHeaderPanelElement.SRC, html);
getPolymerElement().addEventListener(
com.vaadin.polymer.content.element.event.ContentScrollEvent.NAME,
new com.vaadin.polymer.content.element.event.ContentScrollEvent.Listener() {
@Override
protected void handleEvent(com.vaadin.polymer.content.element.event.ContentScrollEvent event) {
fireEvent(new ContentScrollEvent(event));
}
});
getPolymerElement().addEventListener(
com.vaadin.polymer.paper.element.event.PaperHeaderTransformEvent.NAME,
new com.vaadin.polymer.paper.element.event.PaperHeaderTransformEvent.Listener() {
@Override
protected void handleEvent(com.vaadin.polymer.paper.element.event.PaperHeaderTransformEvent event) {
fireEvent(new PaperHeaderTransformEvent(event));
}
});
}
/**
* Gets a handle to the Polymer object's underlying DOM element.
*/
public PaperScrollHeaderPanelElement getPolymerElement() {
return (PaperScrollHeaderPanelElement) getElement();
}
/**
* The height of the header when it is condensed.
* By default, condensedHeaderHeight
is 1/3 of headerHeight
unless
this is specified.
*
* JavaScript Info:
* @property condensedHeaderHeight
* @type Number
*
*/
public double getCondensedHeaderHeight(){
return getPolymerElement().getCondensedHeaderHeight();
}
/**
* The height of the header when it is condensed.
* By default, condensedHeaderHeight
is 1/3 of headerHeight
unless
this is specified.
*
* JavaScript Info:
* @property condensedHeaderHeight
* @type Number
*
*/
public void setCondensedHeaderHeight(double value) {
getPolymerElement().setCondensedHeaderHeight(value);
}
/**
* The height of the header when it is condensed.
* By default, condensedHeaderHeight
is 1/3 of headerHeight
unless
this is specified.
*
* JavaScript Info:
* @attribute condensed-header-height
*
*/
public void setCondensedHeaderHeight(String value) {
getPolymerElement().setAttribute("condensed-header-height", value);
}
/**
* If true, the header’s height will condense to condensedHeaderHeight
as the user scrolls down from the top of the content area.
*
* JavaScript Info:
* @property condenses
* @type Boolean
*
*/
public boolean getCondenses(){
return getPolymerElement().getCondenses();
}
/**
* If true, the header’s height will condense to condensedHeaderHeight
as the user scrolls down from the top of the content area.
*
* JavaScript Info:
* @property condenses
* @type Boolean
*
*/
public void setCondenses(boolean value) {
getPolymerElement().setCondenses(value);
}
/**
* Returns the content element.
*
* JavaScript Info:
* @method content
*
*/
public void content() {
getPolymerElement().content();
}
/**
* If true, the header is fixed to the top and never moves away.
*
* JavaScript Info:
* @property fixed
* @type Boolean
*
*/
public boolean getFixed(){
return getPolymerElement().getFixed();
}
/**
* If true, the header is fixed to the top and never moves away.
*
* JavaScript Info:
* @property fixed
* @type Boolean
*
*/
public void setFixed(boolean value) {
getPolymerElement().setFixed(value);
}
/**
* Returns the header element.
*
* JavaScript Info:
* @method header
*
*/
public void header() {
getPolymerElement().header();
}
/**
* The height of the header when it is at its full size.
* By default, the height will be measured when it is ready. If the height
changes later the user needs to either set this value to reflect the
new height or invoke measureHeaderHeight()
.
*
* JavaScript Info:
* @property headerHeight
* @type Number
*
*/
public double getHeaderHeight(){
return getPolymerElement().getHeaderHeight();
}
/**
* The height of the header when it is at its full size.
* By default, the height will be measured when it is ready. If the height
changes later the user needs to either set this value to reflect the
new height or invoke measureHeaderHeight()
.
*
* JavaScript Info:
* @property headerHeight
* @type Number
*
*/
public void setHeaderHeight(double value) {
getPolymerElement().setHeaderHeight(value);
}
/**
* The height of the header when it is at its full size.
* By default, the height will be measured when it is ready. If the height
changes later the user needs to either set this value to reflect the
new height or invoke measureHeaderHeight()
.
*
* JavaScript Info:
* @attribute header-height
*
*/
public void setHeaderHeight(String value) {
getPolymerElement().setAttribute("header-height", value);
}
/**
* If true, the condensed header is always shown and does not move away.
*
* JavaScript Info:
* @property keepCondensedHeader
* @type Boolean
*
*/
public boolean getKeepCondensedHeader(){
return getPolymerElement().getKeepCondensedHeader();
}
/**
* If true, the condensed header is always shown and does not move away.
*
* JavaScript Info:
* @property keepCondensedHeader
* @type Boolean
*
*/
public void setKeepCondensedHeader(boolean value) {
getPolymerElement().setKeepCondensedHeader(value);
}
/**
* Invoke this to tell paper-scroll-header-panel
to re-measure the header’s
height.
*
* JavaScript Info:
* @method measureHeaderHeight
*
*/
public void measureHeaderHeight() {
getPolymerElement().measureHeaderHeight();
}
/**
* If true, no cross-fade transition from one background to another.
*
* JavaScript Info:
* @property noDissolve
* @type Boolean
*
*/
public boolean getNoDissolve(){
return getPolymerElement().getNoDissolve();
}
/**
* If true, no cross-fade transition from one background to another.
*
* JavaScript Info:
* @property noDissolve
* @type Boolean
*
*/
public void setNoDissolve(boolean value) {
getPolymerElement().setNoDissolve(value);
}
/**
* If true, the header doesn’t slide back in when scrolling back up.
*
* JavaScript Info:
* @property noReveal
* @type Boolean
*
*/
public boolean getNoReveal(){
return getPolymerElement().getNoReveal();
}
/**
* If true, the header doesn’t slide back in when scrolling back up.
*
* JavaScript Info:
* @property noReveal
* @type Boolean
*
*/
public void setNoReveal(boolean value) {
getPolymerElement().setNoReveal(value);
}
/**
* By default, the top part of the header stays when the header is being
condensed. Set this to true if you want the top part of the header
to be scrolled away.
*
* JavaScript Info:
* @property scrollAwayTopbar
* @type Boolean
*
*/
public boolean getScrollAwayTopbar(){
return getPolymerElement().getScrollAwayTopbar();
}
/**
* By default, the top part of the header stays when the header is being
condensed. Set this to true if you want the top part of the header
to be scrolled away.
*
* JavaScript Info:
* @property scrollAwayTopbar
* @type Boolean
*
*/
public void setScrollAwayTopbar(boolean value) {
getPolymerElement().setScrollAwayTopbar(value);
}
/**
* Returns the scrollable element.
*
* JavaScript Info:
* @method scroller
*
*/
public void scroller() {
getPolymerElement().scroller();
}
/**
*
*
* JavaScript Info:
* @method detached
*
*/
public void detached() {
getPolymerElement().detached();
}
/**
*
*
* JavaScript Info:
* @property listeners
* @type Object
*
*/
public JavaScriptObject getListeners(){
return getPolymerElement().getListeners();
}
/**
*
*
* JavaScript Info:
* @property listeners
* @type Object
*
*/
public void setListeners(JavaScriptObject value) {
getPolymerElement().setListeners(value);
}
/**
*
*
* JavaScript Info:
* @property observers
* @type Array
*
*/
public JsArray getObservers(){
return getPolymerElement().getObservers();
}
/**
*
*
* JavaScript Info:
* @property observers
* @type Array
*
*/
public void setObservers(JsArray value) {
getPolymerElement().setObservers(value);
}
/**
* Used to assign the closest resizable ancestor to this resizable
if the ancestor detects a request for notifications.
*
* JavaScript Info:
* @method assignParentResizable
* @param {} parentResizable
* @behavior NeonAnimatedPages
*/
public void assignParentResizable(JavaScriptObject parentResizable) {
getPolymerElement().assignParentResizable(parentResizable);
}
/**
* Can be called to manually notify a resizable and its descendant
resizables of a resize change.
*
* JavaScript Info:
* @method notifyResize
* @behavior NeonAnimatedPages
*/
public void notifyResize() {
getPolymerElement().notifyResize();
}
/**
* This method can be overridden to filter nested elements that should or
should not be notified by the current element. Return true if an element
should be notified, or false if it should not be notified.
*
* JavaScript Info:
* @method resizerShouldNotify
* @param {HTMLElement} element
* @behavior NeonAnimatedPages
*/
public void resizerShouldNotify(JavaScriptObject element) {
getPolymerElement().resizerShouldNotify(element);
}
/**
* Used to remove a resizable descendant from the list of descendants
that should be notified of a resize change.
*
* JavaScript Info:
* @method stopResizeNotificationsFor
* @param {} target
* @behavior NeonAnimatedPages
*/
public void stopResizeNotificationsFor(JavaScriptObject target) {
getPolymerElement().stopResizeNotificationsFor(target);
}
/**
*
*
* JavaScript Info:
* @method attached
* @behavior NeonAnimatedPages
*/
public void attached() {
getPolymerElement().attached();
}
/**
* Fired when the content has been scrolled.
*
* JavaScript Info:
* @event content-scroll
*/
public HandlerRegistration addContentScrollHandler(ContentScrollEventHandler handler) {
return addHandler(handler, ContentScrollEvent.TYPE);
}
/**
* Fired when the header is transformed.
*
* JavaScript Info:
* @event paper-header-transform
*/
public HandlerRegistration addPaperHeaderTransformHandler(PaperHeaderTransformEventHandler handler) {
return addHandler(handler, PaperHeaderTransformEvent.TYPE);
}
}