Implementacion de collectionview

VisualChallenge/VisualChallenge/Models/PokemonDto.cs

@@ -0,0 +1,22 @@
+using Newtonsoft.Json;
+using System;
+using System.Collections.Generic;
+using System.Text;
+
+namespace VisualChallenge.Models
+{
+    public class PokemonDto
+    {
+        public int count { get; set; }
+        public object next { get; set; }
+        public object previous { get; set; }
+        [JsonProperty(PropertyName = "results")]
+        public List<PokemonDetalleDto> PokemonDetalleDto { get; set; }
+
+    }
+    public class PokemonDetalleDto
+    {
+        public string name { get; set; }
+        public string url { get; set; }
+    }
+}

VisualChallenge/VisualChallenge/Services/IPokemonServices.cs

@@ -0,0 +1,15 @@
+using Refit;
+using System;
+using System.Collections.Generic;
+using System.Net.Http;
+using System.Text;
+using System.Threading.Tasks;
+
+namespace VisualChallenge.Services
+{
+    public interface IPokemonServices
+    {
+        [Get("/pokemon-form/?limit=151&offset=0")]
+        Task<HttpResponseMessage> GetListPokemon();
+    }
+}

VisualChallenge/VisualChallenge/View/CollectionView.xaml

@@ -0,0 +1,44 @@
+<?xml version="1.0" encoding="utf-8" ?>
+<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
+             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
+             x:Class="VisualChallenge.View.CollectionViewPage">
+
+    <ContentPage.Content>
+        <StackLayout>
+            <Frame>
+                <Label Text="Demo Pokemon" FontSize="Large" HorizontalOptions="CenterAndExpand"  TextColor="Chocolate"/>
+            </Frame>
+            <CollectionView ItemsSource="{Binding PokemonList}" x:Name="listPage">
+                <CollectionView.ItemTemplate>
+                    <DataTemplate>
+                        <Grid Padding="10">
+                            <Grid.RowDefinitions>
+                                <RowDefinition Height="Auto" />
+                                <RowDefinition Height="Auto" />
+                            </Grid.RowDefinitions>
+                            <Grid.ColumnDefinitions>
+                                <ColumnDefinition Width="Auto" />
+                                <ColumnDefinition Width="Auto" />
+                            </Grid.ColumnDefinitions>
+                            <Image Grid.RowSpan="2"
+                       Source="{Binding ImageUrl}"
+                       Aspect="AspectFill"
+                       HeightRequest="60"
+                       WidthRequest="60" />
+                            <Label Grid.Column="1"
+                       Text="{Binding name}"
+                       FontAttributes="Bold" />
+                            <Label Grid.Row="1"
+                       Grid.Column="1"
+                       Text="{Binding url}"
+                       FontAttributes="Italic"
+                       VerticalOptions="End" />
+                        </Grid>
+                    </DataTemplate>
+                </CollectionView.ItemTemplate>
+            </CollectionView>
+
+        </StackLayout>
+    </ContentPage.Content>
+</ContentPage>
+

VisualChallenge/VisualChallenge/View/CollectionView.xaml.cs

@@ -0,0 +1,59 @@
+using Newtonsoft.Json;
+using System;
+using System.Collections.ObjectModel;
+using System.ComponentModel;
+using System.Diagnostics;
+using System.Linq;
+using System.Net;
+using System.Threading.Tasks;
+using VisualChallenge.Models;
+using VisualChallenge.Services;
+using Xamarin.Forms;
+using Xamarin.Forms.Xaml;
+
+namespace VisualChallenge.View
+{
+    [XamlCompilation(XamlCompilationOptions.Compile)]
+    public partial class CollectionViewPage : ContentPage
+    {
+        public ObservableCollection<PokemonDetalleDto> PokemonList { get; set; }
+
+        public CollectionViewPage()
+        {
+            InitializeComponent();
+            GetPokemons();
+        }
+
+        private void GetPokemons()
+        {
+            try
+            {
+                var pokemonServices = Refit.RestService.For<IPokemonServices>("https://pokeapi.co/api/v2/");
+
+                var response = pokemonServices.GetListPokemon().Result;
+
+                if (response.StatusCode.Equals(HttpStatusCode.OK))
+                {
+                    var jsonString = response.Content.ReadAsStringAsync().Result;
+                    var lis = JsonConvert.DeserializeObject<PokemonDto>(jsonString);
+                    PokemonList = new ObservableCollection<PokemonDetalleDto>(lis.PokemonDetalleDto.ToList());
+                    listPage.ItemsSource = PokemonList;
+                }
+            }
+            catch ( Exception ex) {
+                Debug.Write("Error");
+            }
+        }
+
+        async void Handle_ItemTapped(object sender, ItemTappedEventArgs e)
+        {
+            if (e.Item == null)
+                return;
+
+            await DisplayAlert("Item Tapped", "An item was tapped.", "OK");
+
+            //Deselect Item
+            ((ListView)sender).SelectedItem = null;
+        }
+    }
+}

VisualChallenge/VisualChallenge/VisualChallenge.csproj

@@ -11,6 +11,7 @@
   </PropertyGroup>
 
   <ItemGroup>
+    <PackageReference Include="Refit" Version="4.6.107" />
     <PackageReference Include="Xamarin.Forms" Version="4.0.0.293082-pre8" />
     <PackageReference Include="Xamarin.Forms.Visual.Material" Version="4.0.0.293082-pre8" />  
   </ItemGroup>
@@ -20,4 +21,25 @@
       <DependentUpon>VisualChallengePage.xaml</DependentUpon>
     </Compile>
   </ItemGroup>
+
+  <ItemGroup>
+    <EmbeddedResource Update="View\CollectionView.xaml">
+      <Generator>MSBuild:UpdateDesignTimeXaml</Generator>
+    </EmbeddedResource>
+  </ItemGroup>
+
+  <ItemGroup>
+    <None Update="App.xaml">
+      <Generator>MSBuild:Compile</Generator>
+    </None>
+    <None Update="AppShell.xaml">
+      <Generator>MSBuild:Compile</Generator>
+    </None>
+    <None Update="View\CollectionView.xaml">
+      <Generator>MSBuild:Compile</Generator>
+    </None>
+    <None Update="VisualChallengePage.xaml">
+      <Generator>MSBuild:Compile</Generator>
+    </None>
+  </ItemGroup>
 </Project>

VisualChallenge/VisualChallenge/VisualChallengePage.xaml

@@ -17,7 +17,7 @@
 			<Label Text="Start Here" FontSize="24" HorizontalTextAlignment="Center"/>
 
 			<Button Text="Read More About Visual" Clicked="Button_Clicked" />
-
-		</FlexLayout>
+            <Button Text="Navigate" Clicked="Navigated_Clicked"/>
+        </FlexLayout>
 	</ScrollView>
 </ContentPage>

VisualChallenge/VisualChallenge/VisualChallengePage.xaml.cs

@@ -1,5 +1,5 @@
 using System;
-
+using VisualChallenge.View;
 using Xamarin.Forms;
 using Xamarin.Forms.Xaml;
 
@@ -16,5 +16,12 @@ private void Button_Clicked(object sender, EventArgs e)
         {
             Device.OpenUri(new Uri("https://docs.microsoft.com/en-us/xamarin/xamarin-forms/user-interface/visual"));
         }
+
+        private async void Navigated_Clicked(object sender, EventArgs e)
+        {
+            var nextPage = new CollectionViewPage();
+
+            await this.Navigation.PushAsync(nextPage);
+        }
     }
 }