add transition to uploadInfo detail view

pull/5/head
Felix Prahl-Kamps 2019-06-21 13:05:04 +02:00
parent 7123bea567
commit 48674d130a
16 changed files with 312 additions and 45 deletions

View File

@ -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">

View File

@ -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"

View File

@ -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;
}
}

View File

@ -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());
}
});

View File

@ -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);

View File

@ -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);
}
}

View File

@ -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);
}
});
}

View File

@ -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);
}

View File

@ -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>

View File

@ -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>

View File

@ -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>

View File

@ -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>
</androidx.coordinatorlayout.widget.CoordinatorLayout>

View File

@ -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"

View File

@ -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>

View File

@ -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>

View File

@ -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">