Merge pull request #61 from plaid/ANDROID/addPlaidStyling

ANDROID-342: Update Link Sample app styling
plaid · May 15, 2020 · 4f1f1ca · 4f1f1ca
2 parents d2d5e44 + b478425
commit 4f1f1ca
Show file tree

Hide file tree

Showing 10 changed files with 68 additions and 60 deletions.
diff --git a/app/src/main/java/com/plaid/linksample/MainActivity.kt b/app/src/main/java/com/plaid/linksample/MainActivity.kt
@@ -9,6 +9,7 @@ import android.os.Bundle
 import android.util.Log
 import android.view.Menu
 import android.view.MenuItem
+import android.view.View
 import android.widget.TextView
 import androidx.appcompat.app.AppCompatActivity
 import com.google.android.material.floatingactionbutton.FloatingActionButton
@@ -66,8 +67,8 @@ class MainActivity : AppCompatActivity() {
     setContentView(R.layout.activity_main)
     result = findViewById(R.id.result)
 
-    val fab = findViewById<FloatingActionButton>(R.id.open_link)
-    fab.setOnClickListener {
+    val button = findViewById<View>(R.id.open_link)
+    button.setOnClickListener {
       setOptionalEventListener()
       openLink()
     }

diff --git a/app/src/main/java/com/plaid/linksample/MainActivityJava.java b/app/src/main/java/com/plaid/linksample/MainActivityJava.java
@@ -10,19 +10,22 @@
 import android.view.Menu;
 import android.view.MenuInflater;
 import android.view.MenuItem;
+import android.view.View;
 import android.widget.TextView;
 import androidx.annotation.NonNull;
 import androidx.annotation.Nullable;
 import androidx.appcompat.app.AppCompatActivity;
-import com.google.android.material.floatingactionbutton.FloatingActionButton;
+
 import com.plaid.link.Plaid;
 import com.plaid.linkbase.models.configuration.LinkConfiguration;
 import com.plaid.linkbase.models.configuration.PlaidProduct;
 import com.plaid.linkbase.models.connection.LinkConnection;
 import com.plaid.linkbase.models.connection.PlaidLinkResultHandler;
-import java.util.ArrayList;
+
 import kotlin.Unit;
 
+import java.util.ArrayList;
+
 public class MainActivityJava extends AppCompatActivity {
 
   private static final int LINK_REQUEST_CODE = 1;
@@ -66,11 +69,11 @@ public class MainActivityJava extends AppCompatActivity {
   @Override
   protected void onCreate(Bundle savedInstanceState) {
     super.onCreate(savedInstanceState);
-    setContentView(R.layout.activity_main_java);
+    setContentView(R.layout.activity_main);
     result = findViewById(R.id.result);
 
-    FloatingActionButton fab = findViewById(R.id.open_link);
-    fab.setOnClickListener(view -> {
+    View button = findViewById(R.id.open_link);
+    button.setOnClickListener(view -> {
       setOptionalEventListener();
       openLink();
     });

diff --git a/app/src/main/res/font/vaud.otf b/app/src/main/res/font/vaud.otf
diff --git a/app/src/main/res/font/vaud_semibold.otf b/app/src/main/res/font/vaud_semibold.otf
diff --git a/app/src/main/res/layout/activity_main.xml b/app/src/main/res/layout/activity_main.xml
@@ -1,32 +1,28 @@
-<?xml version="1.0" encoding="utf-8"?>
-<!--
+<?xml version="1.0" encoding="utf-8"?><!--
   ~ Copyright (c) 2020 Plaid Technologies, Inc. <support@plaid.com>
   -->
 
-<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
-  xmlns:app="http://schemas.android.com/apk/res-auto"
+<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
   xmlns:tools="http://schemas.android.com/tools"
   android:layout_width="match_parent"
   android:layout_height="match_parent"
+  android:orientation="vertical"
+  android:padding="@dimen/space_2x"
   tools:context=".MainActivity">
 
   <TextView
     android:id="@+id/result"
-    android:layout_width="0dp"
+    style="@style/PlaidText.B1.Regular"
+    android:layout_width="match_parent"
     android:layout_height="0dp"
-    android:gravity="center"
-    app:layout_constraintBottom_toBottomOf="parent"
-    app:layout_constraintEnd_toEndOf="parent"
-    app:layout_constraintStart_toStartOf="parent"
-    app:layout_constraintTop_toTopOf="parent" />
+    android:layout_weight="1"
+    android:gravity="center" />
 
-  <com.google.android.material.floatingactionbutton.FloatingActionButton
+  <com.google.android.material.button.MaterialButton
     android:id="@+id/open_link"
-    android:layout_width="wrap_content"
+    style="@style/PlaidButton.Primary"
+    android:layout_width="match_parent"
     android:layout_height="wrap_content"
-    android:layout_margin="@dimen/fab_margin"
-    app:layout_constraintBottom_toBottomOf="parent"
-    app:layout_constraintEnd_toEndOf="parent"
-    app:srcCompat="@drawable/add" />
+    android:text="@string/open_link" />
 
-</androidx.constraintlayout.widget.ConstraintLayout>
+</LinearLayout>
diff --git a/app/src/main/res/layout/activity_main_java.xml b/app/src/main/res/layout/activity_main_java.xml
diff --git a/app/src/main/res/values/colors.xml b/app/src/main/res/values/colors.xml
@@ -1,5 +1,4 @@
-<?xml version="1.0" encoding="utf-8"?>
-<!--
+<?xml version="1.0" encoding="utf-8"?><!--
   ~ Copyright (c) 2020 Plaid Technologies, Inc. <support@plaid.com>
   -->
 
@@ -8,4 +7,7 @@
   <color name="colorPrimaryDark">#111111</color>
   <color name="colorSecondary">#0A85EA</color>
   <color name="colorOnSecondary">#FFFFFF</color>
+
+  <color name="plaid_black_900">#4B4B4B</color>
+  <color name="white">#ffffff</color>
 </resources>
diff --git a/app/src/main/res/values/dimens.xml b/app/src/main/res/values/dimens.xml
@@ -4,4 +4,12 @@
 
 <resources>
   <dimen name="fab_margin">16dp</dimen>
+
+  <dimen name="b1_font_size">16sp</dimen>
+  <dimen name="b1_line_size">24sp</dimen>
+
+  <dimen name="h4_font_size">20sp</dimen>
+  <dimen name="h4_line_size">24sp</dimen>
+
+  <dimen name="space_2x">16dp</dimen>
 </resources>
diff --git a/app/src/main/res/values/strings.xml b/app/src/main/res/values/strings.xml
@@ -1,5 +1,4 @@
-<?xml version="1.0" encoding="utf-8"?>
-<!--
+<?xml version="1.0" encoding="utf-8"?><!--
   ~ Copyright (c) 2020 Plaid Technologies, Inc. <support@plaid.com>
   -->
 
@@ -13,4 +12,5 @@
   <string name="content_exception">Exception Class:\n%1$s\n\n Exception Message:\n%2$s</string>
   <string name="open_java">Open Java demo</string>
   <string name="open_kotlin">Open Kotlin demo</string>
+  <string name="open_link">Open Link</string>
 </resources>
diff --git a/app/src/main/res/values/styles.xml b/app/src/main/res/values/styles.xml
@@ -9,6 +9,36 @@
     <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
     <item name="colorSecondary">@color/colorSecondary</item>
     <item name="colorOnSecondary">@color/colorOnSecondary</item>
+    <item name="android:fontFamily">@font/vaud</item>
   </style>
 
+  <style name="PlaidText" parent="TextAppearance.AppCompat">
+    <item name="android:textAllCaps">false</item>
+  </style>
+
+  <style name="PlaidText.B1.Regular" parent="PlaidText">
+    <item name="android:fontFamily">@font/vaud</item>
+    <item name="android:textSize">@dimen/b1_font_size</item>
+    <item name="lineHeight">@dimen/b1_line_size</item>
+    <item name="android:textColor">@color/plaid_black_900</item>
+  </style>
+
+  <style name="PlaidText.H4.Semibold" parent="PlaidText">
+    <item name="android:fontFamily">@font/vaud_semibold</item>
+    <item name="android:textSize">@dimen/h4_font_size</item>
+    <item name="lineHeight">@dimen/h4_line_size</item>
+    <item name="android:textColor">@color/plaid_black_900</item>
+  </style>
+
+  <style name="PlaidButton.Primary" parent="PlaidText.H4.Semibold">
+    <item name="android:padding">@dimen/space_2x</item>
+    <item name="android:textColor">@color/white</item>
+    <item name="android:gravity">center</item>
+    <item name="android:textAlignment">center</item>
+    <item name="android:textColorHighlight">?attr/colorAccent</item>
+    <item name="android:textColorHint">?attr/colorAccent</item>
+    <item name="android:textColorLink">?attr/colorAccent</item>
+    <item name="android:textColorLinkInverse">?attr/colorAccent</item>
+    <item name="android:textAllCaps">false</item>
+  </style>
 </resources>