SharePoint Mobile App Development with Xmarin

Editor's Notes

• #3: Intro I am Hector Luciano jr, a consultant manager at BlumShapiro.(Continue with self intro) Xamarin lets you build iOS, Android and Mac apps in C#, rather than Object-C or Java. Using familiar tools you can take advantage of your favorite things about C#. Linq support Event handling, delegates and event Asyc support. For develping for new mobile and desktop platforms. Today I will get you started with building Mobile Apps against SharePoint on premesis or SharePoint Online in Visual Studio 2013 using C#. To accomplish this goal we will be using a PCL library called XSPService, build by me. The XSPService PCL is a component build to work across platforms that provides a turn key solution for access SharePoint for mobile apps. With XSPService Component it is fast and easy to connect to SharePoint access libraries, download, upload documents, access feeds and get push notifications. First we are going to start with a single view applications, in this presentation we will be just covering Xamarin for iOS, however you can use it for building Android apps.
• #4: Welcome This is my first presentation, in this group and ever, so give me some love… and I promise I already pray to the demo gods and go my fingers cross. I am Hector Luciano Jr, Consulting Manager in BlumShapiro located right in Conneticut as well as our Boston office in Quincy and others. Quick Info on BlumShapiro: {INSERT BLUMSHAPRIO} About me, I am really a developer at heart, I been developing for over 13 years now, I am MSCD certify and working on my MSCE certification. I see my career goal as SharePoint and Mobile specifically native Apps. I have been building Apps for over 3 years specifically on iOS Iphone using Object-C as the main programing language. Now I will not be talking about OJbect-C so no worries. I am currently learning Swift just because it is good to know the main iOS programing languge Building Apps was more of a hobby/second job, I worked on a Metal Health App called MyOmBody which is now 4 apps all running my original code, currently I am working on a new App for Smart Home devices using the new iOS Home framework. That app is build on Swift so I wont be demoning to day but if you want to see it I will share later after the presentation. Now the main reason why I pick Boston SharePoint User group is because SharePoint development is my main Job and I actually enjoy working on SharePoint……., well when I am not pulling my hear out. Last year I finally decided to combine the two and that’s what I am here to day. I am going to share with you apps that I have build against SharePoint and show you how to get started. Now after today you are going to leave with a few sample apps that can get you started and hopefully you can see the business value out of them. (OPTIONAL) Today I will be talking all about building SharePoint Mobile Apps using tools you know and love for the last decade. Basically this presentation is for the normal SharePoint developer whom works right on Visual Studio is familiar with Asp.Net C#. (PERSONAL COMMENTS)(OPTINAL) First the old generation doesn't care for this mobile trends they done there time and if is not broken don't fix it. However the are joining Facebook and inviting me to play word with friends.  WTF. --the hash tag generation:  this generation communicates and share information much faster, via app notification twitter, Snapchat, LinkedIn, and others.  They don't use email it a resembles to letters on the mail. Just simple noise and junk mail.  {Insert Notification pic}--The D generation: Email, Excel, Word, SMS txt, and blogs was the communication and the demanded it. This generation has there IPhone wake them up to go exercise and the while eating breakfast they are reading the news on there IPad. But when is time to get work done they open a laptop!!!! This is a fact of life.--The F generation: my prediction is going to be all about touch and voice over commands. And If I can not touch it I don't want it.  If you don't make me happy I simply don't come back and I find alternative. They are not going to used email because that not how they engage with there friends they will use Social media, voice messages, Pinksters, that how we love today.Is all about simple and specific apps that allow us to get together. {insert bank of future} check out bank ofCatastrophic rescue team used mobile and SharePoint to deliver relief.  Mobile and Social are growing with the maturing of mobile technology and tooling. It no longer take a genius to build a mobile app and I will show you
• #6: This is how we help, unlock your potential
• #8: Xamarin Studio Xamarin Studio provides ability to build mobile apps using C# as the main programing language. It can build apps for iOS, Android, Kendle Fire and more. Apps are built with standard, native user interface controls. Apps not only look the way the end user expects, they behave that way too. Xamarin Studio provides integration with Visual Studio and a IDE for Mac and Windows IDE for Android development. Familiar language and namespace base on .Net framework which we all have come to love. Xamarin Company also provides on cloud testing for almost all Android devices and are working on iOS on cloud testing as well. Build-in iOS designer fully integrated with Visual Studio. This means that you don’t need to pen Xcode to build iOS user interfaces. Appcelerator Titanium Appcelerator Titanium offers you two complementary pieces of the puzzle. Titanium is a JavaScript development tool filled with widgets you can string together to build apps that run natively. It provides the code that allows your app to run in iOS, Android, Windows, BlackBerry, and HTML5. That's a big collection from one basic piece of code. The company also offers a set of cloud applications that handle the back-end work for your app. Whether it's storing information or sending email, the Appcelerator cloud handles it. There are also specialized tables for geographic information, photographs, and what the social media world calls "friends." The cross-platform Corona SDK has all the usual features for creating an app that runs on iOS, Android, Kindle Fire, and Nook, along with one indispensable addition: a physics engine. Corona apps can take objects and simulate them bouncing around a real world. Writing your own Angry Birds-like game is much easier. The company also offers a cloud for storing information from your game. Access is simple from the app code. You'll find the usual repositories for bits as well as custom formats for game builders. Your code can create leaderboards, track achievements, offer chat sessions, and integrate with social networks, all through the Corona cloud. PhoneGap, which won great acclaim at Web 2.0 Expo San Francisco’s 2009 Launch Pad event, is an FOSS environment that allows developers to create apps for Android, Palm, Symbian, BlackBerry, iPhone, iTouch and iPad devices. This platform uses standard web development languages such as HTML and JavaScript.Phone Gap PhoneGap allows the developer to work with device hardware features such as accelerometer, GPS/location, camera, sound and much more.PhoneGap additionally offers an Adobe AIR app and also online training courses to help the developer access native API’s and build mobile apps on its own platform. RhoMobile offers Rhodes, which is an open-source framework based on Ruby. This permits the developer to create native apps, spanning over a stunning range of OS’ and smartphones. The OS’ include Android, Windows Mobile, Symbian, iPhone and RIM, which pretty much covers it all.The framework supplied by RhoMobile is such that you only need to code once. This code can be used to build apps for most of the major smartphones. Native apps are great for working with available hardware, so your job gets done with ease, speed and accuracy. RhoMobile RhoMobile also offers developers RhoHub, which is a hosted development environment, and RhoSync, which can be employed as a standalone server to keep all the app data current on the users’ handhelds.
• #12: When you think of Xamarin you need to think of it as multiple products one of those product is the Xamarin Platform. This is where you be creating your iOS, Android, Mac applications, Windows app all in Visual Studio, with everything you love about .Net. So what are Native Mobile Apps, native apps, native user interface, using the each platform native UI look and feel. -- Each device has a unique API which need to be available. -- Also each application needs perform. How are you going to Architect your Apps, one approach you are buliding each app on each Applications. Build multiple source code, different platform language, and managing the project deficult, insead you want right onces and use everywhere. Some Approach is to use what is called Lowest Common Denomiator of running using Black Box approach like Javascript Framework, basically you have to write using there approach. Xamaring approach is building against the .Net framework using all the api which we love and are comfortalbe with. Sharing code using a C# backend across Android, iOS and Windows. Everything is in C#, eventhough you have different Xamarin IDE for Androin and iOS. When you think of what a SharePoint C# developer already knows, you know the .Net framework System.Net, System, System.IO , System.Linq, System.XML. Would it be great if you just build you agains
• #13: Intro I am Hector Luciano jr, a consultant manager at BlumShapiro.(Continue with self intro) Xamarin lets you build iOS, Android and Mac apps in C#, rather than Object-C or Java. Using familiar tools you can take advantage of your favorite things about C#. Linq support Event handling, delegates and event Asyc support. For develping for new mobile and desktop platforms. Today I will get you started with building Mobile Apps against SharePoint on premesis or SharePoint Online in Visual Studio 2013 using C#. To accomplish this goal we will be using a PCL library called XSPService, build by me. The XSPService PCL is a component build to work across platforms that provides a turn key solution for access SharePoint for mobile apps. With XSPService Component it is fast and easy to connect to SharePoint access libraries, download, upload documents, access feeds and get push notifications. First we are going to start with a single view applications, in this presentation we will be just covering Xamarin for iOS, however you can use it for building Android apps. Demo Steps. Note: If you have never develop with Xamarin it is worth for you to first check out Xamarin.com to learn more about Xamarin as well as to download the tools. Now I have everything setup, before you begin you will need Apple XCode IDE, and Xamarin tools. You can download the XCode IDE from Apple Developer.com and becoming a Apple developer. Next lets open Xamarin Studio in Visual Studio. 1. I am going to create a single view iOS project 1.1 Quick walkthrougg. 1.1.1 The Main.cs file is the main point of the application and it references the AppDelage class that where we can implement life cycle methods for our app. The App properties is where you can see the reference to the MainStoryboard file. This is where you will find all the UI controls, View and more. (navigate to project properties and select (iOS Application tab) talk about this screen. 1.1.1.1 here you can see the Main Interface storybord, you can see Supported Device Orientation and more. 2. Lets edit the StoryBoard File and see how to build a native iOS app. 2.1 In this designer I can easily build application ui, 2.1.1. Notice the following. -You can view the storyboard by device type( click on the left top) -YOu can select the iOS version. -And notice all the controls available for you. -So lets add a few buttons and a label. -Notice that when I drag the button, the IDE is helping me align the controls(super cool) I can also edit the buttons properties which would be usefull, If I already know exactly where I want the button to be. -Name it btnRISPUG -Talk about buttons event. Which event you think I should used? -Notice you can always just double click on the button, similar to what you are usetoo doing. " this.lblhello.Text = "Hello Xamarin from RI SharePoint User Group";" -Now lets add a image view control. http://photos4.meetupstatic.com/photos/event/d/2/9/8/highres_115253912.jpeg static UIImage FromUrl(string uri) { using (var url = new NSUrl(uri)) using (var data = NSData.FromUrl(url)) return UIImage.LoadFromData(data); } -Now lets add a web view(Why because I found it, that I constainly need to setup a webview to navigate to content on some site) -For example navigate to a PDF on SharePoint, Word, Some data entery web entery form etc.. http://www.meetup.com/RISPUG/ partial void UIButton6_TouchUpInside(UIButton sender) { this.uwvMoreInfo.LoadRequest(new NSUrlRequest(new NSUrl("http://www.meetup.com/RISPUG/"))); } -Lets talk about StoryBoard -Add a new storyboard -What is a storyboard is a visual representation of all screens in your application, contains ui elements, controls and navigaiton. -Add a Navigation Controller -Add two buttons red and blue -Show how to add additional view controllers -show how to navigate from one view to another. Show how a modal window workds. partial void UIButton312_TouchUpInside(UIButton sender) { this.DismissModalViewController(true); } --Show how to create a ViewController on the fly. --Add a property for the URL and a web url --Notice that I manually lay them out, and off-course everyone here can already realize what's is going to happen when my App is is open on a different screen iOS device. For now it is ok, and later I will show you how we can handle different screen size..
• #14: Xamarin Products (TAKE A DEEP BREATH) Includes Xamarin Extension for Visual Studio which provides direct integration with Visual Studio. (TAKE A DEEP BREATH) Prior to the Xamarin Extension there was Xamarin Studio for Mac and PC which allows you to code on MacBook. (TAKE A DEEP BREATH) Also Xamarin include Component Store, where you can purchess third party products, or download SDK to lots of free frameworks like Azure Mobile (TAKE A DEEP BREATH) Xamarin Forms component allows you to build Share UI Code across mobile devices.
• #15: How Xamarin.iOS compiles Xamarin.iOS compiles c# source code against a special subset of the mono framework. This cut down version of the mono framework includes additional libraries which allow access to iOS platform specific features. The Xamarin.iOS compiler, smsc, takes source code and compiles it into an intermediate language, ECMA CIL (common intermediate language), however it does not produce ECMA ABI compatible binaries unlike the normal mono compiler, gmcs or dmsc. This means any 3rd party .Net libraries you want to include in your application will need to be recompiled against the Xamarin.iOS subset of the mono framework using smsc. Xamarin.iOS application Compiling Once a Xamarin.iOS application has been compiled into CIL it needs to be compiled again into native machine code that can run on an iOS device. This process is carried out by the SDK tool ‘mtouch’, the result of which is an application bundle that can be deployed to either the iOS simulator or an actual iOS device, such as an iPhone or iPad. Due to restrictions placed by Apple, the iOS kernel will not allow programs to generate code at runtime. This restriction has severe implications for software systems that run inside a virtual machine using just-in-time compilation. Just-in-time compilation takes the intermediate code, for example mono CIL and compiles it at runtime into machine code. This machine code is compatible for the device it is running on at the time of execution. To work around this restriction the mtouch tool compiles the CIL ahead of time. A process that the mono team describe as AOT, ahead of time compilation. What is smsc
• #16: How Xamarin.iOS compiles Xamarin.iOS compiles c# source code against a special subset of the mono framework. This cut down version of the mono framework includes additional libraries which allow access to iOS platform specific features. The Xamarin.iOS compiler, smsc, takes source code and compiles it into an intermediate language, ECMA CIL (common intermediate language), however it does not produce ECMA ABI compatible binaries unlike the normal mono compiler, gmcs or dmsc. This means any 3rd party .Net libraries you want to include in your application will need to be recompiled against the Xamarin.iOS subset of the mono framework using smsc. Xamarin.iOS application Compiling Once a Xamarin.iOS application has been compiled into CIL it needs to be compiled again into native machine code that can run on an iOS device. This process is carried out by the SDK tool ‘mtouch’, the result of which is an application bundle that can be deployed to either the iOS simulator or an actual iOS device, such as an iPhone or iPad. Due to restrictions placed by Apple, the iOS kernel will not allow programs to generate code at runtime. This restriction has severe implications for software systems that run inside a virtual machine using just-in-time compilation. Just-in-time compilation takes the intermediate code, for example mono CIL and compiles it at runtime into machine code. This machine code is compatible for the device it is running on at the time of execution. To work around this restriction the mtouch tool compiles the CIL ahead of time. A process that the mono team describe as AOT, ahead of time compilation. What is smsc? is a mono compiler for .net What is mtouch?
• #18: Toolbox Panel On the left-hand side of the window, the toolbox panel displays all of the available user interface controls. For example button, label Page Control and Controllers and Object like Navigation Controller. Property Panel Immediately below the toolbox is the properties panel, which displays all of the configurable attributes of the selected control
• #19: Storyboard File Is where we design our UI, UI flow, Controls. Controller Is where we have our code behind, handle events, etc.. App Delegate This is where we setup global events, hooks into the devices events, and more.
• #22: Model View Controller (MVC) is one of the building blocks of Cocoa and is undoubtedly the most-used design pattern of all. It classifies objects according to their general role in your application and encourages clean separation of code based on role. The three roles are: Model: The object that holds your application data and defines how to manipulate it. For example, in your application the Model is your Album class. View: The objects that are in charge of the visual representation of the Model and the controls the user can interact with; basically, all the UIViews and their subclasses. In your application the View is represented by your AlbumView class. Controller: The controller is the mediator that coordinates all the work. It accesses the data from the model and displays it with the views, listens to events and manipulates the data as necessary. Can you guess which class is your controller? That’s right: ViewController.
• #29: Basically your Mobile Application will be using the Office 365 SDK via the PCL packages to access Azure Active Directory Single Sign-on (Oauth 2.0) to access Office 365, and any resource which you the Azure AD is configure. This is great for a few reason, you and I don’t have to write all the Authentication code between Azure AD and SharePoint, we just need to master the SDK and have basic konwledged off Azure AD. However you need to have a solid understanding of Oauth and more..
• #30: Quick look at what packages are require to use the Office 365 SDK for iOS. Notice that these packages are mostly prerelease.
• #32: The View The View layer is the user interface of your application which mainly consisted of layout and user interface controls written in XAML markup. The View layer often includes resources that required in the user interface, such as data templates and styles. The Model The Model layer refers to the entities, business objects, data source, proxy objects and other repositories available in your application. The Model should be designed in a way that it does not know the existence of the View or the ViewModel. This means that the model should not access, reference or interact directly with the ViewModel or the View. The ViewModel The ViewModel layer describes the user interaction logic of the view by exposing the properties such as commands, observable commands and selection objects that can be bound from the view. In most cases, the ViewModel encapsulates the Model and expose it as properties that can be referenced from the View. The ViewModel also contains methods that perform validation and certain business logic which is invoked by the command initiated from the View. Note that the ViewModel should be designed in a way that it does not know the existence of the View. This means that the ViewModel should not access, reference or interact directly with the View. The benefits, examples and walkthroughs of using MVVM pattern with the ClientUI framework and controls are explained later in this topic. Why Use MVVM? In short, the Model-View-ViewModel pattern is a simple and effective set of guidelines for designing and implementing a Silverlight/WPF application. It allows you to create a strong separation between data, behavior, and presentation, making it easier to control the software development process primarily on the user interface engineering. The MVVM pattern introduces a number of advantages over the classic ViewModel pattern, such as: Loosely coupled architecture. The MVVM pattern promotes a design pattern that emphasizes the separation of concerns between view, user interaction logic, behaviors and model. Applications built with such loosely coupled architecture often result in rock-solid stability with less issues. Maintainable and extensible code. With MVVM pattern, your code is more maintainable and easy to extend. This is made possible because your project is generally separated into layers thus enables you to enhance specific parts without affecting the others. Testable code. The MVVM pattern allows your code to be consistently tested through unit testing. It is possible to unit test only certain functions in the layers, thanks to the great separation concept introduced by MVVM. Manageable development process. With the UI (View) separated from the user interaction logic, designers can focus on the user interface and experience aspects of the application, while developers can focus on the model, entities and business logic in a parallel work stream.
• #38: https://testcloud.xamarin.com/devices
• #40: https://testcloud.xamarin.com/devices
• #42: This is my current development environment which is a MacBook Pro as the build machine hosting Xamarin Studio used for generating iOS Apps. Also the Mac is running Parallel as the VM software running Windows 2012 with SharePoint 2013. On the right is a Dell laptop running Window 7 with Visual Studio 2013 with Xamarin Studio IDE integration. It is important to know that my MacBook memory is consistency max out during the SharePoint Mobile App development. So it is essentially just a build machine, however during normal App development one Mac can support other windows IDE development. Note: the version of Xamarin Studio is important that both machine have the same version in-order the IDE integration works. Note: Besides the Software licensing need to run SharePoint(Which this user group is well aware of) below are my challeges to setting my development environment.Development Challenges Mac as the Build Machine Hardware Need lots of memory to run SharePoint 2013 Server Good CPU Disks Space Latest software Parallel to run Windows 2012 Server Network setup requirement (The network device is not shared we need a IP address for SharePoint and one for Xamarin iOS Host) Windows 2012 server on Network Card Mac OS on Wife Card
• #43: Xamarin iOS for Visual Studio Xamarin iOS for Visual Studio accomplishes an amazing feat: it lets you create, build and debug iOS applications on a Windows computer using the Visual Studio IDE. It cannot do this alone, however - iOS applications cannot be created without Apple’s compiler, and they cannot be deployed without Apple’s certificates and code-signing tools. This means that your Xamarin iOS for Visual Studio installation requires a connection to a networked Mac OS-X computer to perform these tasks for you. Once configured, Xamarin’s tools will make the process as seamless as possible. Starting with Xamarin.iOS 4.0, there are two code generation backends to Xamarin.iOS. The regular Mono code generation engine and one based on the LLVM Optimizing Compiler. Each engine has its pros and cons. Typically, during the development process, you will likely use the Mono code generation engine as it will let you iterate quickly. For release builds and AppStore deployment, you will want to switch to the LLVM code generation engine.
• #44: I want to share with my Mac SharePoint setup and Xamarin Host, it can get messing setting up because Xamarin IDE integration requires a connection to the Mac Xamarin Hosted services including connection to the SharePoint environment hosted in VM software. What worked for me is a dedicated IP for both the Wi-Fi Note: it is just to illustrate the network setup you still need the wi-fi wireless router.