{"id":19099410,"url":"https://github.com/TheCodeTraveler/XamarinIoTWorkshop","last_synced_at":"2025-04-18T17:31:24.629Z","repository":{"id":40935015,"uuid":"136390317","full_name":"brminnick/XamarinIoTWorkshop","owner":"brminnick","description":"A workshop that demonstrates how to collect IoT data from a mobile device using a Xamarin app, aggregating the data to the cloud using Azure IoT Hub","archived":false,"fork":false,"pushed_at":"2022-06-22T16:19:58.000Z","size":891,"stargazers_count":13,"open_issues_count":0,"forks_count":6,"subscribers_count":4,"default_branch":"master","last_synced_at":"2024-05-01T14:09:02.765Z","etag":null,"topics":["azure-iot","azure-iot-central","azure-iot-hub","iot","xamarin","xamarin-android","xamarin-forms","xamarin-ios"],"latest_commit_sha":null,"homepage":"https://azure.microsoft.com/services/iot-central/?WT.mc_id=XamarinIoTWorkshop-github-bramin","language":"C#","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/brminnick.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE.md","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2018-06-06T21:56:03.000Z","updated_at":"2024-05-01T14:09:02.766Z","dependencies_parsed_at":"2022-09-24T00:41:07.772Z","dependency_job_id":null,"html_url":"https://github.com/brminnick/XamarinIoTWorkshop","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/brminnick%2FXamarinIoTWorkshop","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/brminnick%2FXamarinIoTWorkshop/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/brminnick%2FXamarinIoTWorkshop/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/brminnick%2FXamarinIoTWorkshop/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/brminnick","download_url":"https://codeload.github.com/brminnick/XamarinIoTWorkshop/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":223783108,"owners_count":17201903,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["azure-iot","azure-iot-central","azure-iot-hub","iot","xamarin","xamarin-android","xamarin-forms","xamarin-ios"],"created_at":"2024-11-09T03:49:59.618Z","updated_at":"2025-04-18T17:31:18.831Z","avatar_url":"https://github.com/brminnick.png","language":"C#","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Xamarin IoT Workshop\n\n|CI Tool                    |Build Status|\n|---------------------------|---|\n| App Center, iOS | [![Build status](https://build.appcenter.ms/v0.1/apps/186c8afc-b757-4b79-aca3-3fe0711b7f64/branches/master/badge)](https://appcenter.ms) |\n| App Center, Android | [![Build status](https://build.appcenter.ms/v0.1/apps/e149e8f1-80de-4084-953b-83a482e5abd8/branches/master/badge)](https://appcenter.ms) |\n\n# About\n\nThis workshop will connect your mobile device to an [Azure IoT Hub](https://azure.microsoft.com/services/iot-hub?WT.mc_id=mobile-0000-bramin) backend using a mobile app created in [Xamarin](https://visualstudio.microsoft.com/xamarin?WT.mc_id=mobile-0000-bramin) and [Azure IoT Central](https://azure.microsoft.com/services/iot-central?WT.mc_id=mobile-0000-bramin).\n\nThe app uses [Xamarin Essentials](https://docs.microsoft.com/xamarin/essentials?WT.mc_id=mobile-0000-bramin) to gather sensor data from the device's Accelerometer \u0026 Gyroscope, displays the data in the app using [Syncfusion's Circular Gauge control](https://www.syncfusion.com/products/xamarin/circular-gauge), and then sends the sensor data to the IoT Central Portal where we can view the data.\n\n| Mobile App              | Sending Data to IoT Central Dashboard |\n:-------------------------|:-------------------------:\n![Xamarin iOS App](https://user-images.githubusercontent.com/13558917/42401809-41173f26-812c-11e8-98f4-4703ccc062c3.gif) | ![IoT Central Dashboard](https://user-images.githubusercontent.com/13558917/42401851-6ceeae54-812c-11e8-9296-b3ddbf5e8249.png)\n\n# Walkthrough\n\n## 1. Install Xamarin App\n\n**Note:** If this is workshop is being done in-person, led by Brandon Minnick, follow the [App Center Installation steps](./AppCenterInstallation.md).\n\n1. Clone/Download this git repo\n\n![Clone](https://user-images.githubusercontent.com/13558917/45580869-83982380-b8d9-11e8-8ed2-8415ac6480b3.png)\n\n2. After downloading/cloning the repo, locate `XamarinIoTWorkshop.sln`\n3. Launch `XamarinIoTWorkshop.sln` in [Visual Studio on PC](https://visualstudio.microsoft.com/vs/?WT.mc_id=mobile-0000-bramin) or [Visual Studio for Mac](https://visualstudio.microsoft.com/vs/mac/?WT.mc_id=mobile-0000-bramin)\n4. Build \u0026 Deploy XamarinIoTWorkshop.iOS or XamarinIoTWorkshop.Android to your local iOS or Android device\n\n## 2. Create IoT Central Device\n\n1. On your computer, open a browser and navigate to [Azure IoT Central](https://apps.azureiotcentral.com/myapps?WT.mc_id=XamarinIoTWorkshop-github-bramin)\n2. If requested, sign in with your Microsoft account\n    - You can use any Microsoft-connected account, e.g. Azure account, Live account, Hotmail account, etc.\n    - If you do not have a Microsoft-connected account, now is a great time to create one!\n3. On the Azure IoT Central Portal, select **New Application**\n\n![IoT Central, New Application](https://user-images.githubusercontent.com/13558917/42413959-63a4ed0e-81e0-11e8-9343-6b3cbc987a8a.png)\n\n4. On the Create Application page, make the following selections:\n    - **Choose payment plan**: Free\n    - **Select an application template**: Custom Application\n    - **Application Name**: Xamarin IoT Workshop [Last Name]\n        -Note: Replace \"[Last Name]\" with your last name to create a unique Application Name\n    - **Url**: xamarin-iot-workshop-[Last Name]\n         -Note: Replace \"[Last Name]\" with your last name to create a unique Url\n\n5. On the Create Application page, select **Create**\n\n![IoT Central, Create Application](https://user-images.githubusercontent.com/13558917/42413957-6377635c-81e0-11e8-9eac-1dcf04527600.png)\n\n6. On the Homepage screen, select **Create Device Templates**\n\n![IoT Central, Create Device Templates](https://user-images.githubusercontent.com/13558917/42413958-638d2e76-81e0-11e8-808a-ac0707dcfea8.png)\n\n7. On the **New device template** page, enter \"Mobile Device\"\n8. On the **New device template** page, select **Create**\n\n![IoT Central, New device template](https://user-images.githubusercontent.com/13558917/42414015-7ceccfb0-81e1-11e8-8866-bbde4ad17e06.png)\n\n9. On the **Mobile Device 1** page, select \"Delete\"\n    - **Mobile Device 1** is a simulated device created by Azure IoT Central\n    - We are deleting the simulated device and connecting a real device\n\n![IoT Central, Delete Simulated Device](https://user-images.githubusercontent.com/13558917/42413956-6362175e-81e0-11e8-8965-d7a2943678d5.png)\n\n10. On the confirmation popup, select **Delete**\n\n![IoT Central, Confirm Delete](https://user-images.githubusercontent.com/13558917/42414016-7d032f9e-81e1-11e8-83e5-535935fcc2c4.png)\n\n11. On the **Explorer** page, select **New** -\u003e **Real**\n\n![IoT Central, New Real Device](https://user-images.githubusercontent.com/13558917/42413954-6333f036-81e0-11e8-9014-c07a466c2db7.png)\n\n## 5. Add Measurements to IoT Central Device\n\n1. On your computer, open a browser and navigate to [Azure IoT Central](https://apps.azureiotcentral.comhttps://apps.azureiotcentral.com?WT.mc_id=XamarinIoTWorkshop-github-bramin)\n2. If requested, sign in with your Microsoft account\n3. On the **Mobile Device** page, select **New Measurement** -\u003e **Telemetry**\n\n![IoT Central, New Measurement](https://user-images.githubusercontent.com/13558917/42414489-ed7153f6-81ea-11e8-8e30-587903a620fe.png)\n\n![IoT Central, Telemetry](https://user-images.githubusercontent.com/13558917/42414488-ed58e78a-81ea-11e8-895c-f8f60e04913c.png)\n\n4. In the **Create Telemetry** pane, enter the following information:\n    - **Display Name**: AccelerometerX\n    - **Field Name**: AccelerometerX\n    - **Units**: [Leave Blank]\n    - **Minimum Value**: -1\n    - **Maximium Value**: 1\n    - **Decimal Places**: 5\n5. In the **Create Telemetry** pane, select **Save**\n\n![IoT Central, AccelerometerX](https://user-images.githubusercontent.com/13558917/42414487-ed4355c8-81ea-11e8-8eb0-9033961de83c.png)\n\n6. On the **Mobile Device** page, select **New Measurement** -\u003e **Telemetry**\n7. In the **Create Telemetry** pane, enter the following information:\n    - **Display Name**: AccelerometerY\n    - **Field Name**: AccelerometerY\n    - **Units**: [Leave Blank]\n    - **Minimum Value**: -1\n    - **Maximium Value**: 1\n    - **Decimal Places**: 5\n8. In the **Create Telemetry** pane, select **Save**\n\n![IoT Central, AccelerometerY](https://user-images.githubusercontent.com/13558917/42414511-47cc8294-81eb-11e8-97e3-224f625f9cc4.png)\n\n9. On the **Mobile Device** page, select **New Measurement** -\u003e **Telemetry**\n10. In the **Create Telemetry** pane, enter the following information:\n    - **Display Name**: AccelerometerZ\n    - **Field Name**: AccelerometerZ\n    - **Units**: [Leave Blank]\n    - **Minimum Value**: -10\n    - **Maximium Value**: 10\n    - **Decimal Places**: 5\n11. In the **Create Telemetry** pane, select **Save**\n\n![IoT Central, AccelerometerZ](https://user-images.githubusercontent.com/13558917/42414484-ed1517b2-81ea-11e8-923f-2711b1c20830.png)\n\n12. On the **Mobile Device** page, select **New Measurement** -\u003e **Telemetry**\n13. In the **Create Telemetry** pane, enter the following information:\n    - **Display Name**: GyroscopeX\n    - **Field Name**: GyroscopeX\n    - **Units**: [Leave Blank]\n    - **Minimum Value**: -1\n    - **Maximium Value**: 1\n    - **Decimal Places**: 5\n14. In the **Create Telemetry** pane, select **Save**\n\n![IoT Central, GyroscopeX](https://user-images.githubusercontent.com/13558917/42414483-ecfeaf18-81ea-11e8-99dc-6a0faf3cab79.png)\n\n15. On the **Mobile Device** page, select **New Measurement** -\u003e **Telemetry**\n16. In the **Create Telemetry** pane, enter the following information:\n    - **Display Name**: GyroscopeY\n    - **Field Name**: GyroscopeY\n    - **Units**: [Leave Blank]\n    - **Minimum Value**: -1\n    - **Maximium Value**: 1\n    - **Decimal Places**: 5\n17. In the **Create Telemetry** pane, select **Save**\n\n![IoT Central, GyroscopeY](https://user-images.githubusercontent.com/13558917/42414482-ece9b2ca-81ea-11e8-810a-044894100872.png)\n\n18. On the **Mobile Device** page, select **New Measurement** -\u003e **Telemetry**\n19. In the **Create Telemetry** pane, enter the following information:\n    - **Display Name**: GyroscopeZ\n    - **Field Name**: GyroscopeZ\n    - **Units**: [Leave Blank]\n    - **Minimum Value**: -5\n    - **Maximium Value**: 5\n    - **Decimal Places**: 5\n20. In the **Create Telemetry** pane, select **Save**\n\n![IoT Central, GyroscopeZ](https://user-images.githubusercontent.com/13558917/42414481-ecd293d8-81ea-11e8-81a9-5d162b25ef90.png)\n\n## 3. Get Device Connection String\n\n1. In **IoT Central** on the **Mobile Device** page, select **Connect this device**\n\n![Iot Central, Connect This Device](https://user-images.githubusercontent.com/13558917/42414606-339e1588-81ed-11e8-9c75-106a2238c092.png)\n\n2. In the **Connect this device** popup, select the **Copy** button adjacent to **Primary connection string**\n\n![IoT Central, Copy Primary Connection String](https://user-images.githubusercontent.com/13558917/42414605-3385ca0a-81ed-11e8-8f97-3e43d86134dd.png)\n\n3. On your computer, open a text editor, e.g. Notepad, TextEdit, Visual Studio Code, etc.\n4. In the text editor, paste the **Primary connection string** value\n\n![Primary Connection String](https://user-images.githubusercontent.com/13558917/42414604-336c6164-81ed-11e8-8dc4-575e100d253c.png)\n\n## 7. Install iOS App (iOS only)\n\nWe will now install the iOS app from App Center. If you have an Android Device and have already installed the Android app, skip to **Step 8**.\n\n1. On your iOS device, open Safari\n2. In Safari on your iOS device, navigate to the App Center installation page:[https://install.appcenter.ms](https://install.appcenter.ms)\n3. On the installation page, if prompted, sign in\n\n\u003cimg alt=\"App Center Installation Page\" src=\"https://user-images.githubusercontent.com/13558917/42402802-ec844b24-8131-11e8-8f5a-affb75895f0b.png\" width=\"200px\"\u003e\n\n4. On the installation page in Safari, tap on **Xamarin IoT Workshop, iOS**\n\n\u003cimg alt=\"Xamarin IoT Workshop, iOS\" src=\"https://user-images.githubusercontent.com/13558917/42534694-3d5bff02-8442-11e8-8f7f-111c0fdac6d1.png\" width=\"200px\"\u003e\n\n5. On the **Xamarin IoT Workshop, iOS** page, select **Install**\n\n\u003cimg alt=\"iOS Installation Page\" src=\"https://user-images.githubusercontent.com/13558917/42414397-65a0babc-81e9-11e8-8a14-a47aaad93aa8.png\" width=\"200px\"\u003e\n\n6. On the confirmation popup, select **Install**\n\n\u003cimg alt=\"iOS Installation Confirmation\" src=\"https://user-images.githubusercontent.com/13558917/42414396-65878768-81e9-11e8-8438-2f5050f8b5e9.png\" width=\"200px\"\u003e\n\n7. On the iOS device, navigate to the iOS Home Screen\n8. On the iOS Home Screen, confirm that the app is installing\n\n\u003cimg alt=\"iOS Home Screen Installation\" src=\"https://user-images.githubusercontent.com/13558917/42414398-693b41ec-81e9-11e8-8d27-b0d18764692c.PNG\" width=\"200px\"\u003e\n\n## 8. Connect App to IoT Central\n\n1. On your mobile device, launch the XamarinIoTWorkshop app\n2. In the XamarinIoTWorkshop app, tap the **Settings** tab\n\n\u003cimg alt=\"XamarinIoTWorkshop App, Accelerometer Page\" src=\"https://user-images.githubusercontent.com/13558917/42414665-c45f520c-81ee-11e8-88a4-416d8499063f.png\" width=\"200px\"\u003e\n\n\u003cimg alt=\"XamarinIoTWorkshop App, Accelerometer Page\" src=\"https://user-images.githubusercontent.com/13558917/42414666-c47590f8-81ee-11e8-910a-f7a9103fc150.png\" width=\"200px\"\u003e\n\n3. On **Settings** page, enter the **Primary Connection String** into the text box\n    - To avoid typos, I recommend emailing yourself the connection string, then copy/pasting the connection string into this text box\n4. On the **Settings** page, toggle the **Send Data to Azure** switch to **On**\n\n\u003cimg alt=\"XamarinIoTWorkshop App, Accelerometer Page\" src=\"https://user-images.githubusercontent.com/13558917/42414667-c48b71f2-81ee-11e8-8872-25e4076a04d2.png\" width=\"200px\"\u003e\n\n5. Keep the app running in the foreground on your mobile device\n    - The app will only collect data and send it to IoT Central while it is running in the foreground\n\n## 3. View Data On IoT Central Dashboard\n\nAs you rotate your phone, the guages in the app will update and the data will appear on the IoT Central Dashboard in near-realtime\n\n![IoT Central Dashboard](https://user-images.githubusercontent.com/13558917/42401851-6ceeae54-812c-11e8-9296-b3ddbf5e8249.png)\n\n# Resources\n\n- [App Center](https://appcenter.ms?WT.mc_id=XamarinIoTWorkshop-github-bramin)\n- [Azure IoT Central](https://azure.microsoft.com/services/iot-central?WT.mc_id=mobile-0000-bramin)\n- [Azure IoT Hub](https://azure.microsoft.com/services/iot-hub?WT.mc_id=mobile-0000-bramin)\n- [Syncfusion's Circular Gauge control](https://www.syncfusion.com/products/xamarin/circular-gauge)\n- [Visual Studio for Mac](https://visualstudio.microsoft.com/vs/mac?WT.mc_id=mobile-0000-bramin)\n- [Visual Studio on PC](https://visualstudio.microsoft.com/vs?WT.mc_id=mobile-0000-bramin)\n- [Xamarin](https://visualstudio.microsoft.com/xamarin?WT.mc_id=mobile-0000-bramin)\n- [Xamarin Essentials](https://docs.microsoft.com/xamarin/essentials?WT.mc_id=mobile-0000-bramin)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FTheCodeTraveler%2FXamarinIoTWorkshop","html_url":"https://awesome.ecosyste.ms/projects/github.com%2FTheCodeTraveler%2FXamarinIoTWorkshop","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FTheCodeTraveler%2FXamarinIoTWorkshop/lists"}