For example, to get the DOM element of a component, in Ext JS we use the “getEl” method, and in Sencha Touch we use the “element” property. The drawback is that the shared code is harder to maintain and requires extra documentation and test coverage. The big advantage of this code sharing, is of course is that we avoided duplicating lots of code. The underlying grid is about 5000 lines, and we only had to write 2000 lines of Sencha Touch specific code (mainly UI code handling the touch interaction). For our 1.0 version, we managed to reuse about 7000 lines of code between the Ext JS and Sencha Touch versions. This turned out to be quite doable after a few rounds of refactoring which also helped us clean up our code base. Our goal was to be able to reuse as much of the scheduling logic and Model/Store code from the Ext JS version as possible. This gave us a good foundation as we continued to implement the scheduling specific code portions. We started by developing a custom Sencha Touch grid (codename “UberGrid”, to be released soon) with buffering support as well as support for any number of scrollable ‘locked’ sections. A grid component targeted at mobile and tablet devices must also support buffered rendering to keep the DOM footprint as small as possible. The grid needs to support at least locked columns, sorting and variable row height. Below is a screenshot of one of the examples.įirst of all, to build a grid-based scheduling component, you need some type of grid component to use as the base. Since the component is fully built on Sencha Touch, it is very easy to combine with other UI components in the framework such as forms or lists. You can even interact with the underlying schedule area to change row height or zoom level easily. In the schedule, you can tap and drag task bars and also pinch to resize them. The Touch Scheduler is a mobile planning component offering rich interactivity for anyone looking to schedule their resources, tasks or appointments. Building a cross framework application with Sencha Touch and Ext JS.View Examples, Videos, Webinars, Datasheets and Whitepapers LEARN MORE > Professionally maintained Web Framework for Java developers LEARN MORE > The low-code editor that accelerates building robust Sencha Ext JS enterprise applications with simple drag and drop LEARN MORE > High-Performance Enterprise-grade JavaScript?ramework with 140+ professionally maintained components LEARN MORE >
0 kommentar(er)
