On Nov 28 2013 we conducted a webinar on the topic “Adaptive Rendering Mobile Web Apps using ASP.NET MVC”. In this blog post we will provide the resources from the webinar.

ASP.NET MVC has a fantastic feature which allows you to design web pages for traditional web browser or for a mobile browser. In order to support Mobile browsers, all you need to do is to create a page with “.mobile” in the file name i.e. if I have index.cshtml view just create a index.mobile.cshtml and ASP.NET MVC pipeline will serve this page when some body requests index view from a mobile browser.

Kendo UI Mobile is a flagship product from Telerik which is a HTML5 based cross platform adaptive rendering mobile controls. Kendo UI Mobile controls when uses will adapt to the platform they are running on and will give you the look and feel of that platform. So you write your application only once and deploy to platforms like Android, iOS, Windows Phone and Blackberry without any code changes.

Slide Deck:

One of the things I tried with this webinar was – Only Action No Theory. Well what I meant was I didn’t have a slide deck for this webinar. It was completely demo oriented.

Video Recording:

If you had missed attending the the live event or you want to go over it once again don’t worry we record every one of our webinars. So here is the video recording of the  webinar:

Q&A:

As with every webinar, this webinar too had many questions from the attendees. We tried our best to address most of them during the webinar. With the lack of time, we might not have been able to answer every question. So we list them here with the answers.

Q: Is adaptive rendering same as responsive design?
A: No. Responsive design is where you design a web page which reacts to different dimensions of the browser. For e.g. If you create a web page using Twitter’s bootstrap style sheets they have rules which make your page realign to different dimension. Where as adaptive rendering is about rendering controls which look native on the platform they run. For e.g. if you use a button, when the page is seen from a iOS browser, button should look the blue shade button or when it is seen from a Android browser, it should look like a black shade android button etc.

Q: How does kendo recognize the mobile or device in which app is running?
A: Each browser will let you know information about the platform through user agent strings. So we rely on that.

Q: Can we override the native look and feel. Like if we have requirement to show app similar to android in IOS
A: Yes you can. We have a special skin or theme called Flat. If you use this flat theme the UI will be same across platforms. You can customize the Flat theme CSS to have your own color combination.

Q: Can we use Kendo UI without using Asp .net MVC?
A: Yes you can. Kendo UI is a HTML5 powered Client Side UI framework. You can use Kendo UI Web Controls in a plain HTML page also. Kendo UI Mobile controls are used for developing Mobile Applications.

Q: Why there is a need to add Jquery mobile script file separately and why can’t we make it as part of kendo scripts ?
A: Kendo UI depends only on Jquery and nothing else. So its necessary to first add Jquery before referencing Kendo UI scripts.

Q: Is it possible to create iOS/Android apps like messaging, file sharing using KENDO UI?
A: Yes you can.

Q: when you Customize/override the layout by making skin ‘Flat’ , the tabs were in the bottom in Android UI too, so it means Kendo UI will not work if we override or customize it?
A: When we use Flat skin, the UI looks consistent across platforms which includes the tab strip too. The tab strip will be at bottom. But if you want the tab strip to be on top for android or other platforms you can easily customize the flat theme CSS for a particular platform.

Q: I can build Mobile Web using such adaptive layout with Jquery mobile + ASP.net MVC , what are the key features for Kendo Web UI?
A: Kendo UI Mobile controls are adaptive in nature. i.e. you write once and deploy on different platforms, the controls will look like native UI. For more information visit: http://www.kendoui.com/mobile.aspx

Q: Does Kendo UI supports HTML5 features?
A: Yes.

Q: how to convert mobile web app to hybrid app?
A: You can just take the HTML/JS/CSS files, package it and deploy it to respective marketplace.

Q: What all kind of app we can develop using Kendo UI?
A: kendo UI comes with 3 flavors. Kendo UI Web – used to develop HTML5 based web apps/sites, Kendo UI DataViz – used to develop data visualizations for web and mobile and Kendo UI Mobile – used for developing Hybrid Mobile Apps. For more information visit – www.KendoUI.com

T-Shirt Giveaway:

With every webinar we select 2 random attendees to receive a give away from our side. The give away is a .NET Ninja t-shirt from Telerik. So here are the 2 winners from this webinar:

• Sivakumar SS
• Mahesh Darga

For those of you who are feeling sad about not winning the t-shirt, don’t worry. We have a lot of webinars planned ahead. So keep looking out for our next webinar.