Added mobile apps Splash

Created Cart layout
Completed Tabs layout

src/Mobile/eShopOnContainers/eShopOnContainers.Core/App.xaml

@@ -100,6 +100,7 @@
             <!-- CONVERTERS -->
             <converters:ToUpperConverter x:Key="ToUpperConverter" />
             <converters:DatetimeConverter x:Key="DatetimeConverter" />
+            <converters:ImageConverter x:Key="ImageConverter" />
             <converters:ItemTappedEventArgsConverter x:Key="ItemTappedEventArgsConverter" />
 
             <!-- STYLES -->

src/Mobile/eShopOnContainers/eShopOnContainers.Core/Converters/ImageConverter.cs

@@ -0,0 +1,22 @@
+using System;
+using System.Globalization;
+using Xamarin.Forms;
+
+namespace eShopOnContainers.Core.Converters
+{
+    public class ImageConverter : IValueConverter
+    {
+        public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
+        {
+            if (value == null)
+                return string.Empty;
+
+            return value;
+        }
+
+        public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
+        {
+            throw new NotImplementedException();
+        }
+    }
+}

src/Mobile/eShopOnContainers/eShopOnContainers.Core/Models/Catalog/CatalogItem.cs

@@ -1,13 +1,16 @@
-using System;
+namespace eShopOnContainers.Core.Models.Catalog
-
-namespace eShopOnContainers.Core.Models.Catalog
 {
     public class CatalogItem
     {
-        public int Id { get; set; }
+        public string Id { get; set; }
         public string Name { get; set; }
         public string Description { get; set; }
         public decimal Price { get; set; }
-        public string Image { get; set; }
+        public string PictureUri { get; set; }
+        public int CatalogBrandId { get; set; }
+        public string CatalogBrand { get; set; }
+        public int CatalogTypeId { get; set; }
+        public string CatalogType { get; set; }
+
     }
 }

src/Mobile/eShopOnContainers/eShopOnContainers.Core/Models/Orders/OrderItem.cs

@@ -1,17 +1,90 @@
-using System;
+using eShopOnContainers.ViewModels.Base;
+using System;
 
 namespace eShopOnContainers.Core.Models.Orders
 {
-    public class OrderItem
+    public class OrderItem : ExtendedBindableObject
     {
-        public int ProductId { get; set; }
+        private string _productImage;
-        public Guid OrderId { get; set; }
+        private int _productId;
-        public string ProductName { get; set; }
+        private Guid _orderId;
-        public decimal UnitPrice { get; set; }
+        private string _productName;
-        public int Quantity { get; set; }
+        private decimal _unitPrice;
-        public decimal Discount { get; set; }
+        private int _quantity;
+        private decimal _discount;
+
+        public int ProductId
+        {
+            get { return _productId; }
+            set
+            {
+                _productId = value;
+                RaisePropertyChanged(() => ProductId);
+            }
+        }
+
+        public Guid OrderId
+        {
+            get { return _orderId; }
+            set
+            {
+                _orderId = value;
+                RaisePropertyChanged(() => OrderId);
+            }
+        }
+
+        public string ProductName
+        {
+            get { return _productName; }
+            set
+            {
+                _productName = value;
+                RaisePropertyChanged(() => ProductName);
+            }
+        }
+
+        public decimal UnitPrice
+        {
+            get { return _unitPrice; }
+            set
+            {
+                _unitPrice = value;
+                RaisePropertyChanged(() => UnitPrice);
+            }
+        }
+
+        public int Quantity
+        {
+            get { return _quantity; }
+            set
+            {
+                _quantity = value;
+                RaisePropertyChanged(() => Quantity);
+            }
+        }
+
+        public decimal Discount
+        {
+            get { return _discount; }
+            set
+            {
+                _discount = value;
+                RaisePropertyChanged(() => Discount);
+            }
+        }
+
         public decimal Total { get { return Quantity * UnitPrice; } }
 
+        public string ProductImage
+        {
+            get { return _productImage; }
+            set
+            {
+                _productImage = value;
+                RaisePropertyChanged(() => ProductImage);
+            }
+        }
+
         public override string ToString()
         {
             return String.Format("Product Id: {0}, Quantity: {1}", ProductId, Quantity);

src/Mobile/eShopOnContainers/eShopOnContainers.Core/Services/Catalog/CatalogMockService.cs

@@ -1,6 +1,7 @@
 using eShopOnContainers.Core.Models.Catalog;
 using System;
 using System.Collections.ObjectModel;
+using System.Linq;
 using System.Threading.Tasks;
 using Xamarin.Forms;
 
@@ -8,16 +9,25 @@ namespace eShopOnContainers.Core.Services.Catalog
 {
     public class CatalogMockService : ICatalogService
     {
-        public async Task<ObservableCollection<CatalogItem>> GetProductsAsync()
+        private ObservableCollection<CatalogItem> MockCatalog = new ObservableCollection<CatalogItem>
+        {
+            new CatalogItem { Id = "1", PictureUri = Device.OS != TargetPlatform.Windows? "fake_product_01" : "Assets/fake_product_01.png", Name = ".NET Bot Blue Sweatshirt (M)", Price = 19.50M },
+            new CatalogItem { Id = "2", PictureUri = Device.OS != TargetPlatform.Windows? "fake_product_02": "Assets/fake_product_02.png", Name = ".NET Bot Purple Sweatshirt (M)", Price = 19.50M },
+            new CatalogItem { Id = "3", PictureUri = Device.OS != TargetPlatform.Windows? "fake_product_03": "Assets/fake_product_03.png", Name = ".NET Bot Black Sweatshirt (M)", Price = 19.95M }
+        };
+
+        public async Task<ObservableCollection<CatalogItem>> GetCatalogAsync()
         {
             await Task.Delay(500);
 
-            return new ObservableCollection<CatalogItem>
+            return MockCatalog;
+        }
+
+        public async Task<CatalogItem> GetCatalogItemAsync(string id)
         {
-                new CatalogItem { Id = 1, Image = Device.OS != TargetPlatform.Windows ? "fake_product_01" : "Assets/fake_product_01.png", Name = ".NET Bot Blue Sweatshirt (M)", Price = 19.50M },
+            await Task.Delay(500);
-                new CatalogItem { Id = 2, Image = Device.OS != TargetPlatform.Windows ? "fake_product_02": "Assets/fake_product_02.png", Name = ".NET Bot Purple Sweatshirt (M)", Price = 19.50M },
+
-                new CatalogItem { Id = 3, Image = Device.OS != TargetPlatform.Windows ? "fake_product_03": "Assets/fake_product_03.png", Name = ".NET Bot Black Sweatshirt (M)", Price = 19.95M }
+            return MockCatalog.FirstOrDefault(c => c.Id == id);
-            };
         }
     }
 }

src/Mobile/eShopOnContainers/eShopOnContainers.Core/Services/Catalog/ICatalogService.cs

@@ -6,6 +6,7 @@ namespace eShopOnContainers.Core.Services.Catalog
 {
     public interface ICatalogService
     {
-        Task<ObservableCollection<CatalogItem>> GetProductsAsync();
+        Task<ObservableCollection<CatalogItem>> GetCatalogAsync();
+        Task<CatalogItem> GetCatalogItemAsync(string id);
     }
 }

src/Mobile/eShopOnContainers/eShopOnContainers.Core/ViewModels/CartViewModel.cs

@@ -1,7 +1,11 @@
-using eShopOnContainers.Core.Models.Orders;
+using eShopOnContainers.Core.Models.Catalog;
+using eShopOnContainers.Core.Models.Orders;
 using eShopOnContainers.Core.Services.Orders;
 using eShopOnContainers.Core.ViewModels.Base;
 using eShopOnContainers.ViewModels.Base;
+using System;
+using System.Collections.ObjectModel;
+using System.Linq;
 using System.Threading.Tasks;
 using Xamarin.Forms;
 
@@ -10,7 +14,8 @@ namespace eShopOnContainers.Core.ViewModels
     public class CartViewModel : ViewModelBase
     {
         private int _badgeCount;
-        private Order _order;
+        private ObservableCollection<OrderItem> _orderItems;
+        private decimal _total;
 
         private IOrdersService _orderService;
 
@@ -29,24 +34,70 @@ namespace eShopOnContainers.Core.ViewModels
             }
         }
 
-        public Order Order
+        public ObservableCollection<OrderItem> OrderItems
         {
-            get { return _order; }
+            get { return _orderItems; }
             set
             {
-                _order = value;
+                _orderItems = value;
-                RaisePropertyChanged(() => Order);
+                RaisePropertyChanged(() => OrderItems);
             }
         }
 
-        public override async Task InitializeAsync(object navigationData)
+        public decimal Total
         {
-            MessagingCenter.Subscribe<CatalogViewModel>(this, MessengerKeys.AddProduct, (sender) =>
+            get { return _total; }
+            set
+            {
+                _total = value;
+                RaisePropertyChanged(() => Total);
+            }
+        }
+
+        public override Task InitializeAsync(object navigationData)
+        {
+            MessagingCenter.Subscribe<CatalogViewModel, CatalogItem>(this, MessengerKeys.AddProduct, (sender, arg) =>
             {
                 BadgeCount++;
+
+                AddCartItem(arg);
             });
 
-            Order = await _orderService.GetCartAsync();
+            OrderItems = new ObservableCollection<OrderItem>();
+
+            return base.InitializeAsync(navigationData);
+        }
+
+        private void AddCartItem(CatalogItem item)
+        {
+            if (OrderItems.Any(o => o.ProductId == Convert.ToInt32(item.Id)))
+            {
+                var orderItem = OrderItems.First(o => o.ProductId == Convert.ToInt32(item.Id));
+                orderItem.Quantity++;
+            }
+            else
+            {
+                OrderItems.Add(new OrderItem
+                {
+                    ProductId = Convert.ToInt32(item.Id),
+                    ProductName = item.Name,
+                    ProductImage = item.PictureUri,
+                    UnitPrice = item.Price,
+                    Quantity = 1
+                });
+            }
+
+            ReCalculateTotal();
+        }
+
+        private void ReCalculateTotal()
+        {
+            Total = 0;
+
+            foreach (var orderItem in OrderItems)
+            {
+                Total += orderItem.Total;
+            }
         }
     }
 }

src/Mobile/eShopOnContainers/eShopOnContainers.Core/ViewModels/CatalogViewModel.cs

@@ -5,13 +5,13 @@ using Xamarin.Forms;
 using eShopOnContainers.Core.ViewModels.Base;
 using eShopOnContainers.Core.Models.Catalog;
 using eShopOnContainers.Core.Services.Catalog;
+using System.Windows.Input;
 
 namespace eShopOnContainers.Core.ViewModels
 {
     public class CatalogViewModel : ViewModelBase
     {
         private ObservableCollection<CatalogItem> _products;
-        private CatalogItem _product;
 
         private ICatalogService _productsService;
 
@@ -30,28 +30,20 @@ namespace eShopOnContainers.Core.ViewModels
             }
         }
 
-        public CatalogItem Product
+        public ICommand AddCatalogItemCommand => new Command<CatalogItem>(AddCatalogItem);
-        {
-            get { return _product; }
-            set
-            {
-                _product = value;
-
-                if (_product != null)
-                {
-                    AddProduct();
-                }
-            }
-        }
 
         public override async Task InitializeAsync(object navigationData)
         {
-            Products = await _productsService.GetProductsAsync();
+            IsBusy = true;
+
+            Products = await _productsService.GetCatalogAsync();
+
+            IsBusy = false;
         }
 
-        private void AddProduct()
+        private void AddCatalogItem(CatalogItem catalogItem)
         {
-            MessagingCenter.Send(this, MessengerKeys.AddProduct);
+            MessagingCenter.Send(this, MessengerKeys.AddProduct, catalogItem);
         }
     }
 }

src/Mobile/eShopOnContainers/eShopOnContainers.Core/ViewModels/LoginViewModel.cs

@@ -2,6 +2,7 @@
 using eShopOnContainers.ViewModels.Base;
 using System;
 using System.Diagnostics;
+using System.Threading.Tasks;
 using System.Windows.Input;
 using Xamarin.Forms;
 
@@ -73,6 +74,8 @@ namespace eShopOnContainers.Core.ViewModels
             {
                 try
                 {
+                    await Task.Delay(1000);
+
                     isAuthenticated = true;
                 }
                 catch (Exception ex)

src/Mobile/eShopOnContainers/eShopOnContainers.Core/ViewModels/OrderDetailViewModel.cs

@@ -1,6 +1,8 @@
 using System.Threading.Tasks;
 using eShopOnContainers.Core.Models.Orders;
 using eShopOnContainers.ViewModels.Base;
+using eShopOnContainers.Core.Services.Orders;
+using eShopOnContainers.Core.Services.Catalog;
 
 namespace eShopOnContainers.Core.ViewModels
 {
@@ -8,6 +10,16 @@ namespace eShopOnContainers.Core.ViewModels
     {
         private Order _order;
 
+        private IOrdersService _orderService;
+        private ICatalogService _catalogService;
+
+        public OrderDetailViewModel(IOrdersService orderService,
+            ICatalogService catalogService)
+        {
+            _orderService = orderService;
+            _catalogService = catalogService;
+        }
+
         public Order Order
         {
             get { return _order; }
@@ -18,14 +30,24 @@ namespace eShopOnContainers.Core.ViewModels
             }
         }
 
-        public override Task InitializeAsync(object navigationData)
+        public override async Task InitializeAsync(object navigationData)
         {
             if(navigationData is Order)
             {
-                Order = navigationData as Order;
+                IsBusy = true;
+
+                var order = navigationData as Order;
+                   
+                foreach (var orderItem in order.OrderItems)
+                {
+                    var catalogItem = await _catalogService.GetCatalogItemAsync(orderItem.ProductId.ToString());
+                    orderItem.ProductImage = catalogItem.PictureUri;
                 }
 
-            return base.InitializeAsync(navigationData);
+                Order = order;
+
+                IsBusy = false;
+            }
         }
     }
 }

src/Mobile/eShopOnContainers/eShopOnContainers.Core/ViewModels/ProfileViewModel.cs

@@ -35,13 +35,21 @@ namespace eShopOnContainers.Core.ViewModels
 
         public override async Task InitializeAsync(object navigationData)
         {
+            IsBusy = true;
+
             Orders = await _ordersService.GetOrdersAsync();
+
+            IsBusy = false;
         }
 
         private async void LogoutAsync()
         {
+            IsBusy = true;
+
             await NavigationService.NavigateToAsync<LoginViewModel>();
             await NavigationService.RemoveBackStackAsync();
+
+            IsBusy = false;
         }
 
         private void OrderDetail(Order order)

src/Mobile/eShopOnContainers/eShopOnContainers.Core/Views/CartView.xaml

@@ -2,43 +2,19 @@
 <ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
              xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
              x:Class="eShopOnContainers.Core.Views.CartView"
+             xmlns:templates="clr-namespace:eShopOnContainers.Core.Views.Templates;assembly=eShopOnContainers.Core"   
              Title="Cart">
     <ContentPage.Resources>
         <ResourceDictionary>
 
-            <Style x:Key="OrderTitleStyle" 
+            <Style x:Key="CartTotalStyle" 
                TargetType="{x:Type Label}">
                 <Setter Property="FontFamily"
                         Value="{StaticResource MontserratRegular}" />
                 <Setter Property="FontSize" 
-                        Value="{StaticResource MediumSize}" />
+                        Value="{StaticResource LargerSize}" />
-                <Setter Property="TextColor"
+                <Setter Property="HorizontalOptions" 
-                        Value="Gray" />
+                        Value="End" />
-            </Style>
-
-            <Style x:Key="OrderContentStyle"    
-                   TargetType="{x:Type Label}"
-                   BasedOn="{StaticResource OrderTitleStyle}">
-                <Setter Property="TextColor"
-                        Value="Black" />
-            </Style>
-
-            <Style x:Key="ShippingAddressStyle"    
-                   TargetType="{x:Type Label}"
-                   BasedOn="{StaticResource OrderTitleStyle}">
-                <Setter Property="FontSize"
-                        Value="{StaticResource LargeSize}" />
-                <Setter Property="TextColor"
-                        Value="Black" />
-            </Style>
-
-            <Style x:Key="AddressStyle"    
-                   TargetType="{x:Type Label}"
-                   BasedOn="{StaticResource OrderTitleStyle}">
-                <Setter Property="FontSize"
-                        Value="{StaticResource LittleSize}" />
-                <Setter Property="TextColor"
-                        Value="Black" />
             </Style>
             
         </ResourceDictionary>
@@ -47,91 +23,43 @@
         <Grid
             BackgroundColor="{StaticResource BackgroundColor}">
             <Grid.RowDefinitions>
-                <RowDefinition />
-                <RowDefinition />
-                <RowDefinition />
-            </Grid.RowDefinitions>
-            <!-- ORDER INFO -->
-            <Grid>
-                <Grid.ColumnDefinitions>
-                    <ColumnDefinition />
-                    <ColumnDefinition />
-                </Grid.ColumnDefinitions>
-                <Grid.RowDefinitions>
-                    <RowDefinition />
-                    <RowDefinition />
-                </Grid.RowDefinitions>
-                <StackLayout
-                    Grid.Column="0"
-                    Grid.Row="0"
-                    Margin="12">
-                    <Label 
-                        Text="ORDER NUMBER"
-                        Style="{StaticResource OrderTitleStyle}"/>
-                    <Label 
-                        Text="{Binding Order.OrderNumber, Converter={StaticResource ToUpperConverter}}"
-                        Style="{StaticResource OrderContentStyle}"/>
-                </StackLayout>
-                <StackLayout
-                    Grid.Column="0"
-                    Grid.Row="1" 
-                    Margin="12">
-                    <Label 
-                        Text="TOTAL"
-                        Style="{StaticResource OrderTitleStyle}"/>
-                    <Label 
-                        Text="{Binding Order.Total, StringFormat='${0:N}', Converter={StaticResource ToUpperConverter}}" 
-                        Style="{StaticResource OrderContentStyle}"/>
-                </StackLayout>
-                <StackLayout
-                    Grid.Column="1"
-                    Grid.Row="0"
-                    Margin="12">
-                    <Label 
-                        Text="DATE"
-                        Style="{StaticResource OrderTitleStyle}"/>
-                    <Label 
-                        Text="{Binding Order.Date, Converter={StaticResource DatetimeConverter}}"
-                        Style="{StaticResource OrderContentStyle}"/>
-                </StackLayout>
-                <StackLayout
-                    Grid.Column="1"
-                    Grid.Row="1" 
-                    Margin="12">
-                    <Label 
-                        Text="STATUS"
-                        Style="{StaticResource OrderTitleStyle}"/>
-                    <Label 
-                        Text="{Binding Order.Status, Converter={StaticResource ToUpperConverter}}"
-                        Style="{StaticResource OrderContentStyle}"/>
-                </StackLayout>
-            </Grid>
-            <!-- SHIPPING ADDRESS -->
-            <Grid
-                Grid.Row="1"
-                Margin="12">
-                <Grid.RowDefinitions>
-                    <RowDefinition Height="Auto" />
                 <RowDefinition Height="*" />
+                <RowDefinition Height="Auto" />
             </Grid.RowDefinitions>
+            <!-- CART ITEMS -->
+            <Grid            
+                Grid.Row="0">
+                <Grid.RowDefinitions>
+                    <RowDefinition Height="*" />
+                    <RowDefinition Height="Auto" />
+                </Grid.RowDefinitions>
+                <ListView 
+                    ItemsSource="{Binding OrderItems}"     
+                    HasUnevenRows="True"
+                    SeparatorVisibility="None"
+                    VerticalOptions="FillAndExpand"
+                    CachingStrategy="RecycleElement">
+                    <ListView.ItemTemplate>
+                        <DataTemplate>
+                            <ViewCell>
+                                <templates:OrderItemTemplate />
+                            </ViewCell>
+                        </DataTemplate>
+                    </ListView.ItemTemplate>
+                </ListView>
+                <StackLayout
+                    Grid.Row="1"
+                    Margin="0,0,0,24">
                     <Label 
                         Grid.Row="0"
-                    Text="SHIPPING ADDRESS"
+                        Text="TOTAL"
-                    Style="{StaticResource ShippingAddressStyle}"/>
+                        TextColor="{StaticResource BlackColor}"
-                <StackLayout
+                        Style="{StaticResource CartTotalStyle}"/>
-                    Grid.Row="1">
                     <Label 
-                        Text="120 E 87th Street"
+                        Grid.Row="1"                   
-                        Style="{StaticResource AddressStyle}"/>
+                        Text="{Binding Total, StringFormat='${0:N}'}"
-                    <Label
+                        TextColor="{StaticResource GreenColor}"
-                        Text="Seattle, WA"   
+                        Style="{StaticResource CartTotalStyle}"/>
-                        Style="{StaticResource AddressStyle}"/>
-                    <Label
-                        Text="98122"   
-                        Style="{StaticResource AddressStyle}"/>
-                    <Label
-                        Text="United States"   
-                        Style="{StaticResource AddressStyle}"/>
                 </StackLayout>
             </Grid>
         </Grid>

src/Mobile/eShopOnContainers/eShopOnContainers.Core/Views/CatalogView.xaml

@@ -6,6 +6,7 @@
              xmlns:views="clr-namespace:eShopOnContainers.Core.Views;assembly=eShopOnContainers.Core"   
              xmlns:animations="clr-namespace:eShopOnContainers.Core.Animations;assembly=eShopOnContainers.Core"
              xmlns:triggers="clr-namespace:eShopOnContainers.Core.Triggers;assembly=eShopOnContainers.Core"
+             xmlns:behaviors="clr-namespace:eShopOnContainers.Core.Behaviors;assembly=eShopOnContainers.Core"      
              Title="Catalog">
     <ContentPage.Resources>
         <ResourceDictionary>
@@ -73,11 +74,16 @@
             x:Name="Products"
             Grid.Row="1"
             ItemsSource="{Binding Products}"
-            SelectedItem="{Binding Product, Mode=TwoWay}"
             HasUnevenRows="True"
             SeparatorVisibility="None"
             CachingStrategy="RecycleElement"
             Style="{StaticResource ProductsListStyle}">
+            <ListView.Behaviors>
+                <behaviors:EventToCommandBehavior                    
+                    EventName="ItemTapped"
+                    Command="{Binding AddCatalogItemCommand}"
+                    EventArgsConverter="{StaticResource ItemTappedEventArgsConverter}" />
+            </ListView.Behaviors>
             <ListView.ItemTemplate>
                 <DataTemplate>
                     <ViewCell>
@@ -86,5 +92,22 @@
                 </DataTemplate>
             </ListView.ItemTemplate>
         </ListView>
+        <!-- INDICATOR -->
+        <ActivityIndicator
+            Grid.Row="0"
+            Grid.RowSpan="2"
+            Color="{StaticResource LightGreenColor}"
+            IsRunning="{Binding IsBusy}"  
+            IsVisible="{Binding IsBusy}"
+            VerticalOptions="Center"
+            HorizontalOptions="Center">
+            <ActivityIndicator.WidthRequest>
+                <OnPlatform 
+                    x:TypeArguments="x:Double" 
+                    iOS="100" 
+                    Android="100"
+                    WinPhone="400" />
+            </ActivityIndicator.WidthRequest>
+        </ActivityIndicator>
     </Grid>
 </ContentPage>

src/Mobile/eShopOnContainers/eShopOnContainers.Core/Views/LoginView.xaml

@@ -146,7 +146,7 @@
         </Grid>
         <!-- INDICATOR -->
         <ActivityIndicator 
-            Color="{StaticResource AccentColor}"   
+            Color="{StaticResource LightGreenColor}"   
             IsRunning="{Binding IsBusy}" 
             IsVisible="{Binding IsBusy}"
             VerticalOptions="Center"

src/Mobile/eShopOnContainers/eShopOnContainers.Core/Views/MainView.xaml

@@ -29,7 +29,8 @@
     </views:ProfileView>
     <views:CartView
         x:Name="CartView"
-        controls:CustomTabbedPage.BadgeText="{Binding BadgeCount}">
+        controls:CustomTabbedPage.BadgeText="{Binding BadgeCount}"
+        controls:CustomTabbedPage.BadgeColor="{StaticResource LightGreenColor}">
         <views:CartView.Icon>
             <OnPlatform        
                 x:TypeArguments="FileImageSource"

src/Mobile/eShopOnContainers/eShopOnContainers.Core/Views/OrderDetailView.xaml

@@ -228,6 +228,23 @@
                         Style="{StaticResource OrderTotalStyle}"/>
                 </StackLayout>
             </Grid>
+            <!-- INDICATOR -->
+            <ActivityIndicator
+                Grid.Row="0"
+                Grid.RowSpan="3"
+                Color="{StaticResource LightGreenColor}"
+                IsRunning="{Binding IsBusy}"  
+                IsVisible="{Binding IsBusy}"
+                VerticalOptions="Center"
+                HorizontalOptions="Center">
+                <ActivityIndicator.WidthRequest>
+                    <OnPlatform 
+                        x:TypeArguments="x:Double" 
+                        iOS="100" 
+                        Android="100"
+                        WinPhone="400" />
+                </ActivityIndicator.WidthRequest>
+            </ActivityIndicator>
         </Grid>
     </ScrollView>
 </ContentPage>

src/Mobile/eShopOnContainers/eShopOnContainers.Core/Views/Templates/OrderItemTemplate.xaml

@@ -2,7 +2,8 @@
 <ContentView
     xmlns="http://xamarin.com/schemas/2014/forms"     
     xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"  
-    x:Class="eShopOnContainers.Core.Views.Templates.OrderItemTemplate">
+    x:Class="eShopOnContainers.Core.Views.Templates.OrderItemTemplate"    
+    xmlns:ffimageloading="clr-namespace:FFImageLoading.Forms;assembly=FFImageLoading.Forms">
     <ContentView.Resources>
         <ResourceDictionary>
 
@@ -55,7 +56,8 @@
         </ResourceDictionary>
     </ContentView.Resources>
     <ContentView.Content>
-        <Grid>
+        <Grid   
+            BackgroundColor="{StaticResource BackgroundColor}">
             <Grid.ColumnDefinitions>
                 <ColumnDefinition Width="Auto" />
                 <ColumnDefinition Width="*" />
@@ -64,10 +66,18 @@
                 <RowDefinition Height="*" />
                 <RowDefinition Height="1" />
             </Grid.RowDefinitions>
-            <Image
+            <ffimageloading:CachedImage
                 Grid.Column="0"
                 Grid.Row="0"
-                Source="{Binding Image}"/>
+                Source="{Binding ProductImage, Converter={StaticResource ImageConverter}}"        
+                CacheDuration="30"                      
+                CacheType="Disk"             
+                DownsampleToViewSize="True"
+                HeightRequest="108" 
+                WidthRequest="108"
+                Aspect="AspectFit"
+                VerticalOptions="Start"
+                Margin="12,0,0,0"/>
             <Grid
                 Grid.Column="1"
                 Grid.Row="0"

src/Mobile/eShopOnContainers/eShopOnContainers.Core/Views/Templates/ProductTemplate.xaml

@@ -71,7 +71,10 @@
             </Grid.RowDefinitions>
             <ffimageloading:CachedImage 
                 Grid.Row="0"
-                Source="{Binding Image}"
+                Source="{Binding PictureUri}"       
+                CacheDuration="30"                      
+                CacheType="Disk"             
+                DownsampleToViewSize="True"
                 Aspect="AspectFill"/>
             <Grid
                 Grid.Row="0"
@@ -86,7 +89,7 @@
                     <Image.Margin>
                         <OnPlatform        
                             x:TypeArguments="Thickness"
-                            Android="6, 12, 12, 12"
+                            Android="5, 12, 12, 12"
                             iOS="6, 12, 12, 12"
                             WinPhone="8, 12, 12, 12"/>
                     </Image.Margin>

src/Mobile/eShopOnContainers/eShopOnContainers.Core/eShopOnContainers.Core.csproj

@@ -47,6 +47,7 @@
     <Compile Include="Controls\BindablePicker.cs" />
     <Compile Include="Controls\CustomTabbedPage.cs" />
     <Compile Include="Converters\DatetimeConverter.cs" />
+    <Compile Include="Converters\ImageConverter.cs" />
     <Compile Include="Converters\ItemTappedConverter.cs" />
     <Compile Include="Converters\ToUpperConverter.cs" />
     <Compile Include="Effects\LineColorEffect.cs" />

src/Mobile/eShopOnContainers/eShopOnContainers.Droid/Properties/AndroidManifest.xml

@@ -1,5 +1,5 @@
 <?xml version="1.0" encoding="utf-8"?>
-<manifest xmlns:android="http://schemas.android.com/apk/res/android">
+<manifest xmlns:android="http://schemas.android.com/apk/res/android" android:installLocation="auto">
 	<uses-sdk android:minSdkVersion="15" />
-	<application android:label="eShopOnContainers.Droid"></application>
+	<application android:label="eShopOnContainers" android:icon="@drawable/icon"></application>
 </manifest>

src/Mobile/eShopOnContainers/eShopOnContainers.Droid/Renderers/BadgeView.cs

@@ -22,7 +22,7 @@ namespace eShopOnContainers.Droid.Renderers
         }
 
         private const int DefaultHmarginDip = -10;
-        private const int DefaultVmarginDip = -5;
+        private const int DefaultVmarginDip = 2;
         private const int DefaultLrPaddingDip = 4;
         private const int DefaultCornerRadiusDip = 7;
 

src/Mobile/eShopOnContainers/eShopOnContainers.Droid/Renderers/CustomTabbedPageRenderer.cs

@@ -76,15 +76,22 @@ namespace eShopOnContainers.Droid.Renderers
             Element.ChildRemoved += OnTabRemoved;
         }
 
-
         private void SetTab(TabLayout.Tab tab, string name)
         {
             try
             {
                 int id = Resources.GetIdentifier(name, "drawable", Context.PackageName);
-                tab.CustomView.FindViewById<ImageView>(Resource.Id.tab_icon).SetImageResource(id);
-                tab.SetCustomView(Resource.Layout.TabLayout);
                 tab.SetIcon(null);
+            
+                LinearLayout.LayoutParams linearLayoutParams = new LinearLayout.LayoutParams(LayoutParams.MatchParent, LayoutParams.MatchParent);
+                linearLayoutParams.SetMargins(0, -48, 0, 0);
+
+                ImageView img = new ImageView(Context);
+                img.LayoutParameters = linearLayoutParams;
+                img.SetPadding(0, 0, 0, 48);
+                img.SetImageResource(id);
+            
+                tab.SetCustomView(img);
             }
             catch (Exception ex)
             {

src/Mobile/eShopOnContainers/eShopOnContainers.Droid/Resources/Resource.Designer.cs

@@ -2021,304 +2021,307 @@ namespace eShopOnContainers.Droid
 			public const int abc_textfield_search_material = 2130837578;
 			
 			// aapt resource value: 0x7f02004b
-			public const int design_fab_background = 2130837579;
+			public const int background = 2130837579;
 			
 			// aapt resource value: 0x7f02004c
-			public const int design_snackbar_background = 2130837580;
+			public const int design_fab_background = 2130837580;
 			
 			// aapt resource value: 0x7f02004d
-			public const int fake_product_01 = 2130837581;
+			public const int design_snackbar_background = 2130837581;
 			
 			// aapt resource value: 0x7f02004e
-			public const int fake_product_02 = 2130837582;
+			public const int fake_product_01 = 2130837582;
 			
 			// aapt resource value: 0x7f02004f
-			public const int fake_product_03 = 2130837583;
+			public const int fake_product_02 = 2130837583;
 			
 			// aapt resource value: 0x7f020050
-			public const int ic_audiotrack = 2130837584;
+			public const int fake_product_03 = 2130837584;
 			
 			// aapt resource value: 0x7f020051
-			public const int ic_audiotrack_light = 2130837585;
+			public const int ic_audiotrack = 2130837585;
 			
 			// aapt resource value: 0x7f020052
-			public const int ic_bluetooth_grey = 2130837586;
+			public const int ic_audiotrack_light = 2130837586;
 			
 			// aapt resource value: 0x7f020053
-			public const int ic_bluetooth_white = 2130837587;
+			public const int ic_bluetooth_grey = 2130837587;
 			
 			// aapt resource value: 0x7f020054
-			public const int ic_cast_dark = 2130837588;
+			public const int ic_bluetooth_white = 2130837588;
 			
 			// aapt resource value: 0x7f020055
-			public const int ic_cast_disabled_light = 2130837589;
+			public const int ic_cast_dark = 2130837589;
 			
 			// aapt resource value: 0x7f020056
-			public const int ic_cast_grey = 2130837590;
+			public const int ic_cast_disabled_light = 2130837590;
 			
 			// aapt resource value: 0x7f020057
-			public const int ic_cast_light = 2130837591;
+			public const int ic_cast_grey = 2130837591;
 			
 			// aapt resource value: 0x7f020058
-			public const int ic_cast_off_light = 2130837592;
+			public const int ic_cast_light = 2130837592;
 			
 			// aapt resource value: 0x7f020059
-			public const int ic_cast_on_0_light = 2130837593;
+			public const int ic_cast_off_light = 2130837593;
 			
 			// aapt resource value: 0x7f02005a
-			public const int ic_cast_on_1_light = 2130837594;
+			public const int ic_cast_on_0_light = 2130837594;
 			
 			// aapt resource value: 0x7f02005b
-			public const int ic_cast_on_2_light = 2130837595;
+			public const int ic_cast_on_1_light = 2130837595;
 			
 			// aapt resource value: 0x7f02005c
-			public const int ic_cast_on_light = 2130837596;
+			public const int ic_cast_on_2_light = 2130837596;
 			
 			// aapt resource value: 0x7f02005d
-			public const int ic_cast_white = 2130837597;
+			public const int ic_cast_on_light = 2130837597;
 			
 			// aapt resource value: 0x7f02005e
-			public const int ic_close_dark = 2130837598;
+			public const int ic_cast_white = 2130837598;
 			
 			// aapt resource value: 0x7f02005f
-			public const int ic_close_light = 2130837599;
+			public const int ic_close_dark = 2130837599;
 			
 			// aapt resource value: 0x7f020060
-			public const int ic_collapse = 2130837600;
+			public const int ic_close_light = 2130837600;
 			
 			// aapt resource value: 0x7f020061
-			public const int ic_collapse_00000 = 2130837601;
+			public const int ic_collapse = 2130837601;
 			
 			// aapt resource value: 0x7f020062
-			public const int ic_collapse_00001 = 2130837602;
+			public const int ic_collapse_00000 = 2130837602;
 			
 			// aapt resource value: 0x7f020063
-			public const int ic_collapse_00002 = 2130837603;
+			public const int ic_collapse_00001 = 2130837603;
 			
 			// aapt resource value: 0x7f020064
-			public const int ic_collapse_00003 = 2130837604;
+			public const int ic_collapse_00002 = 2130837604;
 			
 			// aapt resource value: 0x7f020065
-			public const int ic_collapse_00004 = 2130837605;
+			public const int ic_collapse_00003 = 2130837605;
 			
 			// aapt resource value: 0x7f020066
-			public const int ic_collapse_00005 = 2130837606;
+			public const int ic_collapse_00004 = 2130837606;
 			
 			// aapt resource value: 0x7f020067
-			public const int ic_collapse_00006 = 2130837607;
+			public const int ic_collapse_00005 = 2130837607;
 			
 			// aapt resource value: 0x7f020068
-			public const int ic_collapse_00007 = 2130837608;
+			public const int ic_collapse_00006 = 2130837608;
 			
 			// aapt resource value: 0x7f020069
-			public const int ic_collapse_00008 = 2130837609;
+			public const int ic_collapse_00007 = 2130837609;
 			
 			// aapt resource value: 0x7f02006a
-			public const int ic_collapse_00009 = 2130837610;
+			public const int ic_collapse_00008 = 2130837610;
 			
 			// aapt resource value: 0x7f02006b
-			public const int ic_collapse_00010 = 2130837611;
+			public const int ic_collapse_00009 = 2130837611;
 			
 			// aapt resource value: 0x7f02006c
-			public const int ic_collapse_00011 = 2130837612;
+			public const int ic_collapse_00010 = 2130837612;
 			
 			// aapt resource value: 0x7f02006d
-			public const int ic_collapse_00012 = 2130837613;
+			public const int ic_collapse_00011 = 2130837613;
 			
 			// aapt resource value: 0x7f02006e
-			public const int ic_collapse_00013 = 2130837614;
+			public const int ic_collapse_00012 = 2130837614;
 			
 			// aapt resource value: 0x7f02006f
-			public const int ic_collapse_00014 = 2130837615;
+			public const int ic_collapse_00013 = 2130837615;
 			
 			// aapt resource value: 0x7f020070
-			public const int ic_collapse_00015 = 2130837616;
+			public const int ic_collapse_00014 = 2130837616;
 			
 			// aapt resource value: 0x7f020071
-			public const int ic_errorstatus = 2130837617;
+			public const int ic_collapse_00015 = 2130837617;
 			
 			// aapt resource value: 0x7f020072
-			public const int ic_expand = 2130837618;
+			public const int ic_errorstatus = 2130837618;
 			
 			// aapt resource value: 0x7f020073
-			public const int ic_expand_00000 = 2130837619;
+			public const int ic_expand = 2130837619;
 			
 			// aapt resource value: 0x7f020074
-			public const int ic_expand_00001 = 2130837620;
+			public const int ic_expand_00000 = 2130837620;
 			
 			// aapt resource value: 0x7f020075
-			public const int ic_expand_00002 = 2130837621;
+			public const int ic_expand_00001 = 2130837621;
 			
 			// aapt resource value: 0x7f020076
-			public const int ic_expand_00003 = 2130837622;
+			public const int ic_expand_00002 = 2130837622;
 			
 			// aapt resource value: 0x7f020077
-			public const int ic_expand_00004 = 2130837623;
+			public const int ic_expand_00003 = 2130837623;
 			
 			// aapt resource value: 0x7f020078
-			public const int ic_expand_00005 = 2130837624;
+			public const int ic_expand_00004 = 2130837624;
 			
 			// aapt resource value: 0x7f020079
-			public const int ic_expand_00006 = 2130837625;
+			public const int ic_expand_00005 = 2130837625;
 			
 			// aapt resource value: 0x7f02007a
-			public const int ic_expand_00007 = 2130837626;
+			public const int ic_expand_00006 = 2130837626;
 			
 			// aapt resource value: 0x7f02007b
-			public const int ic_expand_00008 = 2130837627;
+			public const int ic_expand_00007 = 2130837627;
 			
 			// aapt resource value: 0x7f02007c
-			public const int ic_expand_00009 = 2130837628;
+			public const int ic_expand_00008 = 2130837628;
 			
 			// aapt resource value: 0x7f02007d
-			public const int ic_expand_00010 = 2130837629;
+			public const int ic_expand_00009 = 2130837629;
 			
 			// aapt resource value: 0x7f02007e
-			public const int ic_expand_00011 = 2130837630;
+			public const int ic_expand_00010 = 2130837630;
 			
 			// aapt resource value: 0x7f02007f
-			public const int ic_expand_00012 = 2130837631;
+			public const int ic_expand_00011 = 2130837631;
 			
 			// aapt resource value: 0x7f020080
-			public const int ic_expand_00013 = 2130837632;
+			public const int ic_expand_00012 = 2130837632;
 			
 			// aapt resource value: 0x7f020081
-			public const int ic_expand_00014 = 2130837633;
+			public const int ic_expand_00013 = 2130837633;
 			
 			// aapt resource value: 0x7f020082
-			public const int ic_expand_00015 = 2130837634;
+			public const int ic_expand_00014 = 2130837634;
 			
 			// aapt resource value: 0x7f020083
-			public const int ic_media_pause = 2130837635;
+			public const int ic_expand_00015 = 2130837635;
 			
 			// aapt resource value: 0x7f020084
-			public const int ic_media_play = 2130837636;
+			public const int ic_media_pause = 2130837636;
 			
 			// aapt resource value: 0x7f020085
-			public const int ic_media_route_disabled_mono_dark = 2130837637;
+			public const int ic_media_play = 2130837637;
 			
 			// aapt resource value: 0x7f020086
-			public const int ic_media_route_off_mono_dark = 2130837638;
+			public const int ic_media_route_disabled_mono_dark = 2130837638;
 			
 			// aapt resource value: 0x7f020087
-			public const int ic_media_route_on_0_mono_dark = 2130837639;
+			public const int ic_media_route_off_mono_dark = 2130837639;
 			
 			// aapt resource value: 0x7f020088
-			public const int ic_media_route_on_1_mono_dark = 2130837640;
+			public const int ic_media_route_on_0_mono_dark = 2130837640;
 			
 			// aapt resource value: 0x7f020089
-			public const int ic_media_route_on_2_mono_dark = 2130837641;
+			public const int ic_media_route_on_1_mono_dark = 2130837641;
 			
 			// aapt resource value: 0x7f02008a
-			public const int ic_media_route_on_mono_dark = 2130837642;
+			public const int ic_media_route_on_2_mono_dark = 2130837642;
 			
 			// aapt resource value: 0x7f02008b
-			public const int ic_pause_dark = 2130837643;
+			public const int ic_media_route_on_mono_dark = 2130837643;
 			
 			// aapt resource value: 0x7f02008c
-			public const int ic_pause_light = 2130837644;
+			public const int ic_pause_dark = 2130837644;
 			
 			// aapt resource value: 0x7f02008d
-			public const int ic_play_dark = 2130837645;
+			public const int ic_pause_light = 2130837645;
 			
 			// aapt resource value: 0x7f02008e
-			public const int ic_play_light = 2130837646;
+			public const int ic_play_dark = 2130837646;
 			
 			// aapt resource value: 0x7f02008f
-			public const int ic_speaker_dark = 2130837647;
+			public const int ic_play_light = 2130837647;
 			
 			// aapt resource value: 0x7f020090
-			public const int ic_speaker_group_dark = 2130837648;
+			public const int ic_speaker_dark = 2130837648;
 			
 			// aapt resource value: 0x7f020091
-			public const int ic_speaker_group_light = 2130837649;
+			public const int ic_speaker_group_dark = 2130837649;
 			
 			// aapt resource value: 0x7f020092
-			public const int ic_speaker_light = 2130837650;
+			public const int ic_speaker_group_light = 2130837650;
 			
 			// aapt resource value: 0x7f020093
-			public const int ic_successstatus = 2130837651;
+			public const int ic_speaker_light = 2130837651;
 			
 			// aapt resource value: 0x7f020094
-			public const int ic_tv_dark = 2130837652;
+			public const int ic_successstatus = 2130837652;
 			
 			// aapt resource value: 0x7f020095
-			public const int ic_tv_light = 2130837653;
+			public const int ic_tv_dark = 2130837653;
 			
 			// aapt resource value: 0x7f020096
-			public const int icon = 2130837654;
+			public const int ic_tv_light = 2130837654;
 			
 			// aapt resource value: 0x7f020097
-			public const int menu_cart = 2130837655;
+			public const int icon = 2130837655;
 			
 			// aapt resource value: 0x7f020098
-			public const int menu_filter = 2130837656;
+			public const int menu_cart = 2130837656;
 			
 			// aapt resource value: 0x7f020099
-			public const int menu_profile = 2130837657;
+			public const int menu_filter = 2130837657;
 			
 			// aapt resource value: 0x7f02009a
-			public const int mr_dialog_material_background_dark = 2130837658;
+			public const int menu_profile = 2130837658;
 			
 			// aapt resource value: 0x7f02009b
-			public const int mr_dialog_material_background_light = 2130837659;
+			public const int mr_dialog_material_background_dark = 2130837659;
 			
 			// aapt resource value: 0x7f02009c
-			public const int mr_ic_audiotrack_light = 2130837660;
+			public const int mr_dialog_material_background_light = 2130837660;
 			
 			// aapt resource value: 0x7f02009d
-			public const int mr_ic_cast_dark = 2130837661;
+			public const int mr_ic_audiotrack_light = 2130837661;
 			
 			// aapt resource value: 0x7f02009e
-			public const int mr_ic_cast_light = 2130837662;
+			public const int mr_ic_cast_dark = 2130837662;
 			
 			// aapt resource value: 0x7f02009f
-			public const int mr_ic_close_dark = 2130837663;
+			public const int mr_ic_cast_light = 2130837663;
 			
 			// aapt resource value: 0x7f0200a0
-			public const int mr_ic_close_light = 2130837664;
+			public const int mr_ic_close_dark = 2130837664;
 			
 			// aapt resource value: 0x7f0200a1
-			public const int mr_ic_media_route_connecting_mono_dark = 2130837665;
+			public const int mr_ic_close_light = 2130837665;
 			
 			// aapt resource value: 0x7f0200a2
-			public const int mr_ic_media_route_connecting_mono_light = 2130837666;
+			public const int mr_ic_media_route_connecting_mono_dark = 2130837666;
 			
 			// aapt resource value: 0x7f0200a3
-			public const int mr_ic_media_route_mono_dark = 2130837667;
+			public const int mr_ic_media_route_connecting_mono_light = 2130837667;
 			
 			// aapt resource value: 0x7f0200a4
-			public const int mr_ic_media_route_mono_light = 2130837668;
+			public const int mr_ic_media_route_mono_dark = 2130837668;
 			
 			// aapt resource value: 0x7f0200a5
-			public const int mr_ic_pause_dark = 2130837669;
+			public const int mr_ic_media_route_mono_light = 2130837669;
 			
 			// aapt resource value: 0x7f0200a6
-			public const int mr_ic_pause_light = 2130837670;
+			public const int mr_ic_pause_dark = 2130837670;
 			
 			// aapt resource value: 0x7f0200a7
-			public const int mr_ic_play_dark = 2130837671;
+			public const int mr_ic_pause_light = 2130837671;
 			
 			// aapt resource value: 0x7f0200a8
-			public const int mr_ic_play_light = 2130837672;
+			public const int mr_ic_play_dark = 2130837672;
-			
-			// aapt resource value: 0x7f0200ae
-			public const int notification_template_icon_bg = 2130837678;
 			
 			// aapt resource value: 0x7f0200a9
-			public const int product_add = 2130837673;
+			public const int mr_ic_play_light = 2130837673;
+			
+			// aapt resource value: 0x7f0200af
+			public const int notification_template_icon_bg = 2130837679;
 			
 			// aapt resource value: 0x7f0200aa
-			public const int roundedbg = 2130837674;
+			public const int product_add = 2130837674;
 			
 			// aapt resource value: 0x7f0200ab
-			public const int roundedbgdark = 2130837675;
+			public const int roundedbg = 2130837675;
 			
 			// aapt resource value: 0x7f0200ac
-			public const int splash_drawable = 2130837676;
+			public const int roundedbgdark = 2130837676;
 			
 			// aapt resource value: 0x7f0200ad
-			public const int user_profile = 2130837677;
+			public const int splash_drawable = 2130837677;
+			
+			// aapt resource value: 0x7f0200ae
+			public const int user_profile = 2130837678;
 			
 			static Drawable()
 			{
@@ -2522,6 +2525,9 @@ namespace eShopOnContainers.Droid
 			// aapt resource value: 0x7f070098
 			public const int line3 = 2131165336;
 			
+			// aapt resource value: 0x7f07009c
+			public const int linearLayout_Home = 2131165340;
+			
 			// aapt resource value: 0x7f07000b
 			public const int listMode = 2131165195;
 			
@@ -2717,8 +2723,8 @@ namespace eShopOnContainers.Droid
 			// aapt resource value: 0x7f070013
 			public const int showTitle = 2131165203;
 			
-			// aapt resource value: 0x7f07009d
+			// aapt resource value: 0x7f07009f
-			public const int sliding_tabs = 2131165341;
+			public const int sliding_tabs = 2131165343;
 			
 			// aapt resource value: 0x7f07006c
 			public const int snackbar_action = 2131165292;
@@ -2756,8 +2762,11 @@ namespace eShopOnContainers.Droid
 			// aapt resource value: 0x7f07000d
 			public const int tabMode = 2131165197;
 			
-			// aapt resource value: 0x7f07009c
+			// aapt resource value: 0x7f07009d
-			public const int tab_icon = 2131165340;
+			public const int tab_icon = 2131165341;
+			
+			// aapt resource value: 0x7f07009e
+			public const int tab_layout_textview = 2131165342;
 			
 			// aapt resource value: 0x7f070099
 			public const int text = 2131165337;
@@ -2780,8 +2789,8 @@ namespace eShopOnContainers.Droid
 			// aapt resource value: 0x7f070048
 			public const int title_template = 2131165256;
 			
-			// aapt resource value: 0x7f07009e
+			// aapt resource value: 0x7f0700a0
-			public const int toolbar = 2131165342;
+			public const int toolbar = 2131165344;
 			
 			// aapt resource value: 0x7f070032
 			public const int top = 2131165234;

src/Mobile/eShopOnContainers/eShopOnContainers.Droid/Resources/layout/TabLayout.axml

@@ -1,14 +1,28 @@
 <?xml version="1.0" encoding="utf-8"?>
-<RelativeLayout 
+<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
-  xmlns:android="http://schemas.android.com/apk/res/android"
+    android:orientation="vertical"
-  android:layout_width="wrap_content"
+    android:layout_weight="25"
-  android:layout_height="wrap_content"
+    android:layout_width="0dp"
-  android:gravity="center">
-  <ImageView
-      android:id="@+id/tab_icon" 
-      android:layout_width="match_parent"
     android:layout_height="match_parent"
-      android:scaleType="center"
+    android:id="@+id/linearLayout_Home"
-      android:layout_centerHorizontal="true"
+
-      android:background="@android:color/transparent" />
+    android:weightSum="100"
-</RelativeLayout>
+    android:clickable="true"
+    android:focusable="true"
+    android:focusableInTouchMode="true">
+  <ImageView
+      android:src="@drawable/icon"
+      android:layout_width="match_parent"
+      android:layout_height="0dp"
+      android:layout_weight="70"
+      android:id="@+id/tab_icon" 
+      android:scaleType="fitCenter"
+      android:adjustViewBounds="false" />
+  <TextView
+      android:gravity="center_horizontal"
+      android:text="Home"
+      android:layout_width="match_parent"
+      android:layout_height="0dp"
+      android:layout_weight="30"
+      android:id="@+id/tab_layout_textview" />
+</LinearLayout>

src/Mobile/eShopOnContainers/eShopOnContainers.Droid/Resources/values/styles.xml

@@ -21,8 +21,8 @@
     <!-- You can also set colorControlNormal, colorControlActivated
          colorControlHighlight and colorSwitchThumbNormal. -->
     <item name="windowActionModeOverlay">true</item>
-
     <item name="android:datePickerDialogTheme">@style/AppCompatDialogStyle</item>
+    <item name="android:windowBackground">@drawable/background</item>
   </style>
 
   <style name="Theme.Splash" parent="Theme.AppCompat.Light.NoActionBar">

src/Mobile/eShopOnContainers/eShopOnContainers.Droid/app.config

@@ -1,18 +1,22 @@
-<?xml version="1.0" encoding="utf-8"?>
+<?xml version="1.0" encoding="utf-8"?>
 <configuration>
 	<runtime>
 		<assemblyBinding xmlns="urn:schemas-microsoft-com:asm.v1">
 			<dependentAssembly>
-				<assemblyIdentity name="System.ObjectModel" publicKeyToken="B03F5F7F11D50A3A" culture="neutral" />
+				<assemblyIdentity name="System.Net.Http" publicKeyToken="B03F5F7F11D50A3A" culture="neutral"/>
-				<bindingRedirect oldVersion="0.0.0.0-4.0.10.0" newVersion="4.0.10.0" />
+				<bindingRedirect oldVersion="0.0.0.0-4.0.0.0" newVersion="4.0.0.0"/>
 			</dependentAssembly>
 			<dependentAssembly>
-				<assemblyIdentity name="System.Runtime" publicKeyToken="B03F5F7F11D50A3A" culture="neutral" />
+				<assemblyIdentity name="System.ObjectModel" publicKeyToken="B03F5F7F11D50A3A" culture="neutral"/>
-				<bindingRedirect oldVersion="0.0.0.0-4.1.0.0" newVersion="4.1.0.0" />
+				<bindingRedirect oldVersion="0.0.0.0-4.0.10.0" newVersion="4.0.10.0"/>
 			</dependentAssembly>
 			<dependentAssembly>
-				<assemblyIdentity name="Newtonsoft.Json" publicKeyToken="30ad4fe6b2a6aeed" culture="neutral" />
+				<assemblyIdentity name="System.Runtime" publicKeyToken="B03F5F7F11D50A3A" culture="neutral"/>
-				<bindingRedirect oldVersion="0.0.0.0-8.0.0.0" newVersion="8.0.0.0" />
+				<bindingRedirect oldVersion="0.0.0.0-4.1.0.0" newVersion="4.1.0.0"/>
+			</dependentAssembly>
+			<dependentAssembly>
+				<assemblyIdentity name="Newtonsoft.Json" publicKeyToken="30ad4fe6b2a6aeed" culture="neutral"/>
+				<bindingRedirect oldVersion="0.0.0.0-8.0.0.0" newVersion="8.0.0.0"/>
 			</dependentAssembly>
 		</assemblyBinding>
 	</runtime>

src/Mobile/eShopOnContainers/eShopOnContainers.Droid/eShopOnContainers.Droid.csproj

@@ -307,6 +307,21 @@
   <ItemGroup>
     <AndroidResource Include="Resources\drawable-xxxhdpi\menu_cart.png" />
   </ItemGroup>
+  <ItemGroup>
+    <AndroidResource Include="Resources\drawable-xxxhdpi\icon.png" />
+  </ItemGroup>
+  <ItemGroup>
+    <AndroidResource Include="Resources\drawable-hdpi\background.png" />
+  </ItemGroup>
+  <ItemGroup>
+    <AndroidResource Include="Resources\drawable-xhdpi\background.png" />
+  </ItemGroup>
+  <ItemGroup>
+    <AndroidResource Include="Resources\drawable-xxhdpi\background.png" />
+  </ItemGroup>
+  <ItemGroup>
+    <AndroidResource Include="Resources\drawable-xxxhdpi\background.png" />
+  </ItemGroup>
   <Import Project="$(MSBuildExtensionsPath)\Xamarin\Android\Xamarin.Android.CSharp.targets" />
   <Import Project="..\..\packages\Xamarin.Android.Support.Vector.Drawable.23.3.0\build\Xamarin.Android.Support.Vector.Drawable.targets" Condition="Exists('..\..\packages\Xamarin.Android.Support.Vector.Drawable.23.3.0\build\Xamarin.Android.Support.Vector.Drawable.targets')" />
   <Target Name="EnsureNuGetPackageBuildImports" BeforeTargets="PrepareForBuild">