Merge pull request willowtreeapps#100 from willowtreeapps/new-card-ui

made card layout

app/src/main/java/com/willowtreeapps/spurceexampleapp/fragments/ViewFragment.java

@@ -27,7 +27,6 @@
 import android.os.Bundle;
 import android.support.annotation.Nullable;
 import android.support.v4.app.Fragment;
-import android.support.v4.content.ContextCompat;
 import android.util.TypedValue;
 import android.view.LayoutInflater;
 import android.view.View;
@@ -36,6 +35,7 @@
 import android.widget.GridLayout;
 
 import com.willowtreeapps.spurceexampleapp.R;
+import com.willowtreeapps.spurceexampleapp.widgets.CardLayout;
 
 import java.util.ArrayList;
 import java.util.List;
@@ -61,8 +61,7 @@ public View onCreateView(LayoutInflater inflater, ViewGroup container, @Nullable
         final int CHILD_VIEW_COUNT = parent.getColumnCount() * parent.getRowCount();
 
         for (int i = 0; i < CHILD_VIEW_COUNT; i++) {
-            View childView = new View(getContext());
-            childView.setBackgroundColor(ContextCompat.getColor(getContext(), R.color.spruceViewColor));
+            CardLayout childView = new CardLayout(getContext());
             childView.setAlpha(0F);
             parent.addView(childView);
             children.add(childView);
@@ -72,7 +71,7 @@ public View onCreateView(LayoutInflater inflater, ViewGroup container, @Nullable
             @Override
             public void onGlobalLayout() {
                 Resources res = getResources();
-                int tileMargins = Math.round(TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 2, res.getDisplayMetrics()));
+                int tileMargins = Math.round(TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 4, res.getDisplayMetrics()));
                 final int childWidth = parent.getWidth() / parent.getColumnCount() - (tileMargins * 2);
                 final int childHeight = parent.getHeight() / parent.getRowCount() - (tileMargins * 2);
 

app/src/main/java/com/willowtreeapps/spurceexampleapp/widgets/CardLayout.java

@@ -0,0 +1,55 @@
+/*
+ *     Spruce
+ *
+ *     Copyright (c) 2017 WillowTree, Inc.
+ *     Permission is hereby granted, free of charge, to any person obtaining a copy
+ *     of this software and associated documentation files (the "Software"), to deal
+ *     in the Software without restriction, including without limitation the rights
+ *     to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ *     copies of the Software, and to permit persons to whom the Software is
+ *     furnished to do so, subject to the following conditions:
+ *     The above copyright notice and this permission notice shall be included in
+ *     all copies or substantial portions of the Software.
+ *     THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ *     IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ *     FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ *     AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ *     LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ *     OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+ *     THE SOFTWARE.
+ *
+ */
+
+package com.willowtreeapps.spurceexampleapp.widgets;
+
+import android.content.Context;
+import android.support.annotation.Nullable;
+import android.util.AttributeSet;
+import android.view.LayoutInflater;
+import android.widget.LinearLayout;
+
+import com.willowtreeapps.spurceexampleapp.R;
+
+public class CardLayout extends LinearLayout {
+
+    public CardLayout(Context context) {
+        super(context);
+        init();
+    }
+
+    public CardLayout(Context context, @Nullable AttributeSet attrs) {
+        super(context, attrs);
+        init();
+    }
+
+    public CardLayout(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
+        super(context, attrs, defStyleAttr);
+        init();
+    }
+
+    private void init() {
+        LayoutInflater inflater = LayoutInflater.from(getContext());
+        inflater.inflate(R.layout.view_card, this, true);
+    }
+
+}

app/src/main/res/layout/view_card.xml

@@ -0,0 +1,25 @@
+<?xml version="1.0" encoding="utf-8"?>
+<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
+    android:orientation="vertical" android:layout_width="match_parent"
+    android:layout_height="match_parent"
+    android:padding="8dp"
+    android:background="@color/white">
+
+    <View
+        android:layout_width="match_parent"
+        android:layout_height="8dp"
+        android:background="@color/fake_paragraphs"
+        android:layout_alignParentBottom="true"
+        android:layout_marginTop="8dp"
+        android:alpha="0.5"
+        android:id="@+id/fake_paragraph"
+        />
+
+    <View
+        android:layout_width="match_parent"
+        android:layout_height="match_parent"
+        android:layout_above="@id/fake_paragraph"
+        android:background="@color/square_background"
+        />
+
+</RelativeLayout>

app/src/main/res/layout/view_fragment.xml

@@ -35,15 +35,16 @@
         android:layout_marginLeft="4dp"
         android:layout_marginRight="4dp"
         android:layout_marginTop="4dp"
-        android:layout_weight="9.5">
+        android:layout_weight="9.5"
+        android:background="@color/recycler_background">
 
         <GridLayout
             android:id="@+id/view_group_to_animate"
             android:layout_width="match_parent"
             android:layout_height="match_parent"
             android:clickable="true"
-            android:columnCount="11"
-            android:rowCount="11"/>
+            android:columnCount="6"
+            android:rowCount="7"/>
 
     </FrameLayout>
 

app/src/main/res/values/colors.xml

@@ -33,4 +33,5 @@
     <color name="recycler_background">#F8F8F9</color>
     <color name="fake_paragraphs">#D9E1E2</color>
     <color name="square_background">#DBE9F9</color>
+
 </resources>