Blogs

News

Email Subscriptions

Mehul Harry's DevExpress Blog

Flow Layout In ASP.NET DataView (Upcoming Feature)

     

In the DXperience 2009 volume 1 release, expected to release 1st quarter of 2009, the ASPxDataView will support the 'flow' layout mode.

With a flow layout, the items in the ASPxDataView will flow one after another even after the browser is resized. This allows you to automatically fill the page area in the best possible way.

Why is this useful?

Let's say you've got a page that displays a bunch of images. A flow layout allows the site to be 'stretchable'. Therefore, if the user has a larger monitor and wants to see more items, the ASPxDataView in flow layout will expand and fill the page area.

The flow feature also frees you from having to choose 2, 3, or however many columns may fit into your target client browsers. For example, power users always want more data displayed but you still have to accommodate the small monitors, too. Flow layout helps with that.

Check out these screenshots of the sample photo gallery website. At different resolutions, the images in the ASPxDataView auto expand to fill the browser area:

800 x 600 (Small Laptop, Netbook):

 VicSS1

1024 x 768 (Standard Size / 48% of Internet Users):

 VicSS2

1275 x 794 (Large Monitor / Power User):

VicSS3

You'll get the new ASPxDataView's flow feature as soon as it's released with your DXperience subscription. Not subscribed to DXperience? Here's more info on how to do that.

The flow layout is a slick new feature and looks great on a photo website. What other websites would a flow layout be useful for?

Published Dec 23 2008, 12:30 PM by Mehul Harry (DevExpress)
Bookmark and Share

Comments

 

John Phillips said:

Will this wrok with ASPGRIDVIEW?

December 24, 2008 12:58 PM
 

Lieven Bogaert said:

Nice pictures!

December 25, 2008 5:26 AM
 

heather said:

Hi Mehul,

Cool new feature.  It would be great to support web user controls in a similar manner.  Shopping cart sites, inventory control, catalog site would all benefit greatly from the feature.

Imagine a web user control with a photo, pricing info, etc able to be managed in a flow layout.

December 28, 2008 7:59 AM
 

Mehul Harry (DevExpress) said:

Thanks Lieven,

The fish pictures were taken by one of team leads, Victor, while free diving in the Red Sea.

December 29, 2008 2:06 AM
 

CESAR F. QüEB said:

Useful feature.. but.. please... add support "free-position resize" (not only vertical/horizontal position), like this:

www.adidas.com/.../homepage.asp

Regards

December 29, 2008 4:46 PM
 

Mehul Harry (DevExpress) said:

Heather,

Thanks, since the ASPxDataView supports templates, it's possible to design custom controls with the flow layout.

December 29, 2008 5:42 PM
 

Mehul Harry (DevExpress) said:

Hi Cesar,

That page uses flash though to create that effect. Surprise

December 29, 2008 5:43 PM
 

CESAR F. QüEB said:

Hi Mehul,

Thank you for u'r reply... like you say.. yes!.. the related page uses flash.. but.. my request is some like the effect implemented in the page.. without flash... is this possible.?

December 29, 2008 7:07 PM
 

Mehul Harry (DevExpress) said:

Hi Cesar,

Perhaps with JQuery, check out the AnimateBlock sample near the bottom here: docs.jquery.com/.../animate

You might try that with a mouseover event.

Btw, scritptaculous has a grow/shrink JS animations as well:

github.com/.../effect-grow

December 29, 2008 8:43 PM
 

Mehul Harry (DevExpress) said:

Hi John,

No the ASPxGridView doesn't support flow layout because there are many more features of the ASPxGridView that would be affected. We'd probably have to disable many of them to get flow layout and in that case, you're better off just using the ASPxDataView and it's templates. Wink

January 13, 2009 8:31 PM

About Mehul Harry (DevExpress)

Mehul Harry is an ASP.NET technical evangelist at Developer Express. You can reach him directly at mharry@DevExpress.com. You can also follow him on Twitter: http://twitter.com/mehulharry
More from DevExpress
Live Chat
Have a pre-sales question?
Need assistance with your evaluation?
We are here to help.
Chat is one of the many ways you can contact members of the DevExpress Team. We are available Monday-Friday between 8:30am and 5:00pm Pacific Time.
If you need additional product information, require pre-sales assistance, or want help with your order, write to us at info@devexpress.com or call us at
+1 (818) 844-3383.