Saving HTML5 Game State in WebView – Xamarin Android

We  were loading a HTML5 game into an Android webview (Webview renderer in Forms App to be specific – doesn’t matter though) in a Xamarin Forms application and we wanted to save the state of the game in our application.

That is, if the user was at level 5, exited the game or navigated to another page and came back, game shouldn’t start from beginning but from the same level or may be even the same points (as long as backend supports that).

Of course, it was difficult to get a direct sample on Xamarin to fix this issue but 2 sources helped us. We combined both to fix the issue.

  • Source 1 : How do we use Local Storage and cookies to save HTML5 games? – Link
  • Source 2: Using Android webview and storage – Link

 

Websites typically uses Local Storage to get this information stored and then share it with server when it loads (and not cookies).  Our reference was HTML5 Games Site – http://html5games.com/Game/Zombie-Massacre/3223c9b3-f528-4604-86a1-ed0daca4c285 ). We used Chrome developer tools to see its local storage and information stored for levels while playing to understand the process. Well, we are all newbies in certain areas, of course. We realized that LocalStorage was leveraged and were able to manipulate levels from the developer tools view or SQLite browser (Local Storage file inside windows Locals).

gamestatejpeg

 

We were able to save HTML5 games in Xamarin Forms Android WebView using local Storage. But, we haven’t implemented it yet on other platforms like iOS. My guess is that the steps should remain pretty much the same regardless of the platform. Given here is an Android sample.

Overall code is actually pretty less to make this working – the minimal code to save the level and points to local storage.

Control in the code below is your Android WebView control.

WebSettings settings = Control.Settings;
settings.DomStorageEnabled = true;
settings.DatabaseEnabled = true;
settings.JavaScriptEnabled = true;

string databasePath = this.Context.GetDir("database", FileCreationMode.Private).Path;
settings.DatabasePath = databasePath;

 

I would surely love to hear from you, if you have managed to achieve this in some other way, a better way.

 

~Trilok R~

Advertisement

XHackers Meetup | Xamarin Evolve 2014 Recap

Saturday the 8th of November, 2014.

Hamilton Hall in Microsoft Signature building was half occupied by the time Kirti and I walked in to the room. Nish was already there and setting things up. We understand Bangalore, rains, traffic and the general laziness in the general scheme of things. We quickly started off with a round of introduction. By then the rest of the folks came in including the late XHackers core team 😉

With the introduction behind us we realised that we had people from varying levels of Xamarin understanding.

  • Amateurs & Rookies : Professionals from mobile and desktop application & students
  • Semi-pro : Mainly professional who have tried out Xamarin and are aware of the basic building blocks
  • Pro – Developers from industry who had already mastered Xamarin were here only for the recent announcements and demos.

IMG_1222IMG_1150

Therefore, we attempted to have content to the likes of each group in the audience. Nish started off with the basics and a proverbial hello world of Xamarin to get the audience to the same level and let them know what all the excitement was all about.

Next act was mine.

I gave them an insight into the story behind XHackers, the journey so far. We breezed through all the the meetups so far and its agenda right from our first one @HSR Layout, Bangalore. Detailed them about the expanding chapters of XHackers. Last but not the least introduced the current core members of XHackers. You can find the presentation here. One person stopped me to detail about XHackers name and logo’s design philosophy. I would like to take this opportunity to thank a friend of XHackers – Reeko Johny for this amazing support to create this exciting and fresh logo. It has design philosophy from three major ecosystems Apple, Google and Microsoft in fonts, colours and overall design. X stands for both cross-platform and Xamarin. Hackers are those bunch of people who go one step beyond their normal routine coding tasks to explore the new realms of software development! Find the presentation here.

With that Nish continued with his presentation on Xamarin and announcements.

IMG_1174

He spoke about Xamarin capabilities and code share ability. He spoke about Xamarin Forms, Xamarin Android Player, Sketches, Profiler, Insights, following it up with demonstration of these new features. He also spoke about the partnerships and components availability that Nat spoke about during Evolve. You can find the presentation here.

IMG_1256

Vidyasagar upped the ante with an exciting sneak peek into gaming with CocosSharp. He showed us folks how easy is to do start doing some basic game programming and answered to the cheeky questions from audience. His perspective and blog on the same could be found here.

IMG_1285        Lohith followed that up with a session on Telerik and their amazing Xamarin Forms controls for new wave of cross-platform applications. He showed some interesting demonstrations of the many controls that they have custom-made for Xamarin Forms. This session was especially handy for the folks from enterprise who were there for this session. They had specific questions on how it could be leveraged for their existing applications and Lohith answered to them happily. More information can be found here.

Chaitra coming fresh from her TechEd talk on connected devices, continued with the same passion to talk about the future of connected devices and how Xamarin would help us write for the world of connected devices with applications for multiple devices at the same, including the amazing Android based Moto 360. Nish was wearing that watch with the service running in fact. 🙂 She also spoke about code shareability and other details based on her enterprise experience working with advanced enterprise Xamarin applications and application scenarios.

IMG_1337

Anubhav and I closed the session with some Q & A and goodie fest. T-Shirts and monkeys were given to the avid tweeter in the audience (Prabhu Jackson) and a few other folks with insightful questions. We shared the documentation about Xamarin and ways to order Xamarin T-Shirts.

On closure, we also launched a CONTEST. The best blog about the event will stand a chance to win a Xamarin Forms book!!! Write a blog, publicise and let us know about it. Come back for the next event and if we find that yours is the best, the book is yours for keeps.

If there is one thing we all agreed at the end of the session, it is simple. It is an exciting time to be working with Xamarin and making applications. So enjoy the ride!

I sincerely, hope this blog inspires you folks to write about the event and win the amazing gift.

Special thanks to Core members:

IMG_1240IMG_1220IMG_1290

Nish, Prasant, Mayur, Anubhav, Kirti, Chaitra, Pooran, Murugan, Vic, Lohith, Vidyasagar for making this event successful.

and of course, our friends @Microsoft.

Signing off for now..

~Trilok~

Upcoming Event Alert: Xamarin Evolve 2014 Updates Meetup

"Evolve"d Monkey
“Evolve”d Monkey

Folks,

Hope you all have been feverishly coding using Xamarin. We love Xamarin for the freedom and flexibility of using C# to develop our applications on both iOS and Android in addition to Microsoft platform. To say the least, the journey so far has been exciting. we developed in each platform separately sharing same core and writing native UI. Then we used various plugins to explore MVVM patterns like MVVMCross on top of Xamarin. Then came Xamarin Forms of course which made life all the more easy and straight forward.

It gets all the more interesting and fast paced here on especially with the latest announcements made at Xamarin Evolve 2014.

Wait?  What – You missed it?!!?

OK. Chill…

Don’t worry! This weekend, on Saturday, the 8th of November, 2014 we are doing a recap and a hands on introduction to the new features announced at Evolve this year. To give you a heads up, Evolve announced many new things.

Of course, Xamarin IDE updates, Xamarin running on smart watches, Xamarin on latest iOS, Profilers and sketches, Xamarin Android player, Xamarin Test Cloud, Xamarin Insights, Xamarin.Robotics in Beta and what not.

Too much information? Interesting?

Wait till you see them in action 🙂

This Saturday, hear about all these exciting features from Xamarin Evangelists and Xamarin Enthusiasts – XHackers at Microsoft campus.

Click here to show your interest and register for this meetup. Of course, limited goodies are there for in event participation and contests 😉

See you there.

Trilok…

Xamarin HackNight

Hackathon = Hack + Marathon – Really?!!?

 When I was invited to be a part of Xamarin Hackathon I was a bit skeptical, for one I had never been a part of such an event ever before, secondly, non stop coding and churning out a meaningful system at the end of the second day felt like a seemingly impossible task. Nevertheless, I accepted the challenge and turned up for Xamarin HackNight.

 2 – Aug – 2014 – Day 1

I was a bit late as usual. Folks were already there and were discussing something as I made my way to an empty chair. By folks, I meant Nish, Vic, Pooran and Anubhav. Surprisingly, we did not have an idea what we were going to make till then. Empty minds! May be that was a good thing.

I thought we would be discussing about the application but they were taking food orders, showing off the gadgets each had and the hacking they had done so far. I was searching whether I had any gadget to show off. I found a wedge mouse in my bag. That’s all I had. I was already thinking whether it was a bad idea to join these geeks. I was corrected in 10-15 minutes as we got back on track and started brainstorming on application ideas. It was quickly decided based on some of our previous discussions that it was going to be a Birthday Reminder application based on Xamarin forms for the event. I was able to contribute in small nevertheless meaningful way to the session. Phew!

Quickly, Pooran drew the screens on a white board and we started brainstorming on the integral parts or components of the application. He also shared an online version of OneNote where the tasks were immediately marked, assigned and shared with all of us. A MacBook pro was connected to WiFi and we ran Xamarin build host out there to test our iOS screens. (Steps to troubleshoot connection)

Application: Birthday Reminder

  1. Xamarin Forms for UI development – WP, iPhone, Android
  2. Xamarin Auth for Login
  3. Xamarin Social for picking data from Facebook and other APIs
  4. A backend to store these data and for notifications – Hangfire and AWS!
  5. MVVM to tie all these elements into a robust architecture.

Once the planning was done, we picked up one component each and started looking into it. Initial formal tones by now had changed to fun as we started discussing and working on our assigned areas, each helping out the other as the application slowly came to life.

Meanwhile, Kirti joined us late in to the evening though he had just recovered from a fever.  His motivation level was commendable. If I were him, I might have taken the easy way out and confined myself at home. He instead decided to join us and code! And we rewarded him by assigning Xamarin Forms and UI work!

  • What did we discuss? Everything under the sun. Some wavelengths matched others were over head transmissions. Disconnected discourses many.
  • What did we not discuss? Very few things escaped our chatter boxes.
  • What did we code? Many things. (Detailed blog on this later)

Pooran, Vic and Nish brought in their combined experience and knowledge in different areas to guide us and push the application work forward. Anubhav and Kirti brought in the enthusiasm and mobile application development experience to keep the night young and alive. Vic ensured that the fun never stopped with his inimitable attitude and comments. Nish played the resourceful host literally with both his Xamarin knowledge and event hosting.

 

3 – Aug – 2014 – Day 2

As the night dawned into day 2, backend was shaping up well. I could see Vic and Pooran feverishingly working on Hangfire and Services. Auth and Social component looked in place. Xamarin forms was proving a bit tricky as we learnt it and coded. Overall application architecture was in place. Integration was pending. And to be frank it is still a work in progress! We checked in stuff to GitHub by noon for a sumptuous lunch at a nearby restaurant. Post lunch we made plans on pending work and discussed other informative nuggets about Xamarin. What was supposed to be a small session and a quick winding up discussion extended to a 2 hour discussion!

For me, it was an amazing learning experience – Xamarin Forms mainly. What was the take away – new people, interesting interactions, fresh ideas, brilliant brainstorming, stimulating discussions and what not. I realized what you take away from such a gathering is not only technology but also an unique experience!

I am definitely looking forward to the next one.

What other hackers say:

“Hackathons for me are places where we learn something new every time. I learnt about hangfire”  – Pooran

“Amazing experience with Xamarin.Forms and how simple it is to get started with…Also, worked with Xamarin.Auth and it was amazing how it took care of Facebook Auth in all the platforms…”  – Anubhav

 “The Hacknight Day 1, I just recovered from fever and ran to join my Xhackers Gang. I had a quick Design Discussion and I started working on Xamarin Forms.”  (XForms).

During the discussion I got learnings on XForms, Xamarin Forms & Shared Project. It was very useful if we are building one project where all the XForms elements are shared within all three platforms(iOS, Android, Windows Phone). Also using the Compiler Directives we can write platform specific functionality inside the forms. The experience was awesome. Thanks to Nish for clearing all my doubts.

Around 3AM we had huge discussion on Architecture, Facebook Authentication, Models, View Models and UI. During this time I learned new thing HangFire (http://hangfire.io/) from Vic. I will dig more about HangFire.

 Overall my experience in this HackNight was absolutely awesome.  “ – Kirti

 

 P.S. This post covers the overall experiences of the first Xamarin HackNight in Bangalore. Application information, technical deep dive, details about the individual components and integration will be covered in the next blog post.

 

Few of the pictures below are Vic Parmer’s clicks 🙂

 

600_395389382 600_395389502 highres_395388522 600_395391012

10590029_10152605720679321_2056690945_n 10592118_10152605722379321_2034673902_n

Xamarin & XHackers

002_small_160

XHackers => Xamarin Fanatics – Guess what we code in C# for iOS and Android too!!!

this.btnClickMe.TouchUpInside += (sender, e) =>
this.lblText.Text = "Hello world to XHackers";
};

Story so far

There were these bunch of people in Bangalore who loved Xamarin, C#, .Net and wanted to show the world how awesome it is to develop applications using Xamarin and C# on Visual Studio! The common thread that brought us together was Xamarin Evangelist Nish (@NishAnil). He orchestrated our first Bangalore Meetup of Xamarin enthusiasts.

On Feb 1st 2014, 8 of us met in the laid back HSR Layout’s CCD. 8 of us were from different backgrounds, developers to architects to consultants to entrepreneurs. We spent some exciting time talking mobile, technology, codes and networking. Before our coffees were over, we saw a common theme emerge. We realized that we should now spread our enthusiasm for Xamarin and share our knowledge to developers in Bangalore. We decided to create our next meetup where we introduce Xamarin to a newbies. XHackers formally began then.

Within a week, we updated our Meetup group, created a Facebook group and a website for us. I have to admit website is still under construction (We got our day jobs as an excuse!). We finalized a Hello World day to introduce Xamarin.

Meanwhile, I had a chat with my UX designer friend Reeko. We brainstormed for two days and came out with the logo displayed here. Back story on this on a later post. 🙂

March 1st 2014 we had our proverbial Hello World session at Microsoft EGL Campus. Initial low attendance improved with Bangalore’s lazy weather getting better as day progressed and we had a pretty decent turnout by the time we started 😉

We had a mixed audience here too. From college students to entrepreneurs we had people from different interest groups who attended this event. We covered Xamarin platform introduction, its possibilities and Hello world on each of the trending platforms – Windows phone, Android and iOS.

Murugan started with Xamarin Introduction, followed by Chaitra’s informative session on Android.  Anubhav and Kirti gave an introduction to Portable Class libraries (PCLs) using Windows phone and Store application. Trilok [“I, me myself”] wrapped the session up with a Hello World on iOS (You could find iOS code from session here). Prashant (@prshntvc), who is with Xamarin came down all the way from Mysore to support us. First meetup’s agenda was to give the audience an overall feel about Xamarin and kick-start their Xamarin coding with C#. We believe we were able to meet that expectation based on the generous feedback we received.

Road Ahead

We are planning to follow-up March session with 3 more hands on labs where PCL and real cross-platform development will be discussed and coded. Dates and details are already up on our FB page.

We are all ears for your needs or ideas about what do you folks want to learn or do in these forums / workshops, may be even a Hackathon event! The more XHackers network grows the more inputs we as a group gather on Xamarin and its wide possibilities.

Local XHacker chapters, kick-start events, your Xamarin success stories are things high on our agenda. If you want to let us know on these you could always post on Meetup or mail in to xhackers dot co  and let us know your thoughts.

Hope to meet you soon in the next XHackers Meetup,

LogRCubed…