Spark animations for boost/favourite buttons

This commit is contained in:
Eugen Rochko 2017-03-07 22:23:17 +01:00
parent 2c8a575a3b
commit 1db90db642
10 changed files with 83 additions and 33 deletions

View File

@ -32,5 +32,6 @@ dependencies {
compile 'com.android.support:design:25.1.0' compile 'com.android.support:design:25.1.0'
compile 'com.squareup.picasso:picasso:2.5.2' compile 'com.squareup.picasso:picasso:2.5.2'
compile 'com.pkmmte.view:circularimageview:1.1' compile 'com.pkmmte.view:circularimageview:1.1'
compile 'com.github.peter9870:sparkbutton:master'
testCompile 'junit:junit:4.12' testCompile 'junit:junit:4.12'
} }

View File

@ -34,6 +34,9 @@ import android.widget.ToggleButton;
import com.android.volley.toolbox.ImageLoader; import com.android.volley.toolbox.ImageLoader;
import com.android.volley.toolbox.NetworkImageView; import com.android.volley.toolbox.NetworkImageView;
import com.squareup.picasso.Picasso; import com.squareup.picasso.Picasso;
import com.varunest.sparkbutton.SparkButton;
import com.varunest.sparkbutton.SparkButtonBuilder;
import com.varunest.sparkbutton.SparkEventListener;
import java.util.Date; import java.util.Date;
@ -47,8 +50,8 @@ class StatusViewHolder extends RecyclerView.ViewHolder {
private View rebloggedBar; private View rebloggedBar;
private TextView rebloggedByDisplayName; private TextView rebloggedByDisplayName;
private ImageButton replyButton; private ImageButton replyButton;
private ImageButton reblogButton; private SparkButton reblogButton;
private ImageButton favouriteButton; private SparkButton favouriteButton;
private ImageButton moreButton; private ImageButton moreButton;
private boolean favourited; private boolean favourited;
private boolean reblogged; private boolean reblogged;
@ -72,8 +75,8 @@ class StatusViewHolder extends RecyclerView.ViewHolder {
rebloggedBar = itemView.findViewById(R.id.status_reblogged_bar); rebloggedBar = itemView.findViewById(R.id.status_reblogged_bar);
rebloggedByDisplayName = (TextView) itemView.findViewById(R.id.status_reblogged); rebloggedByDisplayName = (TextView) itemView.findViewById(R.id.status_reblogged);
replyButton = (ImageButton) itemView.findViewById(R.id.status_reply); replyButton = (ImageButton) itemView.findViewById(R.id.status_reply);
reblogButton = (ImageButton) itemView.findViewById(R.id.status_reblog); reblogButton = (SparkButton) itemView.findViewById(R.id.status_reblog);
favouriteButton = (ImageButton) itemView.findViewById(R.id.status_favourite); favouriteButton = (SparkButton) itemView.findViewById(R.id.status_favourite);
moreButton = (ImageButton) itemView.findViewById(R.id.status_more); moreButton = (ImageButton) itemView.findViewById(R.id.status_more);
reblogged = false; reblogged = false;
favourited = false; favourited = false;
@ -187,35 +190,25 @@ class StatusViewHolder extends RecyclerView.ViewHolder {
private void setReblogged(boolean reblogged) { private void setReblogged(boolean reblogged) {
this.reblogged = reblogged; this.reblogged = reblogged;
int attribute; reblogButton.setChecked(reblogged);
if (reblogged) {
attribute = R.attr.status_reblog_button_marked_tint;
} else {
attribute = R.attr.status_reblog_button_tint;
}
ThemeUtils.setImageViewTint(reblogButton, attribute);
} }
/** This should only be called after setReblogged, in order to override the tint correctly. */ /** This should only be called after setReblogged, in order to override the tint correctly. */
private void setRebloggingEnabled(boolean enabled) { private void setRebloggingEnabled(boolean enabled) {
reblogButton.setEnabled(enabled); reblogButton.setEnabled(enabled);
if (enabled) { if (enabled) {
reblogButton.setImageResource(R.drawable.ic_repeat_24dp); reblogButton.setInactiveImage(R.drawable.reblog_inactive);
reblogButton.setActiveImage(R.drawable.reblog_active);
} else { } else {
ThemeUtils.setImageViewTint(reblogButton, R.attr.status_reblog_button_disabled_tint); reblogButton.setInactiveImage(R.drawable.reblog_disabled);
reblogButton.setImageResource(R.drawable.ic_lock_24dp); reblogButton.setActiveImage(R.drawable.reblog_disabled);
} }
} }
private void setFavourited(boolean favourited) { private void setFavourited(boolean favourited) {
this.favourited = favourited; this.favourited = favourited;
int attribute; favouriteButton.setChecked(favourited);
if (favourited) {
attribute = R.attr.status_favourite_button_marked_tint;
} else {
attribute = R.attr.status_favourite_button_tint;
}
ThemeUtils.setImageViewTint(favouriteButton, attribute);
} }
private void setMediaPreviews(final Status.MediaAttachment[] attachments, private void setMediaPreviews(final Status.MediaAttachment[] attachments,
@ -313,15 +306,15 @@ class StatusViewHolder extends RecyclerView.ViewHolder {
listener.onReply(getAdapterPosition()); listener.onReply(getAdapterPosition());
} }
}); });
reblogButton.setOnClickListener(new View.OnClickListener() { reblogButton.setEventListener(new SparkEventListener() {
@Override @Override
public void onClick(View v) { public void onEvent(ImageView button, boolean buttonState) {
listener.onReblog(!reblogged, getAdapterPosition()); listener.onReblog(!reblogged, getAdapterPosition());
} }
}); });
favouriteButton.setOnClickListener(new View.OnClickListener() { favouriteButton.setEventListener(new SparkEventListener() {
@Override @Override
public void onClick(View v) { public void onEvent(ImageView button, boolean buttonState) {
listener.onFavourite(!favourited, getAdapterPosition()); listener.onFavourite(!favourited, getAdapterPosition());
} }
}); });

View File

@ -0,0 +1,9 @@
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="24dp"
android:height="24dp"
android:viewportWidth="24.0"
android:viewportHeight="24.0">
<path
android:fillColor="@color/status_favourite_button_marked_dark"
android:pathData="M12,17.27L18.18,21l-1.64,-7.03L22,9.24l-7.19,-0.61L12,2 9.19,8.63 2,9.24l5.46,4.73L5.82,21z"/>
</vector>

View File

@ -0,0 +1,9 @@
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="24dp"
android:height="24dp"
android:viewportWidth="24.0"
android:viewportHeight="24.0">
<path
android:fillColor="@color/status_favourite_button_dark"
android:pathData="M12,17.27L18.18,21l-1.64,-7.03L22,9.24l-7.19,-0.61L12,2 9.19,8.63 2,9.24l5.46,4.73L5.82,21z"/>
</vector>

View File

@ -0,0 +1,9 @@
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="24dp"
android:height="24dp"
android:viewportWidth="24.0"
android:viewportHeight="24.0">
<path
android:fillColor="@color/status_reblog_button_marked_dark"
android:pathData="M7,7h10v3l4,-4 -4,-4v3L5,5v6h2L7,7zM17,17L7,17v-3l-4,4 4,4v-3h12v-6h-2v4z"/>
</vector>

View File

@ -0,0 +1,9 @@
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="24dp"
android:height="24dp"
android:viewportWidth="24.0"
android:viewportHeight="24.0">
<path
android:fillColor="@color/status_reblog_button_disabled_dark"
android:pathData="M18,8h-1L17,6c0,-2.76 -2.24,-5 -5,-5S7,3.24 7,6v2L6,8c-1.1,0 -2,0.9 -2,2v10c0,1.1 0.9,2 2,2h12c1.1,0 2,-0.9 2,-2L20,10c0,-1.1 -0.9,-2 -2,-2zM12,17c-1.1,0 -2,-0.9 -2,-2s0.9,-2 2,-2 2,0.9 2,2 -0.9,2 -2,2zM15.1,8L8.9,8L8.9,6c0,-1.71 1.39,-3.1 3.1,-3.1 1.71,0 3.1,1.39 3.1,3.1v2z"/>
</vector>

View File

@ -0,0 +1,9 @@
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="24dp"
android:height="24dp"
android:viewportWidth="24.0"
android:viewportHeight="24.0">
<path
android:fillColor="@color/status_reblog_button_dark"
android:pathData="M7,7h10v3l4,-4 -4,-4v3L5,5v6h2L7,7zM17,17L7,17v-3l-4,4 4,4v-3h12v-6h-2v4z"/>
</vector>

View File

@ -227,6 +227,8 @@
android:layout_height="wrap_content" android:layout_height="wrap_content"
android:layout_below="@id/status_media_preview_container" android:layout_below="@id/status_media_preview_container"
android:layout_toRightOf="@+id/status_avatar" android:layout_toRightOf="@+id/status_avatar"
android:clipChildren="false"
android:clipToPadding="false"
android:paddingBottom="8dp" android:paddingBottom="8dp"
android:paddingTop="6dp"> android:paddingTop="6dp">
@ -242,10 +244,14 @@
android:layout_height="match_parent" android:layout_height="match_parent"
android:layout_weight="1" /> android:layout_weight="1" />
<ImageButton <com.varunest.sparkbutton.SparkButton
app:srcCompat="@drawable/ic_repeat_24dp"
android:id="@+id/status_reblog" android:id="@+id/status_reblog"
style="?attr/image_button_style" app:sparkbutton_activeImage="@drawable/reblog_active"
app:sparkbutton_inActiveImage="@drawable/reblog_inactive"
app:sparkbutton_iconSize="28dp"
android:layout_gravity="center"
app:sparkbutton_primaryColor="@color/status_reblog_button_marked_dark"
app:sparkbutton_secondaryColor="@color/status_reblog_button_marked_light"
android:layout_width="32dp" android:layout_width="32dp"
android:layout_height="32dp" /> android:layout_height="32dp" />
@ -254,11 +260,15 @@
android:layout_height="match_parent" android:layout_height="match_parent"
android:layout_weight="1" /> android:layout_weight="1" />
<ImageButton <com.varunest.sparkbutton.SparkButton
android:layout_width="32dp" android:layout_width="32dp"
android:layout_height="32dp" android:layout_height="32dp"
style="?attr/image_button_style" app:sparkbutton_activeImage="@drawable/favourite_active"
app:srcCompat="@drawable/ic_star_24dp" app:sparkbutton_inActiveImage="@drawable/favourite_inactive"
app:sparkbutton_iconSize="28dp"
android:layout_gravity="center"
app:sparkbutton_primaryColor="@color/status_favourite_button_marked_light"
app:sparkbutton_secondaryColor="?attr/status_favourite_button_marked_tint"
android:id="@+id/status_favourite" /> android:id="@+id/status_favourite" />
<Space <Space

View File

@ -56,10 +56,10 @@
<color name="toolbar_icon_light">#000000</color> <color name="toolbar_icon_light">#000000</color>
<color name="image_button_light">#2F2F2F</color> <color name="image_button_light">#2F2F2F</color>
<color name="status_reblog_button_light">#4F4F4F</color> <color name="status_reblog_button_light">#4F4F4F</color>
<color name="status_reblog_button_marked_light">#009F6F</color> <color name="status_reblog_button_marked_light">#56a7e1</color>
<color name="status_reblog_button_disabled_light">#BFBFBF</color> <color name="status_reblog_button_disabled_light">#BFBFBF</color>
<color name="status_favourite_button_light">#4F4F4F</color> <color name="status_favourite_button_light">#4F4F4F</color>
<color name="status_favourite_button_marked_light">#ffec21</color> <color name="status_favourite_button_marked_light">#fab207</color>
<color name="sensitive_media_warning_background_light">#B0B0B0</color> <color name="sensitive_media_warning_background_light">#B0B0B0</color>
<color name="media_preview_unloaded_background_light">#CFCFCF</color> <color name="media_preview_unloaded_background_light">#CFCFCF</color>
<color name="status_text_secondary_light">#34444C</color> <color name="status_text_secondary_light">#34444C</color>

View File

@ -15,6 +15,7 @@ buildscript {
allprojects { allprojects {
repositories { repositories {
jcenter() jcenter()
maven { url "https://jitpack.io" }
} }
} }