Abstract

This documents purpose is to outline the goals of the resizing architecture (nice big word) with regards to columns and how they interact within the parent document. There has been some significant discussion between myself, Ruben and Alex at Javeline about how this should work. My basic philosophy (another big word) is to try and keep it simple. As developers we have a habit of falling into the ain't that cool design trap. When in the real world (could have used a big word there) the simple implementation covers the majority of user needs. We, ergo developers, have a really bad habit of falling prey to our own genius at times!!

So on that note lets take a look at what a grid does. Its provides a list of data divided into columns, pretty simple isn't it!

Design Assumptions

1. Keep it simple,
2. Column width can be provided in % or px,
3. Grid can accept mixed column width types, i.e. percent and pixel,
4. Internally within the grid percents are converted to px and we treat everything as pixels as % can get real ugly real fast.

Two Modes of Operation

When I look at something like the Windows Explorer or an Access table or any other grid like structure the basic operation is, if the columns exceed the window size show a horizontal scroll bar. This is a very very important thing to note. Users expect things to behave in a certain way that they are accustomed to. This means if I resize a column where the result is to push column to my right off the the visable viewing area I get a horizontal scroll bar. Having said that we also know that in general users are not the sharpest knives in the drawer! Questions like 'the column disappeared' seem to suddenly leap into my mind. So based on this assumption it seems like a good idea to provide a property/switch on the control that states no horizontal scroll.

Min-Width and Max-Width

It is important that we provide the ability to stop resizing at a certain point due to the data that may be displayed. The more important of the two is min-width from an interface stand point. Developers will want to use a min-width in order to prevent the hiding of such things as buttons within a column as they are important to the functionality.

Min-Width and Max-Width are a property of a column and can be provided in either % or px regardless of how the width was provided.

Logic - Allowed Horizontal Scroll

This is very simple. We do not care about the horizontal scroll. When column A is resized large, columns B,C and D are pushed to the right. When resized smaller columns B,C and D would move the left. If the result of the scrolling is the creation of a horizontal scroll bar then so be it.

Min and Max Column Widths apply. A column can not be resized beyond either of these two points.

Logic - Disallowed Horizontal Scroll - i.e. Fit the Bastard

Assuming the datagrid has 4 columns A,B,C and D.

1. Each column is 25% within no min or max. User resizes column A to 40%, columns B,C and D are each now 20%.
2. Each column is 25% and column B has a min of 15%. User resizes column A to 70%, column B is now 15%, columns C and D are now 12.5%.
3. Each column is 25% and columns B and C have a min of 25%. User resizes column A to 50%, B and C are 25% and D is hidden.
4. Each Column is 25% and columns B, C and D have a min of 20%. User resizes column A and reaches 40%, can not resize any further as columns B,C and D preclude the user.
5. Each Column is 25% and column A has a min of 25%. User can not resize column a smaller.
6. Each Column is 25% and columns B,C and D have a max of 25%. User can not resize column A smaller as this would result in column B,C or D exceeding 25%.
7. A matching width, min and max on a column precludes resizing that column.
8. The Weird One. Each column is 25%. Column a has a min-width of 200px. On rendering or resizing subsequent columns get truncated!!!

Perhaps, based on the last scenario it would be best to force % on dissalow horizontal scroll. Otherwise we could be in a big hole of programming dispare!!!