Packageview.primeFaces.surfaceComponents.components
Classpublic class Div
InheritanceDiv Inheritance view.primeFaces.supportClasses.Container
Implements view.interfaces.IGetChildrenSurfaceComponent, view.interfaces.IDiv, view.interfaces.IHistorySurfaceComponent, interfaces.IComponentSizeOutput, view.interfaces.IDropAcceptableComponent, view.interfaces.ICDATAInformation
Subclasses MainApplication, RootDiv

Representation of div in HTML

Visual Editor XML: 
     <Div
     Attributes
     width="120"
     height="120"
     percentWidth="80"
     percentHeight="80"
     class="flexHorizontalLayout flexHorizontalLayoutLeft flexHorizontalLayoutTop">
      <Script>
          <![CDATA[ Some information ]]>
      </Script>
     </Div>
PrimeFaces output: 
     <div
     Attributes
     style="width:120px;height:120px;"
     class="flexHorizontalLayout flexHorizontalLayoutLeft flexHorizontalLayoutTop"/>

Default MXML PropertymxmlContentFactory


Public Properties
 PropertyDefined By
  cssClass : String
[read-only] HTML: class This property helps laying out children Horizontally or Vertically.
Div
  ELEMENT_NAME : String = Div
[static]
Div
  height : Number
[override] PrimeFaces: style
Div
  isDomino : Boolean = false
Div
  percentHeight : Number
[override] [read-only] PrimeFaces: style
Div
  percentWidth : Number
[override] [read-only] PrimeFaces: style
Div
  width : Number
[override] [read-only] PrimeFaces: style
Div
Protected Properties
 PropertyDefined By
  heightOutputChanged : Boolean
Div
  widthOutputChanged : Boolean
Div
Public Methods
 MethodDefined By
  
Div()
Div
  
toRoyaleConvertCode():XML
Div
Protected Methods
 MethodDefined By
  
resetPercentWidthHeightBasedOnLayout():void
Div
Public Constants
 ConstantDefined By
  PRIME_FACES_XML_ELEMENT_NAME : String = div
[static]
Div
Property Detail
cssClassproperty
cssClass:String  [read-only]

HTML: class

This property helps laying out children Horizontally or Vertically. It uses browser FlexBox mechanism to avoid problems which occurs when children in div are positioned using default mechanism. Exported PrimeFaces project contains moonshine-layout-styles.css file which has classes ready to use for laying out children.

Use listed css classes to laying out children:

Horizontal Layout

Vertical Layout

Horizontal/Vertical Layout

https://css-tricks.com/snippets/css/a-guide-to-flexbox/

The default value is "flexHorizontalLayoutWrap flexHorizontalLayoutLeft flexHorizontalLayoutTop".


Implementation
    public function get cssClass():String

Example
Visual Editor XML: 
<Div class="flexHorizontalLayoutWrap flexHorizontalLayoutLeft flexHorizontalLayoutTop"/>
HTML: 
<div class="flexHorizontalLayoutWrap flexHorizontalLayoutLeft flexHorizontalLayoutTop"/>
ELEMENT_NAMEproperty 
public static var ELEMENT_NAME:String = Div

heightproperty 
height:Number[override]

PrimeFaces: style

The default value is "120".

This property can be used as the source for data binding.


Implementation
    public function get height():Number
    public function set height(value:Number):void

Example
Visual Editor XML: 
<Div height="120"/>
PrimeFaces: 
<div style="height:120px;"/>
heightOutputChangedproperty 
protected var heightOutputChanged:Boolean

isDominoproperty 
public var isDomino:Boolean = false

percentHeightproperty 
percentHeight:Number  [read-only] [override]

PrimeFaces: style

This property can be used as the source for data binding.


Implementation
    public function get percentHeight():Number

Example
Visual Editor XML: 
<Div percentHeight="80"/>
PrimeFaces: 
<div style="height:80%;"/>
percentWidthproperty 
percentWidth:Number  [read-only] [override]

PrimeFaces: style

This property can be used as the source for data binding.


Implementation
    public function get percentWidth():Number

Example
Visual Editor XML: 
<Div percentWidth="80"/>
PrimeFaces: 
<div style="width:80%;"/>
widthproperty 
width:Number  [read-only] [override]

PrimeFaces: style

The default value is "120".

This property can be used as the source for data binding.


Implementation
    public function get width():Number

Example
Visual Editor XML: 
<Div width="120"/>
PrimeFaces: 
<div style="width:120px;"/>
widthOutputChangedproperty 
protected var widthOutputChanged:Boolean

Constructor Detail
Div()Constructor
public function Div()



Method Detail
resetPercentWidthHeightBasedOnLayout()method
protected function resetPercentWidthHeightBasedOnLayout():void

toRoyaleConvertCode()method 
public function toRoyaleConvertCode():XML

Returns
XML
Constant Detail
PRIME_FACES_XML_ELEMENT_NAMEConstant
public static const PRIME_FACES_XML_ELEMENT_NAME:String = div





Tue Apr 26 2022, 01:14 PM +02:00