Universal Windows Platform - Azure Mobile Service

Microsoft Azure Mobile Service gives you the power to create a cloud service mobile application. This will make your work more flexible and gives your application more portability in an efficient way. This is a short introduction of Azure Mobile service. You will get to know, how to create and integrate new mobile service in your new or existing application. So let’s get crack in Azure Mobile Service with Universal Windows Platform.

Create a New Mobile Service

Firstly, go to your azure portal. The select the Mobile Service option and click plus new icon in the bottom of the page.


                                             Figure 1: Create a new Mobile Service

After creating the Mobile Service, open the Mobile Service and select the dropdown option “CONNECT AN EXISTING WINDOWS OR WINDOWS PHONE APP” below the GET STARTED option.


                                    Figure 2: Connection Uri of Mobile Service.

Now, copy the code and paste it in the App.xaml.cs file of your application. You will get the additional instruction right above the code.

Now create a new class named “Item”, which will make all the necessary tables of your Mobile Service.

classItem
{
    [JsonProperty(PropertyName = "id")]
    publicstring Id
    {
        get;
        set;
    }

    [JsonProperty(PropertyName = "message")]
    publicstring Message
    {
        get;
        set;
    }

    [JsonProperty(PropertyName = "location")]
    publicstring Location
    {
        get;
        set;
    }

    [JsonProperty(PropertyName = "Date")]
    publicDateTime Date
    {
        get;
        set;
    }
}

Listing: 1

Here we’ve created three attribute or you can say fieldsID, Message, Location and Date. For JsonProperty attribute, you need to install Newtonsoft.JsonNuGet package manager. Now, to insert, update and delete the data in your SQL table, we’ve to write little bit of code in .cs files.

Now, design the MainPage.xaml. We need a ListBox to display the data from our Mobile Service table. As there are multiple attributes and columns, here we’re showing only Message, Location and Date values.

<ScrollViewer>
    <StackPanel Margin="10,10,0,0">
        <ListBoxx:Name="listBox" Margin="10,10" RequestedTheme="Dark" FontSize="20" Background="White" Foreground="Black" BorderThickness="1" BorderBrush="Transparent">
            <ListBox.ItemContainerStyle>
                <StyleTargetType="ListBoxItem">
                    <Setter Property="HorizontalContentAlignment" Value="Stretch"></Setter>
                    </Style>
            </ListBox.ItemContainerStyle>
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <BorderBorderThickness="0,0,0,1" BorderBrush="#c0c0c0">
                        <StackPanel>
                            <TextBlock Foreground="Black" Text="{Binding Message}" />
                            <TextBlock Foreground="Black" Text="{Binding Location}" />
                            <TextBlock Foreground="Black" Text="{Binding Date}" />
                        </StackPanel>
                        </Border>
                </DataTemplate>
            </ListBox.ItemTemplate>
            </ListBox>
    </StackPanel>
</ScrollViewer>

Listing: 2 Put the code below in MainPage.cs above the constructor. ///

<summary>
    /// Mobile Service ///
</summary>
privateMobileServiceCollection
<Item, Item> items; privateIMobileServiceTable
    <Item>itemTable = App.MobileService.GetTable
        <Item>(); Listing: 3 Now in constructor initialize MainPage_Loaded method and implement like below. publicMainPage() { this.InitializeComponent(); this.Loaded += MainPage_Loaded; } asyncvoidMainPage_Loaded(object sender, RoutedEventArgs e) { items = awaititemTable.ToCollectionAsync(); this.listBox.ItemsSource = items; }

Listing: 4

Here, ‘listbox’ is the name of out ListBox control. So, we set item source as ‘items’, which set to Mobile Service tables values.

If you run the application, it will show all the data in the ListBox control.



Closure

Hopefully, you have understood the basics of Microsoft Windows Azure Mobile service and the implementation in Universal Windows Platform Application. This is only the basic, you can get deep knowledge by reading the documentation of Mobile Service and visit the Azure website to get the latest information about Mobile Service.