Rick And Morthy App List Characters

CarouselViewChallenge/CarouselViewChallenge.Android/CarouselViewChallenge.Android.csproj

@@ -56,6 +56,9 @@
     <PackageReference Include="Xamarin.Forms" Version="4.3.0.778476-pre1" />
     <PackageReference Include="Xamarin.Android.Support.Core.Utils" Version="28.0.0.1" />
     <PackageReference Include="Xamarin.Essentials" Version="1.1.0" />
+    <PackageReference Include="Xamarin.Forms.PancakeView">
+      <Version>1.2.1</Version>
+    </PackageReference>
   </ItemGroup>
   <ItemGroup>
     <Compile Include="MainActivity.cs" />

CarouselViewChallenge/CarouselViewChallenge.iOS/CarouselViewChallenge.iOS.csproj

@@ -131,6 +131,9 @@
   <ItemGroup>
     <PackageReference Include="Xamarin.Forms" Version="4.3.0.778476-pre1" />
     <PackageReference Include="Xamarin.Essentials" Version="1.1.0" />
+    <PackageReference Include="Xamarin.Forms.PancakeView">
+      <Version>1.2.1</Version>
+    </PackageReference>
   </ItemGroup>
   <Import Project="$(MSBuildExtensionsPath)\Xamarin\iOS\Xamarin.iOS.CSharp.targets" />
   <ItemGroup>

CarouselViewChallenge/CarouselViewChallenge/CarouselViewChallenge.csproj

@@ -1,4 +1,4 @@
-<Project Sdk="Microsoft.NET.Sdk">
+<Project Sdk="Microsoft.NET.Sdk">
 
   <PropertyGroup>
     <TargetFramework>netstandard2.0</TargetFramework>
@@ -7,11 +7,8 @@
 
   <ItemGroup>
     <PackageReference Include="Xamarin.Forms" Version="4.3.0.778476-pre1" />  
-    <PackageReference Include="Xamarin.Essentials" Version="1.1.0" />
-  </ItemGroup>
-
-  <ItemGroup>
-    <Folder Include="Models\" />
+    <PackageReference Include="Xamarin.Essentials" Version="1.1.0" />  
+    <PackageReference Include="Xamarin.Forms.PancakeView" Version="1.2.1" />
   </ItemGroup>
 
   <ItemGroup>

CarouselViewChallenge/CarouselViewChallenge/Models/Character.cs

@@ -0,0 +1,12 @@
+namespace CarouselViewChallenge.Models
+{
+    public class Character
+    {
+        public int id { get; set; }
+        public string name { get; set; }
+        public string status { get; set; }
+        public string species { get; set; }
+        public string gender { get; set; }
+        public string image { get; set; }
+    }
+}

CarouselViewChallenge/CarouselViewChallenge/Services/IService.cs

@@ -0,0 +1,11 @@
+using System;
+using System.Collections.Generic;
+using System.Text;
+
+namespace CarouselViewChallenge.Services
+{
+    public interface IService
+    {
+
+    }
+}

CarouselViewChallenge/CarouselViewChallenge/ViewModels/RickAndMorthyViewModel.cs

@@ -0,0 +1,37 @@
+using System;
+using System.Collections.Generic;
+using System.Collections.ObjectModel;
+using System.ComponentModel;
+using System.Text;
+using CarouselViewChallenge.Models;
+
+namespace CarouselViewChallenge.ViewModels
+{
+    public class RickAndMorthyViewModel : INotifyPropertyChanged
+    {
+        public event PropertyChangedEventHandler PropertyChanged;
+
+        private ObservableCollection<Character> _characters;
+
+        public ObservableCollection<Character> Characters
+        {
+            get
+            {
+                return _characters;
+            }
+            set
+            {
+                if (_characters != value)
+                {
+                    _characters = value;
+                    OnPropertyChanged(new PropertyChangedEventArgs("Characters"));
+                }
+            }
+        }
+
+        private void OnPropertyChanged(PropertyChangedEventArgs eventArgs)
+        {
+            PropertyChanged?.Invoke(this, eventArgs);
+        }
+    }
+}

CarouselViewChallenge/CarouselViewChallenge/Views/CarouselViewChallengePage.xaml

@@ -4,10 +4,40 @@
              xmlns:d="http://xamarin.com/schemas/2014/forms/design"
              xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
              mc:Ignorable="d"
-             x:Class="CarouselViewChallenge.Views.CarouselViewChallengePage">
-    <ContentPage.Content>
-        <StackLayout BackgroundColor="#cfd8dc">
-            <Label Text="You can use this page for the CarouselView Challenge!" HorizontalOptions="Center" VerticalOptions="CenterAndExpand"/>
-        </StackLayout>
-    </ContentPage.Content>
+             x:Class="CarouselViewChallenge.Views.CarouselViewChallengePage"
+             xmlns:vm="clr-namespace:CarouselViewChallenge.ViewModels"
+             xmlns:yummy="clr-namespace:Xamarin.Forms.PancakeView;assembly=Xamarin.Forms.PancakeView"
+             Title="{Binding Title}">
+    <StackLayout HorizontalOptions="Center" BackgroundColor="#000" VerticalOptions="Center" >
+        <Label Text="Rick And Morty" TextColor="#3cd500" TextDecorations="Underline" FontAttributes="Bold" VerticalTextAlignment="Center" FontSize="48" HorizontalOptions="Center" VerticalOptions="Center"  />
+        <CarouselView ItemsSource="{Binding Characters}" >
+            <CarouselView.ItemTemplate>
+                <DataTemplate>
+                    <StackLayout>
+                        <yummy:PancakeView BackgroundColor="#fff720" CornerRadius="90,90,0,0" IsClippedToBounds="true" HorizontalOptions="FillAndExpand">
+                            <ScrollView>
+                                <StackLayout>
+                                    <Image Source="{Binding image}" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand" Aspect="AspectFill" HeightRequest="300" />
+                                    <Label TextColor="#000" Text="{Binding name}" FontSize="36" FontAttributes="Bold" TextDecorations="Underline" 
+                                   HorizontalTextAlignment="Center"/>
+                                    <Label TextColor="Gray"  Text="Status" FontSize="14" TextDecorations="Underline" FontAttributes="Bold" 
+                                   HorizontalTextAlignment="Center"/>
+                                    <Label TextColor="#000" Text="{Binding status}" FontSize="20" FontAttributes="Bold" 
+                                   HorizontalTextAlignment="Center"/>
+                                    <Label TextColor="Gray" Text="Species" FontSize="14" TextDecorations="Underline" FontAttributes="Bold" 
+                                   HorizontalTextAlignment="Center"/>
+                                    <Label TextColor="#000" Text="{Binding species}" FontSize="20" FontAttributes="Bold" 
+                                   HorizontalTextAlignment="Center"/>
+                                    <Label TextColor="Gray" Text="Gender" FontSize="14" TextDecorations="Underline" FontAttributes="Bold" 
+                                   HorizontalTextAlignment="Center"/>
+                                    <Label TextColor="#000" Text="{Binding gender}" FontSize="20" FontAttributes="Bold" 
+                                   HorizontalTextAlignment="Center"/>
+                                </StackLayout>
+                            </ScrollView>
+                        </yummy:PancakeView>
+                    </StackLayout>
+                </DataTemplate>
+            </CarouselView.ItemTemplate>
+        </CarouselView>
+    </StackLayout>
 </ContentPage>

CarouselViewChallenge/CarouselViewChallenge/Views/CarouselViewChallengePage.xaml.cs

@@ -1,5 +1,8 @@
-using System;
+using CarouselViewChallenge.Models;
+using CarouselViewChallenge.ViewModels;
+using System;
 using System.Collections.Generic;
+using System.Collections.ObjectModel;
 using System.Linq;
 using System.Text;
 using System.Threading.Tasks;
@@ -12,9 +15,60 @@ namespace CarouselViewChallenge.Views
     [XamlCompilation(XamlCompilationOptions.Compile)]
     public partial class CarouselViewChallengePage : ContentPage
     {
+        public RickAndMorthyViewModel VM { get; set; }
         public CarouselViewChallengePage()
         {
+
             InitializeComponent();
+            VM = new RickAndMorthyViewModel();
+
+            VM.Characters = new ObservableCollection<Character>
+            {
+                new Character
+                {
+                    image = "https://rickandmortyapi.com/api/character/avatar/1.jpeg",
+                    name = "Rick Sanchez",
+                    species = "Human",
+                    status = "Alive",
+                    gender = "Male"
+                },
+                new Character
+                {
+                    image = "https://rickandmortyapi.com/api/character/avatar/2.jpeg",
+                    name = "Morty Smith",
+                    species = "Human",
+                    status = "Alive",
+                    gender = "Male"
+                },
+                new Character
+                {
+                    image = "https://rickandmortyapi.com/api/character/avatar/212.jpeg",
+                    name = "Magma-Q",
+                    species = "Alien, Alphabetrian",
+                    status = "Dead",
+                    gender = "Male"
+                },
+                new Character
+                {
+                    image = "https://rickandmortyapi.com/api/character/avatar/4.jpeg",
+                    name = "Beth Smith",
+                    species = "Human",
+                    status = "Alive",
+                    gender = "Female"
+                },
+                new Character
+                {
+                    image = "https://rickandmortyapi.com/api/character/avatar/376.jpeg",
+                    name = "Veronica Ann Bennet",
+                    species = "Alien, Gazorpian",
+                    status = "Alive",
+                    gender = "Female"
+                }
+
+
+            };
+            BindingContext = VM;
+
         }
     }
 }