Skip to content

Column Resizing

Stanka Bozalieva edited this page Mar 14, 2018 · 14 revisions

Column Resizing Specification

Contents

  1. Overview
  2. User Stories
  3. Functionality
  4. ARIA support
  5. Assumptions and Limitations
  6. References

Objectives

Provides deffered column resizing for the igxGrid.

Developer:

  • As developer, I want to enable deffered resizing per column, so that I can allow the user to modify their width. more at Assumptions and Limitations

  • As a developer, I want to allow a Excel-like resizing mode that changes the width of the grid itself, so that I can allow the user to have more freedom. The resizing affects all following columns and if the grid exceeds it's width, a horizontal scroll appears.

In case of percentage units, all columns width are adjusted to preserve the overall width of the grid (this would be implemented internally). more at Assumptions and Limitations

  • As a developer, I want to be notified when a column is resized, so that I can add custom logic.

  • As a developer, I want to configure minimum and maximum allowable column widths, so that I can restrict the end users to resizing columns to specific sizes.

  • As a developer, I want to enable best fit (auto) sizing via double clicking the resize icon on the header – the column will be sized to the longest currently visible cell value, so that the user can see the entire content. more at Assumptions and Limitations

  • As a developer, I want to be able to style the resize indicator.

  • As a developer I want to enable columns resizing to multicolumn headers.

  • As a developer I want to enable columns resizing to **multicolumn headers.

End user:

  • As an end user, I want to be able to resize columns, so that I can adjust the size of the columns.

  • As an end user, I want to have resize indicator, when the mouse is positioned over the header side border, so that I would that I can resize the columns.

  • As an end user, I want to resize the columns by click, dragging and dropping the visual indicator.

  • As an end user, I want a resize preview while dragging, so that I can have a resize preview.

  • As an end user, I want to be able to resize the columns so that exceed the grid width, so that I can view columns resized to my needs. (Excel-like way)

  • As an end user, I want to auto-size a column by double clicking on resize indicator, so that I can see the column contate without it being truncated.

  • As an end user, I want to be able to resize columns with multicolumn headers, pinning applied, etc.

Acceptance criteria

  1. Deffered resizing.
  2. Resizing will affect the overall width of the grid. ...

Describe behavior, design, look and feel of the implemented feature. Always include visual mock-up

3.1. End User Experience

Ends users are able to resize columns to their needs, so that they can see more or less of certain columns. The resizing is done with click and drag of the resizing indicator. While dragging occurs there is a visual indication of the new position of the dragged border. Resizing applies at drag drop.(deffered resizing) The resizing affects the width of the grid.

When resizing a child column, the parent column should also be resized. Same for when resizing the parent column – child column should adjust their sizes proportionally.

Pinned columns – pinned column can be resized but resizing will be limited to 80% of the overall grid width.**

3.2. Developer Experience

3.3. Globalization/Localization

Describe any special localization requirements such as the number of localizable strings, regional formats

3.4. User Interface

Include a diagram linking the elements with the visual representation of the feature

3.5. Navigation

3.6. API

Options

Name Description Type Default value Valid values

Methods

Name Description Return type Parameters

Events

Name Description Cancelable Parameters

Specify only if applicable

Assumptions Limitation Notes
Clone this wiki locally