Package com.oorian.html.layout
Class EmptyStateLayout
java.lang.Object
A layout for empty state displays with icon, message, and action.
EmptyStateLayout provides a centered, visually appealing structure for displaying empty states such as "no data found", first-run experiences, search results with no matches, or any scenario where content is absent but user guidance is needed.
Structure:
┌──────────────────────────────────────┐ │ │ │ ┌────────┐ │ │ │ Icon │ │ │ └────────┘ │ │ │ │ Primary Message │ │ Secondary Message │ │ │ │ [ Action Button ] │ │ │ └──────────────────────────────────────┘
Features:
- Centered icon/illustration area
- Primary and secondary message text
- Optional action buttons
- Configurable spacing and sizing
- Fills parent or viewport
Usage:
// Basic empty state
EmptyStateLayout empty = new EmptyStateLayout();
empty.icon(noDataIcon)
.message("No students found")
.action(addStudentBtn);
// With description
EmptyStateLayout empty = new EmptyStateLayout();
empty.icon(searchIcon)
.message("No results found")
.description("Try adjusting your search criteria")
.action(clearFiltersBtn);
// Multiple actions
EmptyStateLayout empty = new EmptyStateLayout();
empty.icon(welcomeIcon)
.message("Welcome!")
.description("Get started by creating your first project")
.actions(createProjectBtn, viewTutorialBtn);
// Fill parent container
empty.fillParent();
- Since:
- 2025
- Version:
- 1.0
- Author:
- Marvin P. Warble Jr.
- See Also:
-
Constructor Summary
ConstructorsConstructorDescriptionConstructs an EmptyStateLayout with default configuration. -
Method Summary
Modifier and TypeMethodDescriptionSets a single action button.Sets multiple action buttons.Applies compact spacing (smaller gaps between elements).description(Element<?> description) Sets the secondary description element.description(String description) Sets the secondary description text.Returns the actions area for advanced customization.Returns the container for advanced customization.Returns the description area for advanced customization.Returns the icon area for advanced customization.Returns the message area for advanced customization.Sets the icon or illustration.protected voidBuilds the element tree for the layout.Sets the primary message element.Sets the primary message text.messageAndDescription(String message, String description) Sets both message and description in one call.noData()Configures the layout for a "no data" state (e.g., empty list/table).Configures the layout for an inbox/messages empty state.Configures the layout for a notifications empty state.Configures the layout for a "no results" state (e.g., search returned nothing).notFound()Configures the layout for a "not found" state.setActionsGap(int gap) Sets the gap between action buttons.setActionsGap(String gap) Sets the gap between action buttons.setContentPadding(int padding) Sets padding for the content container.setContentPadding(String padding) Sets padding for the content container.setDescriptionColor(String color) Sets the description text color.setDescriptionSpacing(int spacing) Sets spacing below the description.setDescriptionSpacing(String spacing) Sets spacing below the description.setIconSpacing(int spacing) Sets spacing below the icon.setIconSpacing(String spacing) Sets spacing below the icon.setMaxWidth(int maxWidth) Sets the maximum width of the content container.setMaxWidth(String maxWidth) Sets the maximum width of the content container.setMessageColor(String color) Sets the message text color.setMessageSpacing(int spacing) Sets spacing below the message.setMessageSpacing(String spacing) Sets spacing below the message.Sets icon, message, and description in one call.Applies spacious spacing (larger gaps between elements).welcome()Configures the layout for a first-time/welcome experience.Methods inherited from class com.oorian.html.layout.PageLayout
createPane, createPane, fillParent, fillViewport, setBackgroundColor, setMinHeightMethods inherited from class com.oorian.html.StyledElement
addClass, addStyle, addStyle, addStyleAttribute, addTransition, animate, clearTransitions, getActiveStyle, getCssClass, getDisabledStyle, getFocusStyle, getFocusVisibleStyle, getHoverStyle, getHtml, getStyle, getStyleAttribute, hidden, hide, isDisplayed, isTransitionForwardActive, onHide, onRemovedFromPage, onShow, removeClass, setActiveStyle, setAlignContent, setAlignContent, setAlignItems, setAlignItems, setAlignSelf, setAlignSelf, setAnimation, setAnimationDelay, setAnimationDelay, setAnimationDelay, setAnimationDirection, setAnimationDirection, setAnimationDuration, setAnimationDuration, setAnimationDuration, setAnimationFillMode, setAnimationFillMode, setAnimationIterationCount, setAnimationIterationCount, setAnimationIterationCount, setAnimationName, setAnimationPlayState, setAnimationPlayState, setAnimationTimingFunction, setAnimationTimingFunction, setAnimationTimingFunction, setAnimationTimingFunction, setBackdropFilter, setBackdropFilter, setBackfaceVisibility, setBackfaceVisibility, setBackground, setBackground, setBackgroundAttachment, setBackgroundAttachment, setBackgroundBlendMode, setBackgroundBlendMode, setBackgroundClip, setBackgroundClip, setBackgroundColor, setBackgroundColor, setBackgroundImage, setBackgroundImage, setBackgroundOrigin, setBackgroundOrigin, setBackgroundPosition, setBackgroundPosition, setBackgroundPosition, setBackgroundPosition, setBackgroundPosition, setBackgroundRepeat, setBackgroundRepeat, setBackgroundSize, setBackgroundSize, setBackgroundSize, setBackgroundSize, setBackgroundSize, setBlur, setBorder, setBorder, setBorder, setBorder, setBorder, setBorder, setBorder, setBorder, setBorder, setBorderBottom, setBorderBottom, setBorderBottom, setBorderBottom, setBorderBottom, setBorderBottom, setBorderBottom, setBorderBottom, setBorderBottomColor, setBorderBottomColor, setBorderBottomLeftRadius, setBorderBottomLeftRadius, setBorderBottomLeftRadius, setBorderBottomRightRadius, setBorderBottomRightRadius, setBorderBottomRightRadius, setBorderBottomStyle, setBorderBottomStyle, setBorderBottomWidth, setBorderBottomWidth, setBorderBottomWidth, setBorderBottomWidth, setBorderColor, setBorderColor, setBorderColor, setBorderColor, setBorderImage, setBorderImage, setBorderImageOutset, setBorderImageRepeat, setBorderImageSlice, setBorderImageSource, setBorderImageWidth, setBorderLeft, setBorderLeft, setBorderLeft, setBorderLeft, setBorderLeft, setBorderLeft, setBorderLeft, setBorderLeft, setBorderLeftColor, setBorderLeftColor, setBorderLeftStyle, setBorderLeftStyle, setBorderLeftWidth, setBorderLeftWidth, setBorderLeftWidth, setBorderLeftWidth, setBorderRadius, setBorderRadius, setBorderRadius, setBorderRadius, setBorderRadius, setBorderRadius, setBorderRight, setBorderRight, setBorderRight, setBorderRight, setBorderRight, setBorderRight, setBorderRight, setBorderRight, setBorderRightColor, setBorderRightColor, setBorderRightStyle, setBorderRightStyle, setBorderRightWidth, setBorderRightWidth, setBorderRightWidth, setBorderRightWidth, setBorderStyle, setBorderStyle, setBorderTop, setBorderTop, setBorderTop, setBorderTop, setBorderTop, setBorderTop, setBorderTop, setBorderTop, setBorderTopColor, setBorderTopColor, setBorderTopLeftRadius, setBorderTopLeftRadius, setBorderTopLeftRadius, setBorderTopRightRadius, setBorderTopRightRadius, setBorderTopRightRadius, setBorderTopStyle, setBorderTopStyle, setBorderTopWidth, setBorderTopWidth, setBorderTopWidth, setBorderTopWidth, setBorderWidth, setBorderWidth, setBorderWidth, setBorderWidth, setBorderWidth, setBorderWidth, setBorderWidth, setBottom, setBottom, setBottom, setBoxShadow, setBoxShadow, setBoxShadow, setBoxShadow, setBoxShadow, setBoxSizing, setBoxSizing, setBreakAfter, setBreakBefore, setBreakInside, setBrightness, setClass, setClear, setClear, setClip, setClipPath, setClipPath, setColGap, setColGap, setColor, setColor, setColumnCount, setColumnCount, setColumnFill, setColumnFill, setColumnGap, setColumnRule, setColumnRuleColor, setColumnRuleColor, setColumnRuleStyle, setColumnRuleStyle, setColumnRuleWidth, setColumnRuleWidth, setColumns, setColumns, setColumns, setColumnSpan, setColumnWidth, setColumnWidth, setColumnWidth, setContrast, setCounterIncrement, setCounterReset, setCursor, setCursor, setDirection, setDirection, setDisabledStyle, setDisplay, setDisplay, setFilter, setFilter, setFilterOpacity, setFlex, setFlexBasis, setFlexDirection, setFlexDirection, setFlexFlow, setFlexGrow, setFlexGrow, setFlexShrink, setFlexShrink, setFlexWrap, setFlexWrap, setFloat, setFloat, setFocusStyle, setFocusVisibleStyle, setFont, setFont, setFont, setFont, setFont, setFont, setFont, setFont, setFont, setFont, setFont, setFont, setFontFace, setFontFamily, setFontFamily, setFontFeatureSettings, setFontKerning, setFontLanguageOverride, setFontSize, setFontSize, setFontSize, setFontSizeAdjust, setFontStretch, setFontStretch, setFontStyle, setFontStyle, setFontSynthesis, setFontVariant, setFontVariant, setFontVariantAlternates, setFontVariantCaps, setFontVariantEastAsian, setFontVariantLigatures, setFontVariantNumeric, setFontVariantPosition, setFontWeight, setFontWeight, setGap, setGap, setGap, setGap, setGrayscale, setHangingPunctuation, setHangingPunctuation, setHeight, setHeight, setHeight, setHoverStyle, setHueRotate, setHyphens, setImageOrientation, setImageRendering, setImageResolution, setImeMode, setInvert, setJustifyContent, setJustifyContent, setKeyFrames, setLeft, setLeft, setLeft, setLetterSpacing, setLetterSpacing, setLetterSpacing, setLetterSpacing, setLineBreak, setLineHeight, setLineHeight, setLineHeight, setLineHeight, setMargin, setMargin, setMargin, setMargin, setMargin, setMarginBottom, setMarginBottom, setMarginBottom, setMarginLeft, setMarginLeft, setMarginLeft, setMarginRight, setMarginRight, setMarginRight, setMarginTop, setMarginTop, setMarginTop, setMark, setMarkAfter, setMarkBefore, setMarks, setMarqueeDirection, setMarqueePlayCount, setMarqueeSpeed, setMarqueeStyle, setMask, setMaskType, setMaxHeight, setMaxHeight, setMaxHeight, setMaxHeightToWindowHeight, setMaxWidth, setMaxWidthToWindowWidth, setMinHeight, setMinHeight, setMinHeightToWindowHeight, setMinWidth, setMinWidth, setMinWidth, setMinWidthToWindowWidth, setNavDown, setNavIndex, setNavIndex, setNavLeft, setNavRight, setNavUp, setObjectFit, setObjectPosition, setOnClickNavigateBack, setOnClickNavigateBack, setOnClickNavigateBack, setOnClickNavigateForward, setOnClickNavigateForward, setOnClickNavigateForward, setOnClickNavigateTo, setOnDblClick, setOnDblClickChange, setOpacity, setOpacity, setOrder, setOrder, setOrphans, setOutline, setOutline, setOutline, setOutline, setOutlineColor, setOutlineColor, setOutlineOffset, setOutlineOffset, setOutlineOffset, setOutlineStyle, setOutlineStyle, setOutlineWidth, setOutlineWidth, setOutlineWidth, setOutlineWidth, setOverflow, setOverflow, setOverflow, setOverflowWrap, setOverflowX, setOverflowX, setOverflowY, setOverflowY, setPadding, setPadding, setPadding, setPadding, setPadding, setPadding, setPadding, setPadding, setPaddingBottom, setPaddingBottom, setPaddingBottom, setPaddingLeft, setPaddingLeft, setPaddingLeft, setPaddingRight, setPaddingRight, setPaddingRight, setPaddingTop, setPaddingTop, setPaddingTop, setPageBreakAfter, setPageBreakAfter, setPageBreakBefore, setPageBreakBefore, setPageBreakInside, setPageBreakInside, setPerspective, setPerspective, setPerspective, setPerspectiveOrigin, setPerspectiveOrigin, setPerspectiveOrigin, setPerspectiveOrigin, setPhonemes, setPosition, setPosition, setPosition, setPosition, setPosition, setQuotes, setResize, setResize, setResizeToWindowHeight, setResizeToWindowHeight, setResizeToWindowWidth, setRest, setRestAfter, setRestBefore, setRight, setRight, setRight, setRotate, setRotate, setRowGap, setRowGap, setSaturate, setScale, setScale, setSepia, setShow, setSize, setSize, setSize, setSkewX, setSkewY, setStyle, setStyle, setTabSize, setTabSize, setTabSize, setTabSize, setTextAlign, setTextAlign, setTextAlignLast, setTextAlignLast, setTextCombineUpright, setTextCombineWeight, setTextDecoration, setTextDecoration, setTextDecorationColor, setTextDecorationColor, setTextDecorationLine, setTextDecorationLine, setTextDecorationStyle, setTextDecorationStyle, setTextIndent, setTextIndent, setTextIndent, setTextIndent, setTextJustify, setTextJustify, setTextOrientation, setTextOverflow, setTextOverflow, setTextSelectDisabled, setTextShadow, setTextShadow, setTextShadow, setTextShadow, setTextShadow, setTextTransform, setTextTransform, setTextUnderlinePosition, setTop, setTop, setTop, setTransform, setTransform, setTransformOrigin, setTransformOrigin, setTransformOrigin, setTransformOrigin, setTransformOrigin, setTransformStyle, setTransformStyle, setTransition, setTransitionDelay, setTransitionDelay, setTransitionDelay, setTransitionDuration, setTransitionDuration, setTransitionDuration, setTransitionProperty, setTransitionTimingFunction, setTransitionTimingFunction, setTransitionTimingFunction, setTransitionTimingFunction, setTranslateX, setTranslateY, setTranslateZ, setUnicodeBidi, setUnicodeBidi, setVerticalAlign, setVerticalAlign, setVisibility, setVisibility, setVoiceBalance, setVoiceDuration, setVoicePitch, setVoicePitchRange, setVoiceRate, setVoiceStress, setVoiceVolume, setWhiteSpace, setWhiteSpace, setWidows, setWidth, setWidth, setWidth, setWordBreak, setWordBreak, setWordSpacing, setWordSpacing, setWordSpacing, setWordSpacing, setWordWrap, setWordWrap, setWritingMode, setZIndex, setZIndex, show, shown, stopAnimation, transitionForward, transitionForward, transitionReverse, transitionReverse, updateStyle, updateStyle, updateStyleIfChangedMethods inherited from class com.oorian.html.VisualElement
clearOnClick, click, disable, enable, getAccessKey, getAutoCapitalize, getEnterKeyHint, getInputMode, getPopover, getRole, getTabIndex, getTitle, isAutoFocus, isContentEditable, isDisabled, isDraggable, isHidden, isInert, isSpellCheck, onDisabled, onEnabled, setAccessKey, setAriaAtomic, setAriaBusy, setAriaChecked, setAriaCheckedMixed, setAriaControls, setAriaCurrent, setAriaDescribedBy, setAriaDisabled, setAriaErrorMessage, setAriaExpanded, setAriaHasPopup, setAriaHasPopup, setAriaHidden, setAriaInvalid, setAriaLabel, setAriaLabelledBy, setAriaLevel, setAriaLive, setAriaModal, setAriaOwns, setAriaPressed, setAriaRequired, setAriaSelected, setAriaValueRange, setAriaValueText, setAutoCapitalize, setAutoFocus, setConsumeEvent, setContentEditable, setDisabled, setDraggable, setDropAllowed, setEnterKeyHint, setFocus, setHidden, setInert, setInputMode, setOnAnimationCancel, setOnAnimationEnd, setOnAnimationIteration, setOnAnimationStart, setOnAuxClick, setOnBeforeInput, setOnBeforeToggle, setOnBlur, setOnChange, setOnClick, setOnClickChange, setOnCompositionEnd, setOnCompositionStart, setOnCompositionUpdate, setOnContextMenu, setOnCopy, setOnCut, setOnDocumentResize, setOnFocus, setOnFocusIn, setOnFocusOut, setOnFormData, setOnGotPointerCapture, setOnInput, setOnInvalid, setOnKeyDown, setOnKeyPressed, setOnKeyUp, setOnLostPointerCapture, setOnMouseDown, setOnMouseEnter, setOnMouseLeave, setOnMouseMove, setOnMouseOut, setOnMouseOutChangeClass, setOnMouseOutChangeStyle, setOnMouseOutChangeStyle, setOnMouseOver, setOnMouseOverChangeClass, setOnMouseOverChangeStyle, setOnMouseOverChangeStyle, setOnMouseOverShow, setOnMouseUp, setOnPageLoad, setOnPaste, setOnPointerCancel, setOnPointerDown, setOnPointerEnter, setOnPointerLeave, setOnPointerMove, setOnPointerOut, setOnPointerOver, setOnPointerUp, setOnResize, setOnScroll, setOnScrollEnd, setOnSelect, setOnSelectionChange, setOnSelectStart, setOnToggle, setOnTouchCancel, setOnTouchEnd, setOnTouchMove, setOnTouchStart, setOnTransitionCancel, setOnTransitionEnd, setOnTransitionRun, setOnTransitionStart, setOnWheel, setOnWindowResize, setPopover, setRole, setRole, setSpellCheck, setTabIndex, setTitle, setTooltipMethods inherited from class com.oorian.html.Element
addAttribute, addAttribute, addAttribute, addAttribute, addElement, addLineBreak, addLineOfText, addLineOfText, addLineOfText, addParagraph, addParagraph, addSpacer, addText, addText, addText, addText, assignId, containsElement, containsElement, create, dispatchEvent, dispatchEvent, dispatchEvent, dispatchEvent, equals, excludeId, executeJs, executeJs, executeJs, getAccept, getAllElements, getAncestor, getAttribute, getAttributes, getComponent, getDir, getElement, getElementById, getElementCount, getElementCount, getElements, getElements, getElementsByComponentName, getElementsByTagName, getHtml, getId, getInnerHtml, getInnerHtml, getIs, getItemId, getItemProp, getItemRef, getItemType, getLang, getNextSibling, getPage, getParent, getPart, getPrevSibling, getSlot, getTagName, getTextContent, getUrl, hasAttribute, hasElements, insertElement, isChildOf, isClosedTag, isCreated, isDescendantOf, isDescendantOf, isInitialized, isItemScope, isTranslate, onCallback, onCreated, onElementAdded, onElementRemoved, onHashChange, onHidden, onInitialized, onJsReturn, onPageLoaded, onPageUnloaded, onRefresh, onShown, onUpdated, onUserEvent, prewrite, recreate, refresh, refresh, registerAddition, registerListener, registerListener, registerListener, registerListener, registerListener, registerListener, registerListener, registerSubtraction, registerUpdate, removeAllElements, removeAttribute, removeAttribute, removeElement, removeElement, removeFromParent, requestCallback, requestCallback, requestCallback, requestCallback, resetId, scrollTo, scrollToBottom, scrollToTop, self, sendCommand, sendUpdate, setAccept, setComponent, setDir, setDir, setElement, setId, setIs, setItemId, setItemProp, setItemRef, setItemScope, setItemType, setLang, setOnError, setOnLoad, setPage, setParent, setPart, setSlot, setTagName, setText, setText, setText, setText, setTranslate, toString, unregisterListener, update, updateAttributes
-
Constructor Details
-
EmptyStateLayout
public EmptyStateLayout()Constructs an EmptyStateLayout with default configuration.
-
-
Method Details
-
initialize
protected void initialize()Builds the element tree for the layout.- Overrides:
initializein classStyledElement<EmptyStateLayout>
-
icon
Sets the icon or illustration.- Parameters:
icon- the icon element (image, SVG, icon component, etc.)- Returns:
- this EmptyStateLayout for method chaining
-
message
Sets the primary message text.- Parameters:
message- the message text- Returns:
- this EmptyStateLayout for method chaining
-
message
Sets the primary message element.- Parameters:
message- the message element- Returns:
- this EmptyStateLayout for method chaining
-
description
Sets the secondary description text.- Parameters:
description- the description text- Returns:
- this EmptyStateLayout for method chaining
-
description
Sets the secondary description element.- Parameters:
description- the description element- Returns:
- this EmptyStateLayout for method chaining
-
action
Sets a single action button.- Parameters:
action- the action button element- Returns:
- this EmptyStateLayout for method chaining
-
actions
Sets multiple action buttons.- Parameters:
actions- the action button elements- Returns:
- this EmptyStateLayout for method chaining
-
setMaxWidth
Sets the maximum width of the content container.- Overrides:
setMaxWidthin classStyledElement<EmptyStateLayout>- Parameters:
maxWidth- the max width in pixels- Returns:
- this EmptyStateLayout for method chaining
-
setMaxWidth
Sets the maximum width of the content container.- Overrides:
setMaxWidthin classStyledElement<EmptyStateLayout>- Parameters:
maxWidth- the max width value (e.g., "400px", "50%")- Returns:
- this EmptyStateLayout for method chaining
-
setContentPadding
Sets padding for the content container.- Parameters:
padding- the padding in pixels- Returns:
- this EmptyStateLayout for method chaining
-
setContentPadding
Sets padding for the content container.- Parameters:
padding- the padding value (e.g., "32px", "2rem")- Returns:
- this EmptyStateLayout for method chaining
-
setIconSpacing
Sets spacing below the icon.- Parameters:
spacing- the spacing in pixels- Returns:
- this EmptyStateLayout for method chaining
-
setIconSpacing
Sets spacing below the icon.- Parameters:
spacing- the spacing value (e.g., "24px", "1.5rem")- Returns:
- this EmptyStateLayout for method chaining
-
setMessageSpacing
Sets spacing below the message.- Parameters:
spacing- the spacing in pixels- Returns:
- this EmptyStateLayout for method chaining
-
setMessageSpacing
Sets spacing below the message.- Parameters:
spacing- the spacing value (e.g., "8px", "0.5rem")- Returns:
- this EmptyStateLayout for method chaining
-
setDescriptionSpacing
Sets spacing below the description.- Parameters:
spacing- the spacing in pixels- Returns:
- this EmptyStateLayout for method chaining
-
setDescriptionSpacing
Sets spacing below the description.- Parameters:
spacing- the spacing value (e.g., "24px", "1.5rem")- Returns:
- this EmptyStateLayout for method chaining
-
setActionsGap
Sets the gap between action buttons.- Parameters:
gap- the gap in pixels- Returns:
- this EmptyStateLayout for method chaining
-
setActionsGap
Sets the gap between action buttons.- Parameters:
gap- the gap value (e.g., "12px", "1rem")- Returns:
- this EmptyStateLayout for method chaining
-
setMessageColor
Sets the message text color.- Parameters:
color- the text color- Returns:
- this EmptyStateLayout for method chaining
-
setDescriptionColor
Sets the description text color.- Parameters:
color- the text color- Returns:
- this EmptyStateLayout for method chaining
-
getContainer
Returns the container for advanced customization.- Returns:
- the container div
-
getIconArea
Returns the icon area for advanced customization.- Returns:
- the icon area div
-
getMessageArea
Returns the message area for advanced customization.- Returns:
- the message area div
-
getDescriptionArea
Returns the description area for advanced customization.- Returns:
- the description area div
-
getActionsArea
Returns the actions area for advanced customization.- Returns:
- the actions area div
-
noResults
Configures the layout for a "no results" state (e.g., search returned nothing).- Returns:
- this EmptyStateLayout for method chaining
-
noData
Configures the layout for a "no data" state (e.g., empty list/table).- Returns:
- this EmptyStateLayout for method chaining
-
notFound
Configures the layout for a "not found" state.- Returns:
- this EmptyStateLayout for method chaining
-
welcome
Configures the layout for a first-time/welcome experience.- Returns:
- this EmptyStateLayout for method chaining
-
noMessages
Configures the layout for an inbox/messages empty state.- Returns:
- this EmptyStateLayout for method chaining
-
noNotifications
Configures the layout for a notifications empty state.- Returns:
- this EmptyStateLayout for method chaining
-
messageAndDescription
Sets both message and description in one call.- Parameters:
message- the primary messagedescription- the secondary description- Returns:
- this EmptyStateLayout for method chaining
-
setup
Sets icon, message, and description in one call.- Parameters:
icon- the icon elementmessage- the primary messagedescription- the secondary description- Returns:
- this EmptyStateLayout for method chaining
-
compactStyle
Applies compact spacing (smaller gaps between elements).- Returns:
- this EmptyStateLayout for method chaining
-
spaciousStyle
Applies spacious spacing (larger gaps between elements).- Returns:
- this EmptyStateLayout for method chaining
-