Add ListViewImageCell example to Cells documenation

[LanceMcCarthy]

Currently we only have ListViewTextCell and ListViewTemplateCell in the cells documentation.

We should add examples and descriptions of all the cell types.

[LanceMcCarthy]

I've created all the assets to facilitate this addition in the SDK Samples Browser. Download ZIP folder with files from here, contents are listed below.

All other supporting assets are in PullRequest #106

The new code snippet IDs are as follows, which are included in the doc update:

• listview-celltypes-imagecell-viewmodel
• listview-celltypes-imagecell-listview-xaml
• listview-celltypes-imagecell-listview-code

To update the SDK Examples app:

1 - Add a new folder, named ImageCell, to SDKBrowser (Portable) > Examples > ListView > CellTypes. For clarification, here's a screenshot of the added folder.

• Updated Examples.xml file (new additions see from Line 388 to 397), which has the following additions:

<Example>
    <PageName>ListViewImageCellXaml</PageName>
    <Title>ImageCell - Xaml</Title>
    <GroupName>Cell Types</GroupName>
</Example>
<Example>
    <PageName>ListViewImageCellCSharp</PageName>
    <Title>ImageCell - Code</Title>
    <GroupName>Cell Types</GroupName>
</Example>

• ViewModel.cs

namespace SDKBrowser.Examples.ListView.CellTypes.ImageCell
{
    // >> listview-celltypes-imagecell-viewmodel
    public class PhotoItem
    {
        public string PhotoUrl { get; set; }
    }

    public class ViewModel
    {
        public ViewModel()
        {
            Photos = Enumerable.Range(1, 20).Select(i => new PhotoItem
            {
                PhotoUrl = "http://lorempixel.com/640/480/nature"
            }).ToList();
        }

        public List<PhotoItem> Photos { get; set; } 

    }
    // << listview-celltypes-imagecell-viewmodel
}

• ListViewImageCellXaml.xaml

<?xml version="1.0" encoding="UTF-8"?>
<ContentPage xmlns:local="clr-namespace:SDKBrowser.Examples.ListView.CellTypes.ImageCell" xmlns:telerikDataControls="clr-namespace:Telerik.XamarinForms.DataControls;assembly=Telerik.XamarinForms.DataControls" xmlns:telerikListView="clr-namespace:Telerik.XamarinForms.DataControls.ListView;assembly=Telerik.XamarinForms.DataControls" xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" x:Class="SDKBrowser.Examples.ListView.ListViewImageCellXaml">

    <!-- >> listview-celltypes-imagecell-listview-xaml -->
    <telerikDataControls:RadListView ItemsSource="{Binding Photos}" BackgroundColor="White" x:Name="listView">
        <telerikDataControls:RadListView.BindingContext>
        <local:ViewModel />
        </telerikDataControls:RadListView.BindingContext>
    <telerikDataControls:RadListView.ItemTemplate>
        <DataTemplate>
                <telerikListView:ListViewImageCell ImageSource="{Binding PhotoUrl}"
                                                   Text="{Binding Title}" 
                                                   TextColor="White" 
                                                   Detail="{Binding Description}" 
                                                   DetailColor="DarkGray" />
        </DataTemplate>
    </telerikDataControls:RadListView.ItemTemplate>
        <telerikDataControls:RadListView.LayoutDefinition>
            <telerikListView:ListViewLinearLayout ItemLength="640" VerticalItemSpacing="5"/>
        </telerikDataControls:RadListView.LayoutDefinition>
    </telerikDataControls:RadListView>
    <!-- << listview-celltypes-imagecell-listview-xaml -->
</ContentPage>

• ListViewImageCellCSharp.cs

namespace SDKBrowser.Examples.ListView
{
    public class ListViewImageCellCSharp : ContentPage
    {
        public ListViewImageCellCSharp()
        {
            // >> listview-celltypes-imagecell-listview-code
            var listView = new RadListView
            {
                BackgroundColor = Color.White,
                ItemsSource = new ViewModel().Photos,
                ItemTemplate = new DataTemplate(() =>
                {
                    var imageCell = new ListViewImageCell();
                    imageCell.SetBinding(ListViewImageCell.ImageSourceProperty, new Binding(nameof(PhotoItem.PhotoUrl)));
                    return imageCell;
                }),
            };
            // << listview-celltypes-imagecell-listview-code

            Content = listView;
        }
    }
}

Important Notes:

-Needs iOS and UWP screenshot I could only get an android screenshot as I had trouble deploying the SDKSamples Browser to the Mac and the UWP project's csproj wasn't loading right.

[LanceMcCarthy]

Closing this and removing the PR as we're trying not to make this public. We'd rather they use TemplateCell with an Image or CachedImage