From 48674d130a69d65922eaad426224d0f412d69a64 Mon Sep 17 00:00:00 2001
From: Felix Prahl-Kamps <felixpk@outlook.de>
Date: Fri, 21 Jun 2019 13:05:04 +0200
Subject: [PATCH] add transition to uploadInfo detail view

---
 .idea/misc.xml                                |   2 +-
 app/src/main/AndroidManifest.xml              |   3 +-
 .../mispbump/RecyclerViewItemTransition.java  |  54 ++++++++
 .../mispbump/activities/HomeActivity.java     |  27 ++--
 .../mispbump/activities/SyncActivity.java     |  16 ++-
 .../activities/UploadInformationActivity.java | 123 +++++++++++++++++-
 .../mispbump/adapters/UploadInfoAdapter.java  |   4 +-
 .../OnRecyclerItemClickListener.java          |   4 +-
 app/src/main/res/anim/scale_vertical.xml      |  13 ++
 .../main/res/drawable/ic_error_outline.xml    |   2 +-
 app/src/main/res/drawable/ic_info_outline.xml |   2 +-
 .../layout/activity_upload_information.xml    |  75 +++++++++--
 .../res/layout/row_upload_information.xml     |  10 +-
 app/src/main/res/transition/simple.xml        |   8 ++
 app/src/main/res/values/colors.xml            |   3 +
 app/src/main/res/values/styles.xml            |  11 ++
 16 files changed, 312 insertions(+), 45 deletions(-)
 create mode 100644 app/src/main/java/lu/circl/mispbump/RecyclerViewItemTransition.java
 create mode 100644 app/src/main/res/anim/scale_vertical.xml
 create mode 100644 app/src/main/res/transition/simple.xml

diff --git a/.idea/misc.xml b/.idea/misc.xml
index 93a9df2..da7759f 100644
--- a/.idea/misc.xml
+++ b/.idea/misc.xml
@@ -38,7 +38,7 @@
       </value>
     </option>
   </component>
-  <component name="ProjectRootManager" version="2" languageLevel="JDK_1_7" project-jdk-name="1.8" project-jdk-type="JavaSDK">
+  <component name="ProjectRootManager" version="2" languageLevel="JDK_1_8" project-jdk-name="1.8" project-jdk-type="JavaSDK">
     <output url="file://$PROJECT_DIR$/build/classes" />
   </component>
   <component name="ProjectType">
diff --git a/app/src/main/AndroidManifest.xml b/app/src/main/AndroidManifest.xml
index 6950428..48b8f7d 100644
--- a/app/src/main/AndroidManifest.xml
+++ b/app/src/main/AndroidManifest.xml
@@ -15,7 +15,8 @@
         android:supportsRtl="true"
         android:theme="@style/AppTheme"
         tools:ignore="GoogleAppIndexingWarning">
-        <activity android:name=".activities.UploadInformationActivity"></activity>
+        <activity android:name=".activities.UploadInformationActivity"
+            android:label="Sync details"/>
         <activity
             android:name=".activities.UploadActivity"
             android:configChanges="orientation|screenSize"
diff --git a/app/src/main/java/lu/circl/mispbump/RecyclerViewItemTransition.java b/app/src/main/java/lu/circl/mispbump/RecyclerViewItemTransition.java
new file mode 100644
index 0000000..8b1e789
--- /dev/null
+++ b/app/src/main/java/lu/circl/mispbump/RecyclerViewItemTransition.java
@@ -0,0 +1,54 @@
+package lu.circl.mispbump;
+
+import android.animation.Animator;
+import android.animation.ValueAnimator;
+import android.transition.Transition;
+import android.transition.TransitionValues;
+import android.view.View;
+import android.view.ViewGroup;
+
+import androidx.annotation.NonNull;
+
+
+public class RecyclerViewItemTransition extends Transition {
+
+    private static final String PROPNAME_ELEVATION = "customtransition:change_elevation:toolbar";
+
+    private void captureTransitionValues(TransitionValues transitionValues) {
+        transitionValues.values.put(PROPNAME_ELEVATION, transitionValues.view.getElevation());
+    }
+
+    @Override
+    public void captureStartValues(@NonNull TransitionValues transitionValues) {
+        captureTransitionValues(transitionValues);
+    }
+
+    @Override
+    public void captureEndValues(@NonNull TransitionValues transitionValues) {
+        captureTransitionValues(transitionValues);
+    }
+
+    @Override
+    public Animator createAnimator(ViewGroup sceneRoot, TransitionValues startValues, TransitionValues endValues) {
+        if (null == startValues || null == endValues) {
+            return null;
+        }
+
+        final View view = endValues.view;
+
+        int startElevation = 0;
+        int endElevation = 6;
+
+        ValueAnimator anim = ValueAnimator.ofFloat(startElevation, endElevation);
+
+        anim.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
+            @Override
+            public void onAnimationUpdate(ValueAnimator animation) {
+                float t = (float) animation.getAnimatedValue();
+                view.setElevation(t);
+            }
+        });
+
+        return anim;
+    }
+}
diff --git a/app/src/main/java/lu/circl/mispbump/activities/HomeActivity.java b/app/src/main/java/lu/circl/mispbump/activities/HomeActivity.java
index 2e44639..9ddae93 100644
--- a/app/src/main/java/lu/circl/mispbump/activities/HomeActivity.java
+++ b/app/src/main/java/lu/circl/mispbump/activities/HomeActivity.java
@@ -2,22 +2,21 @@ package lu.circl.mispbump.activities;
 
 import android.content.Intent;
 import android.os.Bundle;
-
-import com.google.android.material.floatingactionbutton.FloatingActionButton;
-import com.google.android.material.snackbar.Snackbar;
-import com.google.gson.Gson;
-
-import androidx.appcompat.app.ActionBar;
-import androidx.appcompat.app.AppCompatActivity;
-import androidx.recyclerview.widget.LinearLayoutManager;
-import androidx.recyclerview.widget.RecyclerView;
-import androidx.appcompat.widget.Toolbar;
-
 import android.view.Menu;
 import android.view.MenuItem;
 import android.view.View;
 import android.widget.TextView;
 
+import androidx.appcompat.app.ActionBar;
+import androidx.appcompat.app.AppCompatActivity;
+import androidx.appcompat.widget.Toolbar;
+import androidx.core.app.ActivityOptionsCompat;
+import androidx.recyclerview.widget.LinearLayoutManager;
+import androidx.recyclerview.widget.RecyclerView;
+
+import com.google.android.material.floatingactionbutton.FloatingActionButton;
+import com.google.gson.Gson;
+
 import java.util.List;
 
 import lu.circl.mispbump.R;
@@ -75,10 +74,12 @@ public class HomeActivity extends AppCompatActivity {
 
         uploadInfoAdapter.setOnRecyclerItemClickListener(new OnRecyclerItemClickListener<UploadInformation>() {
             @Override
-            public void onClick(UploadInformation item) {
+            public void onClick(final View v, UploadInformation item) {
                 Intent i = new Intent(HomeActivity.this, UploadInformationActivity.class);
                 i.putExtra(UploadInformationActivity.EXTRA_UPLOAD_INFO_KEY, new Gson().toJson(item));
-                startActivity(i);
+
+                ActivityOptionsCompat options = ActivityOptionsCompat.makeClipRevealAnimation(v.findViewById(R.id.rootLayout), (int) v.getX(), (int) v.getY(), v.getWidth(), v.getHeight());
+                startActivity(i, options.toBundle());
             }
         });
 
diff --git a/app/src/main/java/lu/circl/mispbump/activities/SyncActivity.java b/app/src/main/java/lu/circl/mispbump/activities/SyncActivity.java
index c4a3cda..0ec56f0 100644
--- a/app/src/main/java/lu/circl/mispbump/activities/SyncActivity.java
+++ b/app/src/main/java/lu/circl/mispbump/activities/SyncActivity.java
@@ -6,6 +6,8 @@ import android.content.Intent;
 import android.graphics.Bitmap;
 import android.os.Bundle;
 import android.view.View;
+import android.view.animation.AccelerateInterpolator;
+import android.view.animation.BounceInterpolator;
 import android.widget.ImageButton;
 import android.widget.ImageView;
 import android.widget.TextView;
@@ -42,8 +44,8 @@ import lu.circl.mispbump.security.DiffieHellman;
  */
 public class SyncActivity extends AppCompatActivity {
 
-    // layout
-    private CoordinatorLayout layout;
+    // rootLayout
+    private CoordinatorLayout rootLayout;
     private ImageView qrCodeView, bottomSheetIcon;
     private TextView bottomSheetText;
     private ImageButton prevButton, nextButton;
@@ -86,8 +88,8 @@ public class SyncActivity extends AppCompatActivity {
     }
 
     private void initializeViews() {
-        // Root Layout
-        layout = findViewById(R.id.rootLayout);
+
+        rootLayout = findViewById(R.id.rootLayout);
 
         // prev button
         prevButton = findViewById(R.id.prevButton);
@@ -196,7 +198,7 @@ public class SyncActivity extends AppCompatActivity {
                             }
                         });
                     } catch (InvalidKeySpecException | NoSuchAlgorithmException e) {
-                        Snackbar.make(layout, "Invalid key", Snackbar.LENGTH_SHORT).show();
+                        Snackbar.make(rootLayout, "Invalid key", Snackbar.LENGTH_SHORT).show();
                         cameraFragment.setReadQrEnabled(true);
                     }
                     break;
@@ -218,7 +220,7 @@ public class SyncActivity extends AppCompatActivity {
                         });
 
                     } catch (JsonSyntaxException e) {
-                        Snackbar.make(layout, "Sync information unreadable", Snackbar.LENGTH_SHORT).show();
+                        Snackbar.make(rootLayout, "Sync information unreadable", Snackbar.LENGTH_SHORT).show();
                         cameraFragment.setReadQrEnabled(true);
                     }
                     break;
@@ -403,7 +405,7 @@ public class SyncActivity extends AppCompatActivity {
         bottomSheetIcon.animate()
                 .scaleY(1f)
                 .scaleX(1f)
-                .setDuration(250);
+                .setDuration(500);
         bottomSheetBehavior.setState(BottomSheetBehavior.STATE_EXPANDED);
         bottomSheetBehavior.setSwipeable(true);
 
diff --git a/app/src/main/java/lu/circl/mispbump/activities/UploadInformationActivity.java b/app/src/main/java/lu/circl/mispbump/activities/UploadInformationActivity.java
index a211e58..48e7496 100644
--- a/app/src/main/java/lu/circl/mispbump/activities/UploadInformationActivity.java
+++ b/app/src/main/java/lu/circl/mispbump/activities/UploadInformationActivity.java
@@ -1,11 +1,22 @@
 package lu.circl.mispbump.activities;
 
-import androidx.appcompat.app.AppCompatActivity;
-
-import android.content.Intent;
+import android.animation.ValueAnimator;
+import android.content.res.ColorStateList;
+import android.graphics.Color;
+import android.graphics.drawable.ColorDrawable;
 import android.os.Bundle;
+import android.view.MenuItem;
+import android.view.View;
+import android.widget.ImageView;
 import android.widget.TextView;
 
+import androidx.annotation.Nullable;
+import androidx.appcompat.app.ActionBar;
+import androidx.appcompat.app.AppCompatActivity;
+import androidx.appcompat.widget.Toolbar;
+import androidx.core.widget.ImageViewCompat;
+
+import com.google.android.material.floatingactionbutton.FloatingActionButton;
 import com.google.gson.Gson;
 
 import lu.circl.mispbump.R;
@@ -15,15 +26,23 @@ public class UploadInformationActivity extends AppCompatActivity {
 
     public static String EXTRA_UPLOAD_INFO_KEY = "uploadInformation";
 
+    private View rootLayout;
+    private ImageView syncStatusIcon;
+
     private UploadInformation uploadInformation;
+    private FloatingActionButton fab;
+
 
     @Override
     protected void onCreate(Bundle savedInstanceState) {
         super.onCreate(savedInstanceState);
         setContentView(R.layout.activity_upload_information);
 
+
         parseExtra();
         init();
+        tintSystemBars();
+        populateContent();
     }
 
     private void parseExtra() {
@@ -32,8 +51,106 @@ public class UploadInformationActivity extends AppCompatActivity {
     }
 
     private void init() {
+        rootLayout = findViewById(R.id.rootLayout);
+
+        Toolbar toolbar = findViewById(R.id.toolbar);
+        setSupportActionBar(toolbar);
+
+        ActionBar actionBar = getSupportActionBar();
+        actionBar.setHomeAsUpIndicator(R.drawable.ic_close);
+        actionBar.setDisplayHomeAsUpEnabled(true);
+
+        fab = findViewById(R.id.fab);
+
+        syncStatusIcon = findViewById(R.id.syncStatus);
+    }
+
+    private void populateContent() {
+        switch (uploadInformation.getCurrentSyncStatus()) {
+            case COMPLETE:
+                ImageViewCompat.setImageTintList(syncStatusIcon, ColorStateList.valueOf(getColor(R.color.status_green)));
+                syncStatusIcon.setImageResource(R.drawable.ic_check_outline);
+                fab.hide();
+                break;
+            case FAILURE:
+                ImageViewCompat.setImageTintList(syncStatusIcon, ColorStateList.valueOf(getColor(R.color.status_red)));
+                syncStatusIcon.setImageResource(R.drawable.ic_error_outline);
+                break;
+            case PENDING:
+                ImageViewCompat.setImageTintList(syncStatusIcon, ColorStateList.valueOf(getColor(R.color.status_amber)));
+                syncStatusIcon.setImageResource(R.drawable.ic_info_outline);
+                break;
+        }
+
         TextView name = findViewById(R.id.orgName);
         name.setText(uploadInformation.getRemote().organisation.name);
     }
 
+    @Override
+    protected void onPostCreate(@Nullable Bundle savedInstanceState) {
+        super.onPostCreate(savedInstanceState);
+
+        fab.show();
+    }
+
+    @Override
+    public void postponeEnterTransition() {
+        super.postponeEnterTransition();
+        fab.show();
+    }
+
+    @Override
+    public void startPostponedEnterTransition() {
+        super.startPostponedEnterTransition();
+        fab.show();
+    }
+
+    private void tintSystemBars() {
+        // Initial colors of each system bar.
+        final int statusBarColor = getColor(R.color.white);
+        final int toolbarColor = getColor(R.color.white);
+
+        // Desired final colors of each bar.
+        final int statusBarToColor = getColor(R.color.colorPrimary);
+        final int toolbarToColor = getColor(R.color.colorPrimary);
+
+        ValueAnimator anim = ValueAnimator.ofFloat(0, 1);
+        anim.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
+            @Override
+            public void onAnimationUpdate(ValueAnimator animation) {
+                // Use animation position to blend colors.
+                float position = animation.getAnimatedFraction();
+
+                // Apply blended color to the status bar.
+                int blended = blendColors(statusBarColor, statusBarToColor, position);
+                getWindow().setStatusBarColor(blended);
+
+                blended = blendColors(toolbarColor, toolbarToColor, position);
+                getSupportActionBar().setBackgroundDrawable(new ColorDrawable(blended));
+            }
+        });
+
+        anim.setDuration(500).start();
+    }
+
+    private int blendColors(int from, int to, float ratio) {
+        final float inverseRatio = 1f - ratio;
+
+        final float r = Color.red(to) * ratio + Color.red(from) * inverseRatio;
+        final float g = Color.green(to) * ratio + Color.green(from) * inverseRatio;
+        final float b = Color.blue(to) * ratio + Color.blue(from) * inverseRatio;
+
+        return Color.rgb((int) r, (int) g, (int) b);
+    }
+
+    @Override
+    public boolean onOptionsItemSelected(MenuItem item) {
+        switch (item.getItemId()) {
+            case android.R.id.home:
+                onBackPressed();
+                return true;
+        }
+
+        return super.onOptionsItemSelected(item);
+    }
 }
diff --git a/app/src/main/java/lu/circl/mispbump/adapters/UploadInfoAdapter.java b/app/src/main/java/lu/circl/mispbump/adapters/UploadInfoAdapter.java
index 980dafa..bba9499 100644
--- a/app/src/main/java/lu/circl/mispbump/adapters/UploadInfoAdapter.java
+++ b/app/src/main/java/lu/circl/mispbump/adapters/UploadInfoAdapter.java
@@ -52,7 +52,7 @@ public class UploadInfoAdapter extends RecyclerView.Adapter<UploadInfoListViewHo
         switch (item.getCurrentSyncStatus()) {
             case COMPLETE:
                 ImageViewCompat.setImageTintList(holder.syncStatus, ColorStateList.valueOf(context.getColor(R.color.status_green)));
-                holder.syncStatus.setImageResource(R.drawable.ic_check);
+                holder.syncStatus.setImageResource(R.drawable.ic_check_outline);
                 break;
             case FAILURE:
                 ImageViewCompat.setImageTintList(holder.syncStatus, ColorStateList.valueOf(context.getColor(R.color.status_red)));
@@ -67,7 +67,7 @@ public class UploadInfoAdapter extends RecyclerView.Adapter<UploadInfoListViewHo
         holder.rootView.setOnClickListener(new View.OnClickListener() {
             @Override
             public void onClick(View view) {
-                onRecyclerItemClickListener.onClick(item);
+                onRecyclerItemClickListener.onClick(view, item);
             }
         });
     }
diff --git a/app/src/main/java/lu/circl/mispbump/interfaces/OnRecyclerItemClickListener.java b/app/src/main/java/lu/circl/mispbump/interfaces/OnRecyclerItemClickListener.java
index 1c1e198..ff670ec 100644
--- a/app/src/main/java/lu/circl/mispbump/interfaces/OnRecyclerItemClickListener.java
+++ b/app/src/main/java/lu/circl/mispbump/interfaces/OnRecyclerItemClickListener.java
@@ -1,5 +1,7 @@
 package lu.circl.mispbump.interfaces;
 
+import android.view.View;
+
 public interface OnRecyclerItemClickListener<T> {
-    void onClick(T item);
+    void onClick(View v, T item);
 }
diff --git a/app/src/main/res/anim/scale_vertical.xml b/app/src/main/res/anim/scale_vertical.xml
new file mode 100644
index 0000000..3c3b766
--- /dev/null
+++ b/app/src/main/res/anim/scale_vertical.xml
@@ -0,0 +1,13 @@
+<?xml version="1.0" encoding="utf-8"?>
+<set xmlns:android="http://schemas.android.com/apk/res/android">
+
+    <scale
+        android:duration="500"
+        android:fromXScale="1.0"
+        android:fromYScale="0.0"
+        android:pivotX="50%"
+        android:pivotY="10%"
+        android:toXScale="1.0"
+        android:toYScale="1.0" />
+
+</set>
\ No newline at end of file
diff --git a/app/src/main/res/drawable/ic_error_outline.xml b/app/src/main/res/drawable/ic_error_outline.xml
index 93db179..694bd6e 100644
--- a/app/src/main/res/drawable/ic_error_outline.xml
+++ b/app/src/main/res/drawable/ic_error_outline.xml
@@ -1,5 +1,5 @@
 <vector android:height="24dp" android:tint="#FFFFFF"
     android:viewportHeight="24.0" android:viewportWidth="24.0"
     android:width="24dp" xmlns:android="http://schemas.android.com/apk/res/android">
-    <path android:fillColor="#FF000000" android:pathData="M11,15h2v2h-2zM11,7h2v6h-2zM11.99,2C6.47,2 2,6.48 2,12s4.47,10 9.99,10C17.52,22 22,17.52 22,12S17.52,2 11.99,2zM12,20c-4.42,0 -8,-3.58 -8,-8s3.58,-8 8,-8 8,3.58 8,8 -3.58,8 -8,8z"/>
+    <path android:fillColor="#FFF" android:pathData="M11,15h2v2h-2zM11,7h2v6h-2zM11.99,2C6.47,2 2,6.48 2,12s4.47,10 9.99,10C17.52,22 22,17.52 22,12S17.52,2 11.99,2zM12,20c-4.42,0 -8,-3.58 -8,-8s3.58,-8 8,-8 8,3.58 8,8 -3.58,8 -8,8z"/>
 </vector>
diff --git a/app/src/main/res/drawable/ic_info_outline.xml b/app/src/main/res/drawable/ic_info_outline.xml
index af0d4d0..c3c23fd 100644
--- a/app/src/main/res/drawable/ic_info_outline.xml
+++ b/app/src/main/res/drawable/ic_info_outline.xml
@@ -1,5 +1,5 @@
 <vector android:height="24dp" android:tint="#FFFFFF"
     android:viewportHeight="24.0" android:viewportWidth="24.0"
     android:width="24dp" xmlns:android="http://schemas.android.com/apk/res/android">
-    <path android:fillColor="#FF000000" android:pathData="M11,17h2v-6h-2v6zM12,2C6.48,2 2,6.48 2,12s4.48,10 10,10 10,-4.48 10,-10S17.52,2 12,2zM12,20c-4.41,0 -8,-3.59 -8,-8s3.59,-8 8,-8 8,3.59 8,8 -3.59,8 -8,8zM11,9h2L13,7h-2v2z"/>
+    <path android:fillColor="#FFF" android:pathData="M11,17h2v-6h-2v6zM12,2C6.48,2 2,6.48 2,12s4.48,10 10,10 10,-4.48 10,-10S17.52,2 12,2zM12,20c-4.41,0 -8,-3.59 -8,-8s3.59,-8 8,-8 8,3.59 8,8 -3.59,8 -8,8zM11,9h2L13,7h-2v2z"/>
 </vector>
diff --git a/app/src/main/res/layout/activity_upload_information.xml b/app/src/main/res/layout/activity_upload_information.xml
index a0f7358..017a195 100644
--- a/app/src/main/res/layout/activity_upload_information.xml
+++ b/app/src/main/res/layout/activity_upload_information.xml
@@ -1,22 +1,71 @@
 <?xml version="1.0" encoding="utf-8"?>
-<androidx.constraintlayout.widget.ConstraintLayout
+<androidx.coordinatorlayout.widget.CoordinatorLayout
     xmlns:android="http://schemas.android.com/apk/res/android"
     xmlns:app="http://schemas.android.com/apk/res-auto"
     xmlns:tools="http://schemas.android.com/tools"
+    android:id="@+id/rootLayout"
+    android:transitionName="root"
     android:layout_width="match_parent"
     android:layout_height="match_parent"
-    tools:context=".activities.UploadInformationActivity">
+    android:elevation="6dp"
+    app:elevation="6dp">
 
-    <TextView
-        android:id="@+id/orgName"
-        android:layout_width="0dp"
+    <com.google.android.material.appbar.AppBarLayout
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content">
+
+        <androidx.appcompat.widget.Toolbar
+            android:id="@+id/toolbar"
+            android:layout_width="match_parent"
+            android:layout_height="?attr/actionBarSize"
+            app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
+            app:popupTheme="@style/ThemeOverlay.AppCompat"
+            android:background="@color/white" />
+    </com.google.android.material.appbar.AppBarLayout>
+
+    <androidx.constraintlayout.widget.ConstraintLayout
+        app:layout_behavior="com.google.android.material.appbar.AppBarLayout$ScrollingViewBehavior"
+        android:layout_width="match_parent"
+        android:layout_height="match_parent">
+
+        <ImageView
+            android:id="@+id/syncStatus"
+            android:transitionName="icon"
+            android:transformPivotX="32dp"
+            android:transformPivotY="32dp"
+            android:layout_width="64dp"
+            android:layout_height="64dp"
+            android:tint="@color/status_green"
+            android:layout_marginStart="8dp"
+            android:layout_marginTop="16dp"
+            android:layout_marginEnd="8dp"
+            android:src="@drawable/ic_check_outline"
+            app:layout_constraintEnd_toEndOf="parent"
+            app:layout_constraintStart_toStartOf="parent"
+            app:layout_constraintTop_toTopOf="parent" />
+
+        <TextView
+            android:id="@+id/orgName"
+            android:transitionName="title"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:layout_marginStart="8dp"
+            android:layout_marginTop="16dp"
+            android:layout_marginEnd="8dp"
+            android:textAppearance="@style/Text.Title"
+            app:layout_constraintEnd_toEndOf="parent"
+            app:layout_constraintStart_toStartOf="parent"
+            app:layout_constraintTop_toBottomOf="@+id/syncStatus"
+            tools:text="Organisation Title" />
+
+    </androidx.constraintlayout.widget.ConstraintLayout>
+
+    <com.google.android.material.floatingactionbutton.FloatingActionButton
+        android:id="@+id/fab"
+        android:layout_width="wrap_content"
         android:layout_height="wrap_content"
-        android:layout_marginStart="16dp"
-        android:layout_marginTop="16dp"
-        android:layout_marginEnd="16dp"
-        app:layout_constraintEnd_toEndOf="parent"
-        app:layout_constraintStart_toStartOf="parent"
-        app:layout_constraintTop_toTopOf="parent" />
+        android:layout_gravity="bottom|end"
+        android:layout_margin="16dp"
+        android:src="@drawable/ic_cloud_upload"/>
 
-
-</androidx.constraintlayout.widget.ConstraintLayout>
\ No newline at end of file
+</androidx.coordinatorlayout.widget.CoordinatorLayout>
\ No newline at end of file
diff --git a/app/src/main/res/layout/row_upload_information.xml b/app/src/main/res/layout/row_upload_information.xml
index f7a5b45..32d35a2 100644
--- a/app/src/main/res/layout/row_upload_information.xml
+++ b/app/src/main/res/layout/row_upload_information.xml
@@ -4,15 +4,20 @@
     xmlns:android="http://schemas.android.com/apk/res/android"
     xmlns:app="http://schemas.android.com/apk/res-auto"
     xmlns:tools="http://schemas.android.com/tools"
-    android:id="@+id/header"
+    android:id="@+id/rootLayout"
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
     android:background="@color/white"
     android:foreground="?attr/selectableItemBackground"
-    android:layout_marginBottom="1dp">
+    android:layout_marginBottom="1dp"
+    android:padding="8dp"
+    android:transitionName="root">
 
     <ImageView
         android:id="@+id/syncStatus"
+        android:transitionName="icon"
+        android:transformPivotX="12dp"
+        android:transformPivotY="12dp"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_marginStart="16dp"
@@ -26,6 +31,7 @@
 
     <TextView
         android:id="@+id/orgName"
+        android:transitionName="title"
         android:layout_width="0dp"
         android:layout_height="wrap_content"
         android:layout_marginStart="16dp"
diff --git a/app/src/main/res/transition/simple.xml b/app/src/main/res/transition/simple.xml
new file mode 100644
index 0000000..f903d98
--- /dev/null
+++ b/app/src/main/res/transition/simple.xml
@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="utf-8"?>
+<transitionSet xmlns:android="http://schemas.android.com/apk/res/android">
+    <changeBounds/>
+    <!--<fade-->
+        <!--android:fadingMode="fade_in_out"/>-->
+
+    <!--<transition class="lu.circl.mispbump.RecyclerViewItemTransition"/>-->
+</transitionSet>
\ No newline at end of file
diff --git a/app/src/main/res/values/colors.xml b/app/src/main/res/values/colors.xml
index cc2e9fc..d7be4be 100644
--- a/app/src/main/res/values/colors.xml
+++ b/app/src/main/res/values/colors.xml
@@ -11,6 +11,9 @@
     <!-- colors -->
     <color name="white">#FFFFFF</color>
     <color name="white_50">#80FFFFFF</color>
+
+    <color name="grey">#BDBDBD</color>
+
     <color name="status_green">#4CAF50</color>
     <color name="status_amber">#FB8C00</color>
     <color name="status_red">#E53935</color>
diff --git a/app/src/main/res/values/styles.xml b/app/src/main/res/values/styles.xml
index 6aba1c4..45a61b0 100644
--- a/app/src/main/res/values/styles.xml
+++ b/app/src/main/res/values/styles.xml
@@ -5,6 +5,17 @@
         <item name="colorPrimary">@color/colorPrimary</item>
         <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
         <item name="colorAccent">@color/colorAccent</item>
+
+        <item name="android:windowContentTransitions">true</item>
+
+        <!-- specify enter and exit transitions -->
+        <!-- options are: explode, slide, fade -->
+        <!--<item name="android:windowEnterTransition">@transition/simple</item>-->
+        <!--<item name="android:windowExitTransition">@transition/simple</item>-->
+
+         <!--specify shared element transitions -->
+        <item name="android:windowSharedElementEnterTransition">@transition/simple</item>
+        <item name="android:windowSharedElementExitTransition">@transition/simple</item>
     </style>
 
     <style name="AppTheme.Translucent">