com.vaadin.polymer.paper.PaperScrollHeaderPanelElement 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;
import com.vaadin.polymer.elemental.*;
import com.google.gwt.core.client.JavaScriptObject;
import com.google.gwt.core.client.JsArray;
import jsinterop.annotations.JsOverlay;
import jsinterop.annotations.JsProperty;
import jsinterop.annotations.JsType;
/**
* Material design: Scrolling techniques
* 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.
* Note: If the class paper-header is used, the header must be positioned relative or absolute. e.g.
* .paper-header {
* position: relative;
* }
*
* <paper-scroll-header-panel>
* <div class="paper-header">Header</div>
* <div>Content goes here...</div>
* </paper-scroll-header-panel>
*
* Styling
* =======
* The following custom properties and mixins are available for styling:
*
*
*
* Custom property
* Description
* Default
*
*
*
*
* –paper-scroll-header-panel-full-header
* To change background for toolbar when it is at its full size
* {}
*
*
* –paper-scroll-header-panel-condensed-header
* To change the background for toolbar when it is condensed
* {}
*
*
* –paper-scroll-header-panel-container
* To override or add container styles
* {}
*
*
* –paper-scroll-header-panel-header-container
* To override or add header styles
* {}
*
*
*
*/
@JsType(isNative=true)
public interface PaperScrollHeaderPanelElement extends HTMLElement {
@JsOverlay public static final String TAG = "paper-scroll-header-panel";
@JsOverlay public static final String SRC = "paper-scroll-header-panel/paper-scroll-header-panel.html";
/**
* If true, the header is fixed to the top and never moves away.
*
* JavaScript Info:
* @property fixed
* @type Boolean
*
*/
@JsProperty boolean getFixed();
/**
* If true, the header is fixed to the top and never moves away.
*
* JavaScript Info:
* @property fixed
* @type Boolean
*
*/
@JsProperty void setFixed(boolean 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:
* @property headerHeight
* @type Number
*
*/
@JsProperty double 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
*
*/
@JsProperty void setHeaderHeight(double value);
/**
* The state of the header. Depending on the configuration and the scrollTop value,
the header state could change to
Polymer.PaperScrollHeaderPanel.HEADER_STATE_EXPANDED
Polymer.PaperScrollHeaderPanel.HEADER_STATE_HIDDEN
Polymer.PaperScrollHeaderPanel.HEADER_STATE_CONDENSED
Polymer.PaperScrollHeaderPanel.HEADER_STATE_INTERPOLATED
*
* JavaScript Info:
* @property headerState
* @type Number
*
*/
@JsProperty double getHeaderState();
/**
* The state of the header. Depending on the configuration and the scrollTop value,
the header state could change to
Polymer.PaperScrollHeaderPanel.HEADER_STATE_EXPANDED
Polymer.PaperScrollHeaderPanel.HEADER_STATE_HIDDEN
Polymer.PaperScrollHeaderPanel.HEADER_STATE_CONDENSED
Polymer.PaperScrollHeaderPanel.HEADER_STATE_INTERPOLATED
*
* JavaScript Info:
* @property headerState
* @type Number
*
*/
@JsProperty void setHeaderState(double 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
*
*/
@JsProperty boolean 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
*
*/
@JsProperty void setCondenses(boolean value);
/**
* If true, no cross-fade transition from one background to another.
*
* JavaScript Info:
* @property noDissolve
* @type Boolean
*
*/
@JsProperty boolean getNoDissolve();
/**
* If true, no cross-fade transition from one background to another.
*
* JavaScript Info:
* @property noDissolve
* @type Boolean
*
*/
@JsProperty void setNoDissolve(boolean value);
/**
* If true, the header doesn’t slide back in when scrolling back up.
*
* JavaScript Info:
* @property noReveal
* @type Boolean
*
*/
@JsProperty boolean getNoReveal();
/**
* If true, the header doesn’t slide back in when scrolling back up.
*
* JavaScript Info:
* @property noReveal
* @type Boolean
*
*/
@JsProperty void setNoReveal(boolean value);
/**
* 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
*
*/
@JsProperty double 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
*
*/
@JsProperty void setCondensedHeaderHeight(double 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
*
*/
@JsProperty boolean 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
*
*/
@JsProperty void setScrollAwayTopbar(boolean value);
/**
* If true, the condensed header is always shown and does not move away.
*
* JavaScript Info:
* @property keepCondensedHeader
* @type Boolean
*
*/
@JsProperty boolean getKeepCondensedHeader();
/**
* If true, the condensed header is always shown and does not move away.
*
* JavaScript Info:
* @property keepCondensedHeader
* @type Boolean
*
*/
@JsProperty void setKeepCondensedHeader(boolean value);
/**
* 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 VaadinSplitLayout
*
*/
void stopResizeNotificationsFor(Object target);
/**
* 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 VaadinSplitLayout
*
*/
void assignParentResizable(Object parentResizable);
/**
* Invoke this to tell paper-scroll-header-panel to re-measure the header’s
height.
*
* JavaScript Info:
* @method measureHeaderHeight
*
*
*/
void measureHeaderHeight();
/**
* Can be called to manually notify a resizable and its descendant
resizables of a resize change.
*
* JavaScript Info:
* @method notifyResize
* @behavior VaadinSplitLayout
*
*/
void notifyResize();
/**
* Scroll to a specific y coordinate.
*
* JavaScript Info:
* @method scroll
* @param {number} top
* @param {boolean} smooth
*
*
*/
void scroll(double top, boolean smooth);
/**
* Scroll to the top of the content.
*
* JavaScript Info:
* @method scrollToTop
* @param {boolean} smooth
*
*
*/
void scrollToTop(boolean smooth);
/**
* Condense the header.
*
* JavaScript Info:
* @method condense
* @param {boolean} smooth
*
*
*/
void condense(boolean smooth);
/**
* 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 VaadinSplitLayout
* @return {boolean}
*/
boolean resizerShouldNotify(JavaScriptObject element);
}