Finalized TV Time clone

Notes.md

@@ -0,0 +1,27 @@
+# TV Time clone
+
+- https://itunes.apple.com/us/app/tv-time-track-what-you-watch/id431065232?mt=8
+- https://play.google.com/store/apps/details?id=com.tozelabs.tvshowtime&hl=en
+
+## Notes
+- In Material the Frame had no shadow by default so I had to build a custom visual renderer to reproduce the shadow effect.
+- CollectionView is powerful!!!
+- Button's shadow was great still I'd like to be able to edit the elevation without a custom renderer or effect.
+- Liked the fact that I could use custom visual and that I could swap between Default and Material.
+
+## Screenshots
+
+### Original TV Time App iOS
+![Original Screenshot 1](https://raw.githubusercontent.com/xerx/VisualChallenge/master/TV%20Time%20Screenshot%201.jpg)
+-----------------------------------------------------------------------
+![Original Screenshot 2](https://raw.githubusercontent.com/xerx/VisualChallenge/master/TV%20Time%20Screenshot%202.JPG)
+
+### Clone Android
+![Android Screenshot 1](https://raw.githubusercontent.com/xerx/VisualChallenge/master/Clone%20Android%20Screenshot%201.png)
+-----------------------------------------------------------------------
+![Android Screenshot 2](https://raw.githubusercontent.com/xerx/VisualChallenge/master/Clone%20Android%20Screenshot%202.png)
+
+### Clone iOS
+![iOS Screenshot 1](https://raw.githubusercontent.com/xerx/VisualChallenge/master/Clone%20iOS%20Screenshot%201.png)
+-----------------------------------------------------------------------
+![iOS Screenshot 2](https://raw.githubusercontent.com/xerx/VisualChallenge/master/Clone%20iOS%20Screenshot%202.png)

VisualChallenge/VisualChallenge.Android/Renderers/FrameRendererDroid.cs

@@ -0,0 +1,25 @@
+using System;
+using Xamarin.Forms;
+using Xamarin.Forms.Platform.Android;
+using VisualChallenge.Droid.Renderers;
+using VisualChallenge;
+using Android.Content;
+using Android.Graphics.Drawables;
+
+[assembly: ExportRenderer(typeof(Frame), typeof(FrameRendererDroid), new[] { typeof(CustomVisual) })]
+namespace VisualChallenge.Droid.Renderers
+{
+    public class FrameRendererDroid : FrameRenderer
+    {
+        public FrameRendererDroid(Context context) : base(context)
+        {
+        }
+
+        protected override void OnElementChanged(ElementChangedEventArgs<Frame> e)
+        {
+            base.OnElementChanged(e);
+            ViewGroup.SetBackgroundResource(Resource.Drawable.shadow_frame);
+            ViewGroup.Elevation = 22;
+        }
+    }
+}

VisualChallenge/VisualChallenge.Android/Resources/drawable/shadow_frame.xml

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8" ?>  
+<shape xmlns:android="http://schemas.android.com/apk/res/android" 
+       android:shape="rectangle">  
+    <corners android:radius="4dp" />  
+    <solid android:color="#FFFFFF" /> 
+</shape>

VisualChallenge/VisualChallenge.Android/VisualChallenge.Android.csproj

@@ -57,6 +57,7 @@
     <Compile Include="MainActivity.cs" />
     <Compile Include="Resources\Resource.designer.cs" />
     <Compile Include="Properties\AssemblyInfo.cs" />
+    <Compile Include="Renderers\FrameRendererDroid.cs" />
   </ItemGroup>
   <ItemGroup>
     <None Include="Resources\AboutResources.txt" />
@@ -85,6 +86,7 @@
     <AndroidResource Include="Resources\drawable-xhdpi\xamagon_preview.png" />
     <AndroidResource Include="Resources\drawable-xxhdpi\xamagon_preview.png" />
     <AndroidResource Include="Resources\drawable-xxxhdpi\xamagon_preview.png" />
+    <AndroidResource Include="Resources\drawable\shadow_frame.xml" />
   </ItemGroup>
   <ItemGroup />
   <ItemGroup>
@@ -93,5 +95,8 @@
       <Name>VisualChallenge</Name>
     </ProjectReference>
   </ItemGroup>
+  <ItemGroup>
+    <Folder Include="Renderers\" />
+  </ItemGroup>
   <Import Project="$(MSBuildExtensionsPath)\Xamarin\Android\Xamarin.Android.CSharp.targets" />
 </Project>

VisualChallenge/VisualChallenge.iOS/Renderers/FrameRendererIos.cs

@@ -0,0 +1,23 @@
+using System;
+using VisualChallenge;
+using VisualChallenge.iOS.Renderers;
+using Xamarin.Forms;
+using Xamarin.Forms.Platform.iOS;
+using CoreGraphics;
+
+[assembly:ExportRenderer(typeof(Frame), typeof(FrameRendererIos), new[] { typeof(CustomVisual) })]
+namespace VisualChallenge.iOS.Renderers
+{
+    public class FrameRendererIos : FrameRenderer
+    {
+        protected override void OnElementChanged(ElementChangedEventArgs<Frame> e)
+        {
+            base.OnElementChanged(e);
+            if(Layer != null)
+            {
+                Layer.ShadowRadius = 8f;
+                Layer.ShadowColor = Color.Silver.ToCGColor();
+            }
+        }
+    }
+}

VisualChallenge/VisualChallenge.iOS/VisualChallenge.iOS.csproj

@@ -70,6 +70,7 @@
     <None Include="Entitlements.plist" />
     <None Include="Info.plist" />
     <Compile Include="Properties\AssemblyInfo.cs" />
+    <Compile Include="Renderers\FrameRendererIos.cs" />
   </ItemGroup>
   <ItemGroup>
     <ImageAsset Include="Assets.xcassets\AppIcon.appiconset\Contents.json">
@@ -144,4 +145,7 @@
       <Name>VisualChallenge</Name>
     </ProjectReference>
   </ItemGroup>
+  <ItemGroup>
+    <Folder Include="Renderers\" />
+  </ItemGroup>
 </Project>

VisualChallenge/VisualChallenge/CustomVisual.cs

@@ -0,0 +1,11 @@
+using System;
+using Xamarin.Forms;
+namespace VisualChallenge
+{
+    public class CustomVisual : IVisual
+    {
+        public CustomVisual()
+        {
+        }
+    }
+}

VisualChallenge/VisualChallenge/VisualChallenge.csproj

@@ -20,4 +20,33 @@
       <DependentUpon>VisualChallengePage.xaml</DependentUpon>
     </Compile>
   </ItemGroup>
+  <ItemGroup>
+    <Folder Include="Resources\" />
+  </ItemGroup>
+  <ItemGroup>
+    <None Remove="Resources\cover_photo.jpg" />
+    <None Remove="Resources\ic_help.png" />
+    <None Remove="Resources\ic_bell.png" />
+    <None Remove="Resources\ic_link.png" />
+    <None Remove="Resources\profile_photo.png" />
+    <None Remove="Resources\umbrella.jpg" />
+    <None Remove="Resources\vikings.jpg" />
+    <None Remove="Resources\peaky.jpg" />
+    <None Remove="Resources\mirror.jpg" />
+    <None Remove="Resources\leftovers.jpg" />
+    <None Remove="Resources\dark.jpg" />
+  </ItemGroup>
+  <ItemGroup>
+    <EmbeddedResource Include="Resources\cover_photo.jpg" />
+    <EmbeddedResource Include="Resources\ic_help.png" />
+    <EmbeddedResource Include="Resources\ic_bell.png" />
+    <EmbeddedResource Include="Resources\ic_link.png" />
+    <EmbeddedResource Include="Resources\profile_photo.png" />
+    <EmbeddedResource Include="Resources\umbrella.jpg" />
+    <EmbeddedResource Include="Resources\vikings.jpg" />
+    <EmbeddedResource Include="Resources\peaky.jpg" />
+    <EmbeddedResource Include="Resources\mirror.jpg" />
+    <EmbeddedResource Include="Resources\leftovers.jpg" />
+    <EmbeddedResource Include="Resources\dark.jpg" />
+  </ItemGroup>
 </Project>