1. #1
    Sencha User
    Join Date
    Jun 2009
    Posts
    352
    Vote Rating
    1
    parky128 is on a distinguished road

      0  

    Default Component based Dataview and wrapping of items

    Component based Dataview and wrapping of items


    I am playing around with a component based Dataview that uses buttons for the component type.

    What I would like to achieve is to have the buttons flow left to right across the screen and to wrap onto new rows no matter how many records are in the store.

    So for example, I have 5 records, and I set the width of DataItem to 50%. I would like for the Dataview to display 2 buttons, followed by 2 buttons below on a second row and then the 5th button on a final third row.

    I would imagine I need to do this via CSS, but am unsure how best to proceed.

    Can anyone help please?

    Thanks

  2. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    St. Louis, MO
    Posts
    33,656
    Vote Rating
    435
    mitchellsimoens has much to be proud of mitchellsimoens has much to be proud of mitchellsimoens has much to be proud of mitchellsimoens has much to be proud of mitchellsimoens has much to be proud of mitchellsimoens has much to be proud of mitchellsimoens has much to be proud of mitchellsimoens has much to be proud of mitchellsimoens has much to be proud of

      0  

    Default


    display: inline-block and some width on the components may do the trick.
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    http://www.JSONPLint.com - Source to lint your JSONP!

    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is almost in print!

    When posting code, please use BBCode's CODE tags.

  3. #3
    Sencha User
    Join Date
    Aug 2011
    Location
    London
    Posts
    327
    Vote Rating
    10
    digeridoopoo will become famous soon enough

      0  

    Default Have a look here

    Have a look here


    Take a look at the CSS in the example here:

    http://rdougan.github.com/barebones-tiled-dataview/

    You could just make the padding a bit bigger and it should do what you want

    :-)