This is a migrated thread and some comments may be shown as answers.

Scrollview multiple pages shown at once?

8 Answers 311 Views
ScrollView (Mobile)
This is a migrated thread and some comments may be shown as answers.
chris
Top achievements
Rank 1
chris asked on 06 Feb 2013, 06:38 PM
Is it possible to have multiple pages shown at once?  Say i want to display 3 at once, and behave like this:

1,2,3

scrolled

2,3,4

scrolled

3,4,5

Is something like this possible?

8 Answers, 1 is accepted

Sort by
0
Petyo
Telerik team
answered on 08 Feb 2013, 09:03 AM
Hello Chris,

If you do not use data-role=page attribute on the page elements, their contents will not stretch to fit the widget width, and several items will be visible at once. However, currently scrolling always scrolls to the full widget length. 

I think that we can implement such feature for the next release - scroll percentage configuration option (by default, 100). If you set it to 50, swiping will scroll the widget to 50% of the width, thus displaying some amount of the previous page too.

Would such option work for your case?

Thank you in advance,

Petyo
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Lee
Top achievements
Rank 2
Bronze
Bronze
Bronze
answered on 11 Oct 2019, 06:12 PM
I too would like this feature added. I would like it to show slides 1, 2, and 3. When I click the right arrow I want it to advance by 1 to show slides 2, 3, and 4. When I click the left arrow it should go back to 1, 2, and 3. When there are no more slides to the left or right the arrow should disappear. 
0
Viktor Tachev
Telerik team
answered on 15 Oct 2019, 10:18 AM

Hi,

 

The functionality is available in the new ScrollView widget. Check out the example below that shows how it works :

https://demos.telerik.com/kendo-ui/scrollview/databinding

 

Regards,
Viktor Tachev
Progress Telerik

Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
0
Lee
Top achievements
Rank 2
Bronze
Bronze
Bronze
answered on 15 Oct 2019, 10:50 AM
Unfortunately this advances the view by 3 every time. I want to advance by 1 while showing 3 slides at a time. 
0
Viktor Tachev
Telerik team
answered on 17 Oct 2019, 10:07 AM

Hello Lee,

 

I am afraid that such functionality is not available out of the box. By default the ScrollView template will get the items for a given page. Thus, if pageSize is set to 3 each time the page is changed the next 3 items will be passed to the template.

 

Regards,
Viktor Tachev
Progress Telerik

Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
0
Lee
Top achievements
Rank 2
Bronze
Bronze
Bronze
answered on 17 Oct 2019, 11:35 AM
The Original poster requested this back in 2013. I feel like this should be available by now.
0
Viktor Tachev
Telerik team
answered on 21 Oct 2019, 08:36 AM

Hello Lee,

 

Currently it is possible to make the last item partially visible - that will suggest to the users that there are more items available. Check out the example below that illustrates the approach:

https://dojo.telerik.com/amOLakoW

 

As for showing multiple items and advancing with only one item. If you would like to request this functionality to be available out of the box I would suggest submitting a feature request in our feedback portal. 

https://feedback.telerik.com/kendo-jquery-ui

 

Regards,
Viktor Tachev
Progress Telerik

Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
0
Lee
Top achievements
Rank 2
Bronze
Bronze
Bronze
answered on 03 Dec 2019, 07:44 PM
I solved this using the slick slider library since kendo does not have this feature yet.
Tags
ScrollView (Mobile)
Asked by
chris
Top achievements
Rank 1
Answers by
Petyo
Telerik team
Lee
Top achievements
Rank 2
Bronze
Bronze
Bronze
Viktor Tachev
Telerik team
Share this question
or