3. List Scrolling Problem

Notice: The Monaca & Onsen UI Community Forum is shutting down.

For Onsen UI bug reports, feature requests and questions, please use the Onsen UI GitHub issues page. For help with Monaca, please contact Monaca Support Team.

Thank you to all our community for your contributions to the forum. We look forward to hearing from you in the new communication channels.

List Scrolling Problem

  • D

    Hi,
    I’m new to Onsen and I’ve got a problem with lists which are longer than the screen. When I want to scroll to the end of the list it sometimes doesn’t react at all and sometimes it works (but with an offset so “1cm” of finger movement doesn’t correspond to “1cm” of the list). To me it seems like it doesn’t detect the touch event right but this is just a guess.
    Here is my code that I use for the list (Onsen2).

            <ons-page>
            <ons-toolbar>
                <div class="left">
                    <ons-toolbar-button onclick="fn.open()">
                        <ons-icon icon="md-menu"></ons-icon>
                    </ons-toolbar-button>
                </div>
                <div class="center">
                    Settings
                </div>
            </ons-toolbar>

            <ons-list>
                <ons-list-item>
                    <div class="list__item__left">
                        <ons-icon icon="md-face" class="list__item__icon"></ons-icon>
                    </div>
                    <div class="list__item__center">
                        <ons-input id="username" modifier="underbar" placeholder="Your name" float></ons-input>
                    </div>
                    <div class="list__item__right"></div>
                </ons-list-item>
                ...
                [multiple copies of the last list item]
                ...
            </ons-list>

    Best regards,
    Daniel

    0

  • I have not noticed this behavior. What kind of device and OS version are you running?

    If you are deploying for Android using Crosswalk may be a good option to increase performance.

    0
  • D

    I tracked the problem down to the debug tools I’m using.
    This happens when the Chrome Developer Tools are open and connected to the app. For convenience I use GapDebug but I just tried it within chrome and the same bug occurs.
    When I disconnect from the Dev Tools the list works perfect!

    In the Dev Tools Console I also get a link to https://bugs.chromium.org/p/chromium/issues/detail?id=574343

    I was testing the app on a real Samsung Galaxy S5 device.

    Any ideas?

    0

  • @daniel7558 I think that warning is because of the FastClick library that is included in Onsen UI. I don’t think it will cause any performance issues.

    0