This is a migrated thread and some comments may be shown as answers.
Rubber band scrolling problem with part of the day view
6 Answers 57 Views
This is a migrated thread and some comments may be shown as answers.
Chris
Top achievements
Rank 1
Chris asked on 28 Jan 2014, 01:26 AM
If you look at scheduler1.png, you'll see what the scheduler looks like when I'm not scrolling (it's so pretty!). However, when I start scrolling on the top or the bottom of the control, the times are offset from the content, as shown in scheduler2.png. Below is my angular initialization code. Thanks!

BTW, we're using this inside the new AppStudio (previous Icenium) and *loving* it. Keep up the good work!


<div id="scheduler" kendo-scheduler k-options="schedulerOptions"></div>

​$scope.schedulerOptions = {
startTime: new Date(kendo.toString($scope.today, 'd') + " 8:00 AM"),
endTime: new Date(kendo.toString($scope.today, 'd') + " 6:00 PM"),
views: ["day"],
editable: false,
dateHeaderTemplate: "",
footer: false,
height: 747,
majorTimeHeaderTemplate: kendo.template("<div class='schedule-tick'>#=kendo.toString(date, 'h')#<span>#=kendo.toString(date, 'tt')#</span></div>"),
minorTickCount: 4,
eventTemplate: $("#schedule-event-template").html(),
dataSource: $scope.appointmentDataSource,
  navigate: function (e) {
$scope.today = e.date;
var todaysDate = new Date();
if ($scope.today.setHours(0, 0, 0, 0) === todaysDate.setHours(0, 0, 0, 0)) {
$scope.isToday = true;
} else {
$scope.isToday = false;
}
$scope.$digest();
}
};

6 Answers, 1 is accepted

Sort by
0
Alexander Valchev
Telerik team
answered on 30 Jan 2014, 08:31 AM
Hi Chris,

I was not able to reproduce the same problem on this demo page. Please compare your current implementation with the one demonstrated in the example and try to upgrade the Kendo UI version in case you are using an outdated one. In case this does not help I would like to ask you to isolate the issue in a jsBin page which I can run and test locally. In addition please specify the device(s) and OS version that you are testing with. In this way I will be able to examine your case in details and assist you further.

Regards,
Alexander Valchev
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Chris
Top achievements
Rank 1
answered on 01 Feb 2014, 06:01 PM
Thanks, Alex. I was able to repro my exact problem on that demo page. All I had to do was scroll the agenda with my finger (on a touch-enabled screen) and for a second before the app registers my touch as the intension to add a new appointment, it scrolls the right-hand-side of the agenda w/o scrolling the left-hand-side of the agenda. See the attached bugrepro.png to see the problem.
0
Alexander Valchev
Telerik team
answered on 05 Feb 2014, 08:40 AM
Hello Chris,

Thank you for the detailed instructions. I was able to reproduce the behaviour. Actually this is expected and is caused by the way mobile kinetic scrolling works.
The effect occurs because the right-hand-side and the left-hand-side of the agenda are located in different containers.

Regards,
Alexander Valchev
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Chris
Top achievements
Rank 1
answered on 05 Feb 2014, 10:00 AM
Maybe you expect it, but I think it looks terrible. Also, it works that way whether it's in "mobile" mode or not.
0
Alexander Valchev
Telerik team
answered on 06 Feb 2014, 09:12 AM
Hi Chris,

We can suggest a workaround which will allow you to avoid the behavior. Please check this example.

The following code is used to disable the elastic scrolling effect:
dataBound: function() {
    var scroller = this.view()._touchScroller;
 
    if(scroller) {
        scroller.yinertia.elastic = false;
        scroller.pane.y.resistance = 0;
    }
}


Regards,
Alexander Valchev
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Chris
Top achievements
Rank 1
answered on 06 Feb 2014, 01:05 PM
Excellent, Alex. That did the trick!
Asked by
Chris
Top achievements
Rank 1
Answers by
Alexander Valchev
Telerik team
Chris
Top achievements
Rank 1
Share this question
or