integrate existing mobile HTML design with sencha touch

Question

my designers have created the HTML 5 UI for mobile app , its a pure HTML 5 design but now i want to make it functional and need to use Sencha Touch.

As sencha touch has its own layouts, views and has the facility to bind events for buttons and other components. Now i dont know how can i integrate it with the my existing mobile UI design.

sencha touch has views and which is generated runtime but what about the views or designs that we already have. can someone guide me how can i integrate my existing design with sencha touch

Answer 1

When using Sencha Touch that is unfortunately the wrong approach. Sencha Touch's power lies in its ready-made components that already come with their syntax and classes. It is best to take these as your foundation and change them to your needs instead of trying it the other way around.

Have a look at this guide about theming Sencha Touch apps.

It is possible to create you own components from the ground up but a whole lot more work especially when you basically want to use functionality their build-in components already offer.

Depending on the designs you've got I'd use them as a reference. Build the app with the build-in components and style those accordingly.

In the future: Let the designers learn about the build-in components. The Sencha Touch Kitchen Sink is a good reference. If you want to work in parallel let them create a theme on top of that, one you can apply to your prototype once it's finished.