ASP.NET MVC Controls | ComponentOne
In This Topic
    GridLayout Class
    In This Topic
    File
    c1.nav.js
    Module
    c1.nav.grid
    Base Class
    LayoutBase
    Derived Classes
    AutoGridLayout, ManualGridLayout

    Defines the base class represents the grid layout.

    Constructor

    Properties

    Methods

    Constructor

    constructor

    constructor(options?: any): GridLayout
    

    Initializes a new instance of the GridLayout class.

    Parameters
    • options: any
    Optional

    JavaScript object containing initialization data for the layout.

    Returns
    GridLayout

    Properties

    activeTile

    Gets the current active tile.

    Inherited From
    LayoutBase
    Type
    Tile

    cellSize

    Gets or sets the size of the cell in the grid layout. It is in pixels.

    Type
    number

    cellSpacing

    Gets or sets the spacing of the cell in the grid layout. It is in pixels.

    Type
    number

    dashboard

    Gets the DashboardLayout control which the layout is applied in.

    Inherited From
    LayoutBase
    Type
    DashboardLayout

    definition

    Gets or sets the current layout settings as a JSON string.

    This property is typically used to persist the layout settings. The maximum state of the tile is temporary and it will not be persisted.

    Inherited From
    LayoutBase
    Type
    any

    fullTypeName

    Gets the full type name of the current object.

    It should be overrided for every class which extends from this class..

    Inherited From
    LayoutBase
    Type
    string

    groupSpacing

    Gets or sets the spacing of the group in the grid layout. It is in pixels.

    Type
    number

    isCreateGroup

    Gets the isCreateGroup of the current object.

    Inherited From
    LayoutBase
    Type
    boolean

    items

    Gets the layout item collection.

    Inherited From
    LayoutBase
    Type
    LayoutItemCollection

    maxRowsOrColumns

    Gets or sets the maximum number of the row count or the column count.

    If the tiles are laid out vertically, it is used to specify the max count of columns the layout could hold. The tiles shown in the column can not exceed this value. For AutoGridLayout, if there are no enough column spans to hold the next tile, it will be shown in the next row. For ManualGridLayout, if the tile's Column is specified to exceed the max value, it will be shown at the cell with the max column index in the row.

    If the tiles are laid out horizontally, it is used to specify the max count of rows the layout could hold. For AutoGridLayout, if there are no enough row spans to hold the next tile, it will moved to next column. For ManualGridLayout, if the tile's Row exceeds this value, it will be shown at the cell with the max row index in the column.

    Type
    number

    orientation

    Gets or sets the layout orientation.

    Type
    LayoutOrientation

    Methods

    addEventListener

    addEventListener(target: EventTarget, type: string, fn: any, capture?: boolean): void
    

    Adds an event listener to an element owned by this Control.

    The control keeps a list of attached listeners and their handlers, making it easier to remove them when the control is disposed (see the dispose and removeEventListener methods).

    Failing to remove event listeners may cause memory leaks.

    Parameters
    • target: EventTarget

      Target element for the event.

    • type: string

      String that specifies the event.

    • fn: any

      Function to execute when the event occurs.

    • capture: boolean
    Optional

    Whether the listener is capturing.

    Inherited From
    DisposableObject
    Returns
    void

    attachTo

    attachTo(dashboard: DashboardLayout): void
    

    Applies this layout to the specified DashboardLayout control.

    Parameters
    Inherited From
    LayoutBase
    Returns
    void

    detach

    detach(): void
    

    Detaches this layout from the DashboardLayout control.

    It is often used when applying the new layout, the old layout should be detached.

    Returns
    void

    dispose

    dispose(fullDispose?: boolean): void
    

    Disposes the object.

    Parameters
    Optional

    A boolean value decides wehter to keep the current status when disposing. If true, all the current status will be cleared. Otherwise, keep the current status.

    Returns
    void

    draw

    draw(): void
    

    Draws the layout.

    Returns
    void

    endMove

    endMove(movedTile: Tile, endPosition: Point): void
    

    Ends moving the tile at the specified postion.

    Parameters
    • movedTile: Tile

      The tile to be moved.

    • endPosition: Point

      The position where the tile is moved to. It is the coordinate within the browser visible area.

    Returns
    void

    initialize

    initialize(options: any): void
    

    Initializes the layout by copying the properties from a given object.

    This method allows you to initialize the object using plain data objects instead of setting the value of each property in code.

    Parameters
    • options: any

      Object that contains the initialization data.

    Inherited From
    LayoutBase
    Returns
    void

    invalidate

    invalidate(fullUpdate?: boolean): void
    

    Invalidates the dashboard causing an asynchronous refresh.

    Parameters
    • fullUpdate: boolean Optional

      Whether to update the dashboard layout as well as the content.

    Inherited From
    LayoutBase
    Returns
    void

    move

    move(movedTile: Tile, position: Point): void
    

    Moves the tile.

    Parameters
    • movedTile: Tile

      The tile to be moved.

    • position: Point

      The position of the moving mouse. It is the coordinate within the browser visible area.

    Inherited From
    LayoutBase
    Returns
    void

    moveTo

    moveTo(tile: Tile, pt: Point): void
    

    Moves the tile to the specified postion.

    Parameters
    • tile: Tile

      The tile to be moved.

    • pt: Point

      The position where the tile is moved to in relation to the dashboard.

    Returns
    void

    refresh

    refresh(fullUpdate?: boolean): void
    

    Refreshes the layout.

    Parameters
    • fullUpdate: boolean Optional

      A boolean value decides whether to update the content completely. If true, the layout refreshes without keeping the current status(moving, resizing and etc.). Otherwise, the status is kept after refreshing.

    Returns
    void

    remove

    remove(removedTile: Tile): boolean
    

    Removes the tile from the layout.

    Parameters
    • removedTile: Tile

      The tile to be removed.

    Inherited From
    LayoutBase
    Returns
    boolean

    removeEventListener

    removeEventListener(target?: EventTarget, type?: string, fn?: any, capture?: boolean): number
    

    Removes one or more event listeners attached to elements owned by this Control.

    Parameters
    • target: EventTarget Optional

      Target element for the event. If null, removes listeners attached to all targets.

    • type: string Optional

      String that specifies the event. If null, removes listeners attached to all events.

    • fn: any Optional

      Handler to remove. If null, removes all handlers.

    • capture: boolean Optional

      Whether the listener is capturing. If null, removes capturing and non-capturing listeners.

    Inherited From
    DisposableObject
    Returns
    number

    resize

    resize(resizedTile: Tile, toPosition?: Point): boolean
    

    Resize the tile to the specified postion.

    Parameters
    • resizedTile: Tile

      The tile to be resized.

    • toPosition: Point Optional

      The position where the tile is resized to. It is the coordinate within the browser visible area.

    Inherited From
    LayoutBase
    Returns
    boolean

    resizeTo

    resizeTo(resizedTile: Tile, newSize: Size): boolean
    

    Resizes the tile to the specified size.

    Adds the codes to resize the tile to the specified size by pxWidth and pxHeight.

    Parameters
    • resizedTile: Tile

      The tile to be resized.

    • newSize: Size

      The new size.

    Returns
    boolean

    showAll

    showAll(): void
    

    Shows all the tiles.

    Inherited From
    LayoutBase
    Returns
    void

    startMove

    startMove(movedTile: Tile, startPosition: Point): boolean
    

    Starts to move the tile.

    Parameters
    • movedTile: Tile

      The tile to be moved.

    • startPosition: Point

      The started position where the tile will be moved from. It is the coordinate within the browser visible area.

    Returns
    boolean

    toggleSize

    toggleSize(currentTile: Tile): void
    

    Toggles the tile size.

    Parameters
    • currentTile: Tile

      The tile to be toggled.

    Inherited From
    LayoutBase
    Returns
    void