CollectionViewChallenge - Cloned Listen by Mockplus

CollectionViewChallenge/CollectionViewChallenge.Android/CollectionViewChallenge.Android.csproj

@@ -31,6 +31,10 @@
     <ErrorReport>prompt</ErrorReport>
     <WarningLevel>4</WarningLevel>
     <AndroidLinkMode>None</AndroidLinkMode>
+    <AotAssemblies>false</AotAssemblies>
+    <EnableLLVM>false</EnableLLVM>
+    <BundleAssemblies>false</BundleAssemblies>
+    <MandroidI18n />
   </PropertyGroup>
   <PropertyGroup Condition=" '$(Configuration)|$(Platform)' == 'Release|AnyCPU' ">
     <DebugSymbols>true</DebugSymbols>
@@ -106,5 +110,35 @@
       <Name>CollectionViewChallenge</Name>
     </ProjectReference>
   </ItemGroup>
+  <ItemGroup>
+    <AndroidResource Include="Resources\drawable\play.png" />
+  </ItemGroup>
+  <ItemGroup>
+    <AndroidResource Include="Resources\drawable\prev.png" />
+  </ItemGroup>
+  <ItemGroup>
+    <AndroidResource Include="Resources\drawable\bluebg.png" />
+  </ItemGroup>
+  <ItemGroup>
+    <AndroidResource Include="Resources\drawable\fav.png" />
+  </ItemGroup>
+  <ItemGroup>
+    <AndroidResource Include="Resources\drawable\Heathens.jpg" />
+  </ItemGroup>
+  <ItemGroup>
+    <AndroidResource Include="Resources\drawable\jazz.jpg" />
+  </ItemGroup>
+  <ItemGroup>
+    <AndroidResource Include="Resources\drawable\list.png" />
+  </ItemGroup>
+  <ItemGroup>
+    <AndroidResource Include="Resources\drawable\MadOverYou.jpeg" />
+  </ItemGroup>
+  <ItemGroup>
+    <AndroidResource Include="Resources\drawable\next.png" />
+  </ItemGroup>
+  <ItemGroup>
+    <AndroidResource Include="Resources\drawable\pause.png" />
+  </ItemGroup>
   <Import Project="$(MSBuildExtensionsPath)\Xamarin\Android\Xamarin.Android.CSharp.targets" />
 </Project>

CollectionViewChallenge/CollectionViewChallenge/App.xaml.cs

@@ -12,7 +12,7 @@ public App()
         {
             InitializeComponent();
 
-            MainPage = new AppShell();
+            MainPage = new CollectionViewChallengePage();
         }
 
         protected override void OnStart()

CollectionViewChallenge/CollectionViewChallenge/CollectionViewChallenge.csproj

@@ -22,7 +22,6 @@
   </ItemGroup>
 
   <ItemGroup>
-    <Folder Include="Models\" />
     <Folder Include="ViewModels\" />
   </ItemGroup>
 </Project>

CollectionViewChallenge/CollectionViewChallenge/Models/Song.cs

@@ -0,0 +1,13 @@
+using System;
+using System.Collections.Generic;
+using System.Text;
+
+namespace CollectionViewChallenge.Models
+{
+    public class Song
+    {
+        public string CoverImage { get; set; }
+
+        public string Lyrics { get; set; }
+    }
+}

CollectionViewChallenge/CollectionViewChallenge/Views/CollectionViewChallengePage.xaml

@@ -4,29 +4,56 @@
              xmlns:d="http://xamarin.com/schemas/2014/forms/design"
              xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
              mc:Ignorable="d"
-             x:Class="CollectionViewChallenge.Views.CollectionViewChallengePage">
+             x:Class="CollectionViewChallenge.Views.CollectionViewChallengePage"
+             BackgroundImage="bluebg.png">
     <ContentPage.Content>
         <StackLayout>
-            <!-- Use your own layout and functionality here! -->
-            <CollectionView>
-                <CollectionView.ItemsSource>
-                    <x:Array Type="{x:Type x:String}">
-                        <x:String>This is a CollectionView!</x:String>
-                        <x:String>Your feedback on the experience of converting a ListView to a CollectionView is incredibly appreciated.</x:String>
-                        <x:String>Here are three general questions:</x:String>
-                        <x:String>1. How was the experience of converting your existing ListView to a CollectionView?</x:String>
-                        <x:String>2. How is the performance compared to the ListView?</x:String>
-                        <x:String>3. Is there a specific piece of functionality that you'd like to see?</x:String>
-                    </x:Array>
-                </CollectionView.ItemsSource>
+            <CollectionView x:Name="cv_Songs"
+                  HorizontalOptions="Center"
+                  VerticalOptions="Start" 
+                  ScrollToRequested="Cv_Songs_ScrollToRequested">
+                <CollectionView.ItemsLayout>
+                    <GridItemsLayout Orientation="Horizontal"
+                             SnapPointsAlignment="Center"
+                             SnapPointsType="Mandatory"/>
+                </CollectionView.ItemsLayout>
+
                 <CollectionView.ItemTemplate>
                     <DataTemplate>
-                        <StackLayout Padding="5">
-                            <Label Text="{Binding .}" d:Text="Design Time Data" FontSize="10"/>
-                        </StackLayout>
+                        <Frame BackgroundColor="Transparent" CornerRadius="10" HasShadow="True">
+                            <Image  Source="{Binding CoverImage}" HeightRequest="450" WidthRequest="450"/>
+                        </Frame>
                     </DataTemplate>
                 </CollectionView.ItemTemplate>
             </CollectionView>
+
+            <StackLayout Margin="10" HeightRequest="200" VerticalOptions="Start" HorizontalOptions="CenterAndExpand">
+                <ScrollView>
+                    <Label x:Name="lblLyrics"
+                    VerticalOptions="Start" 
+                    HorizontalOptions="CenterAndExpand"
+                    TextColor="White" HorizontalTextAlignment="Center" VerticalTextAlignment="Center"
+                   FontSize="Medium" LineHeight="2"/>
+                </ScrollView>
+            </StackLayout>
+            <StackLayout Orientation="Horizontal" HorizontalOptions="CenterAndExpand" VerticalOptions="Start">
+                <Label x:Name="lblStartTimer" Text="00:00" FontSize="Medium" TextColor="White"/>
+                <Slider ThumbColor="White" x:Name="slider" WidthRequest="280" Minimum="0" Maximum="100"/>
+                <Label x:Name="lblEndTimer" Text="04:12" FontSize="Medium" TextColor="White"/>
+            </StackLayout>
+
+            <StackLayout Orientation="Horizontal" HorizontalOptions="CenterAndExpand" VerticalOptions="Start">
+                <Image Source="fav.png" WidthRequest="35" HeightRequest="35" Margin="10"/>
+                <Image Source="prev.png" WidthRequest="35" HeightRequest="35" Margin="10"/>
+                <ImageButton x:Name="playBtn" Source="pause.png" Margin="10" Clicked="ImageButton_Clicked" />
+                <Image Source="next.png" WidthRequest="35" HeightRequest="35" Margin="10">
+                    <Image.GestureRecognizers>
+                        <TapGestureRecognizer Tapped="nextBtn_Tapped">
+                        </TapGestureRecognizer>
+                    </Image.GestureRecognizers>
+                </Image>
+                <Image Source="list.png" WidthRequest="35" HeightRequest="35" Margin="10"/>
+            </StackLayout>
         </StackLayout>
     </ContentPage.Content>
 </ContentPage>

CollectionViewChallenge/CollectionViewChallenge/Views/CollectionViewChallengePage.xaml.cs

@@ -1,7 +1,9 @@
-using System;
+using CollectionViewChallenge.Models;
+using System;
 using System.Collections.Generic;
 using System.Linq;
 using System.Text;
+using System.Threading;
 using System.Threading.Tasks;
 
 using Xamarin.Forms;
@@ -12,9 +14,125 @@ namespace CollectionViewChallenge.Views
     [XamlCompilation(XamlCompilationOptions.Compile)]
     public partial class CollectionViewChallengePage : ContentPage
     {
+        List<Song> songsList = new List<Song>();
+
+        private static CancellationTokenSource _cancellationTokenSource;
+
+        int startIndex = 0;
         public CollectionViewChallengePage()
         {
             InitializeComponent();
+
+            //let's populate some of my favorite tracks
+            songsList.Add(new Song()
+            {
+                CoverImage = "Heathens.jpg",
+                Lyrics = "All my friends are heathens, take it slow\nWait for them to ask you who you know\nPlease don't make any sudden moves\nYou don't know the half of the abuse\nAll my friends are heathens, take it slow\nWait for them to ask you who you know\nPlease don't make any sudden moves\nYou don't know the half of the abuse\nWelcome to the room of people\nWho have rooms of people that they loved one day\nDocked away\nJust because we check the guns at the door\nDoesn't mean our brains will change from hand grenades\nYou're lovin' on the psychopath sitting next to you\nYou're lovin' on the murderer sitting next to you\nYou'll think, How'd I get here, sitting next to you ? \nBut after all I've said, please don't forget\nAll my friends are heathens, take it slow\nWait for them to ask you who you know\nPlease don't make any sudden moves\nYou don't know the half of the abuse\n"
+            });
+
+            songsList.Add(new Song()
+            {
+                CoverImage = "MadOverYou.jpeg",
+                Lyrics = "Dance for the dough.\nGyal I wan make you whine for the dough\nTell am... One time for the love\nTell the gyal make she dance for the love\nGhana girl say she wan marry me o\nI hope say she sabi cook wache\nHope your love go sweet pass shito\nBaby girl I say, I say your body na killer o\nI fit to die on top your body. Only on your body\nThat girl for the corner, tell somebody make they call am o\nWay she dey whine am I see fire for her body o\nAnd if she follow me go na enjoyment go kill am o\nBaby girl you bad o\nGirl the way you whine\nI dey mad over you girl.\nI dey mad over you girl\nSay you are my woman eee. My super woman\nI dey mad over you girl. I dey mad over you girl\nDie for the love\nGyal I wan make you whine for the dough\nOne time for the love\nGyal I wan make yoy dance for the dough\nDance for the dough.\nGyal I wan make you whine for the dough\nTell am. One time for the love\nTell the gyal make she dance for the love\nIf I sing for you, you go love me o\nBaby love me non-stop.\nI will love you non-stop\nAlways kiss you on top. Baby o\nAll over the world wan wa mi o.\nPlay the music non-stop\nTell them dance to my song.\nTell them shake bum bum. ohweh"
+            });
+
+            songsList.Add(new Song()
+            {
+                CoverImage = "jazz.jpg",
+                Lyrics = "I said, 'Take it easy, baby\nI worked all day and my feet feel just like lead\nYou got my shirt tails flyin' all over the place\nAnd the sweat poppin' out of my head'\nShe said, 'Hey, bossa nova baby\nKeep on workin' for this ain't no time to quit'\nShe said, 'Go, bossa nova baby keep on dancin'\nI'm about to have myself a fit'\nBossa nova, bossa nova\nI said, “Hey little mama, let's sit down\nHave a drink and dig the band'\nShe said, 'Drink, drink, drink oh, fiddle-de-dink\nI can dance with a drink in my hand'\nShe said, 'Hey bossa nova baby\nKeep on workin' for this ain't no time to drink'\nShe said, 'Go bossa nova baby\nKeep on dancin', 'cause I ain't got time to think'\nBossa nova, bossa nova\nI said, 'Come on baby, it's hot in here\nAnd it's oh so cool outside\nIf you lend me a dollar, I can buy some gas\nAnd we can go for a little ride'\nShe said, 'Hey bossa nova baby\nKeep on workin' for I ain't got time for that'\nShe said, 'Go bossa nova baby\nKeep on dancin' or I'll find myself another cat'\nBossa nova, bossa nova\nBossa nova, bossa nova\nBossa nova, bossa nova"
+            });
+
+            cv_Songs.ItemsSource = songsList;
+
+            lblLyrics.Text = songsList[0].Lyrics;
+            _cancellationTokenSource = new CancellationTokenSource();
+            AnimateLyrics();
+            ShowProgressTimer();
+        }
+
+        private async void AnimateLyrics()
+        {
+            await Task.Delay(2000);
+            int offset = -5;
+            CancellationTokenSource cts = _cancellationTokenSource;
+            Device.StartTimer(TimeSpan.FromMilliseconds(50), () =>
+            {
+                if (cts.IsCancellationRequested)
+                {
+                    return false;
+                }
+                Device.BeginInvokeOnMainThread(() =>
+                {
+                    lblLyrics.TranslateTo(0, -10 + offset, 250, Easing.Linear);
+                });
+                offset--;
+                return true;
+            });
+        }
+
+        private async void ShowProgressTimer()
+        {
+            int Min = 4;
+            int Sec = 12;
+            int TotalSec = (Min * 60) + Sec;
+            await Task.Run(() =>
+            {
+                double slidervalue = slider.Minimum;
+                CancellationTokenSource cts = _cancellationTokenSource;
+                Device.StartTimer(TimeSpan.FromSeconds(1), () =>
+                {
+                    if (cts.IsCancellationRequested)
+                    {
+                        return false;
+                    }
+                    if (TotalSec == 0)
+                        return false;
+                    Device.BeginInvokeOnMainThread(() =>
+                    {
+                        TotalSec = TotalSec - 1;
+                        TimeSpan _TimeSpan = TimeSpan.FromSeconds(TotalSec);
+                        lblStartTimer.Text = string.Format("{0:00}:{1:00}", _TimeSpan.Minutes, _TimeSpan.Seconds);
+                        slider.Value = slidervalue++;
+                    });
+                    return true;
+                });
+            });
+        }
+
+
+        private void nextBtn_Tapped(object sender, EventArgs e)
+        {
+            if (startIndex < songsList.Count)
+            {
+                cv_Songs.ScrollTo(startIndex++);
+            }
+            else
+            {
+                startIndex = 0;
+                cv_Songs.ScrollTo(startIndex);
+            }
+        }
+
+        private void Cv_Songs_ScrollToRequested(object sender, ScrollToRequestEventArgs e)
+        {
+            Stop();
+            lblLyrics.Text = songsList[e.Index].Lyrics;
+            _cancellationTokenSource = new CancellationTokenSource();
+            AnimateLyrics();
+            ShowProgressTimer();
+        }
+
+        private void ImageButton_Clicked(object sender, EventArgs e)
+        {
+            if ((playBtn.Source as FileImageSource).File == "pause.png")
+                playBtn.Source = "play.png";
+            else
+                playBtn.Source = "pause.png";
+        }
+
+        public void Stop()
+        {
+            Interlocked.Exchange(ref _cancellationTokenSource, new CancellationTokenSource()).Cancel();
         }
     }
 }