Dbrant has uploaded a new change for review.
https://gerrit.wikimedia.org/r/295550
Change subject: Color extraction for large feed card images.
......................................................................
Color extraction for large feed card images.
- Moved the old ImageViewWithFace to a more general location.
- Made CardLargeHeaderView use the color extraction feature, and set its
own background based on the extracted color.
- Made a performance improvement in FeedRecyclerAdapter, wherein it no
longer unconditionally reloads the entire child View structure for every
card. Instead, it now checks if a Card is being loaded into the same
View.
Change-Id: I4cdf6599f2e064b37d6f239e09fe2a515130c66c
---
M app/src/main/java/org/wikipedia/feed/view/CardLargeHeaderView.java
M app/src/main/java/org/wikipedia/feed/view/FeedRecyclerAdapter.java
M app/src/main/java/org/wikipedia/page/leadimages/ArticleHeaderImageView.java
M app/src/main/java/org/wikipedia/page/leadimages/ArticleHeaderView.java
M app/src/main/java/org/wikipedia/page/leadimages/LeadImagesHandler.java
R app/src/main/java/org/wikipedia/views/FaceAndColorDetectImageView.java
M app/src/main/res/layout/view_article_header_image.xml
M app/src/main/res/layout/view_card_header_large.xml
8 files changed, 80 insertions(+), 22 deletions(-)
git pull ssh://gerrit.wikimedia.org:29418/apps/android/wikipedia
refs/changes/50/295550/1
diff --git a/app/src/main/java/org/wikipedia/feed/view/CardLargeHeaderView.java
b/app/src/main/java/org/wikipedia/feed/view/CardLargeHeaderView.java
index af8592b..444e1f5 100644
--- a/app/src/main/java/org/wikipedia/feed/view/CardLargeHeaderView.java
+++ b/app/src/main/java/org/wikipedia/feed/view/CardLargeHeaderView.java
@@ -1,23 +1,28 @@
package org.wikipedia.feed.view;
+import android.animation.ArgbEvaluator;
+import android.animation.ObjectAnimator;
import android.content.Context;
+import android.graphics.PointF;
import android.net.Uri;
+import android.support.annotation.ColorInt;
import android.support.annotation.NonNull;
import android.support.annotation.Nullable;
import android.support.annotation.StringRes;
+import android.view.View;
import android.widget.LinearLayout;
import android.widget.TextView;
-import com.facebook.drawee.view.SimpleDraweeView;
-
import org.wikipedia.R;
+import org.wikipedia.views.FaceAndColorDetectImageView;
import org.wikipedia.views.GoneIfEmptyTextView;
import butterknife.BindView;
import butterknife.ButterKnife;
public class CardLargeHeaderView extends LinearLayout {
- @BindView(R.id.view_card_header_large_image) SimpleDraweeView imageView;
+ @BindView(R.id.view_card_header_large_background) View backgroundView;
+ @BindView(R.id.view_card_header_large_image) FaceAndColorDetectImageView
imageView;
@BindView(R.id.view_card_header_large_title) TextView titleView;
@BindView(R.id.view_card_header_large_page_title) TextView pageTitleView;
@BindView(R.id.view_card_header_large_subtitle) GoneIfEmptyTextView
subtitleView;
@@ -27,10 +32,15 @@
inflate(getContext(), R.layout.view_card_header_large, this);
ButterKnife.bind(this);
+ imageView.setOnImageLoadListener(new ImageLoadListener());
+ resetBackgroundColor();
}
@NonNull public CardLargeHeaderView setImage(@Nullable Uri uri) {
- imageView.setImageURI(uri);
+ imageView.setVisibility(uri == null ? GONE : VISIBLE);
+ if (uri != null) {
+ imageView.loadImage(uri);
+ }
return this;
}
@@ -53,4 +63,33 @@
pageTitleView.setText(title);
return this;
}
+
+ private void resetBackgroundColor() {
+
backgroundView.setBackgroundColor(getResources().getColor(R.color.gray_background));
+ }
+
+ private class ImageLoadListener implements
FaceAndColorDetectImageView.OnImageLoadListener {
+ @Override
+ public void onImageLoaded(final int bmpHeight, @Nullable final PointF
faceLocation, @ColorInt final int mainColor) {
+ backgroundView.post(new Runnable() {
+ @Override
+ public void run() {
+ animateBackgroundColor(backgroundView, mainColor);
+ }
+ });
+ }
+
+ @Override
+ public void onImageFailed() {
+ resetBackgroundColor();
+ }
+
+ public void animateBackgroundColor(@NonNull View view, @ColorInt int
targetColor) {
+ final int animDuration = 500;
+ final ObjectAnimator animator =
ObjectAnimator.ofObject(view.getBackground(), "color",
+ new ArgbEvaluator(), targetColor);
+ animator.setDuration(animDuration);
+ animator.start();
+ }
+ }
}
\ No newline at end of file
diff --git a/app/src/main/java/org/wikipedia/feed/view/FeedRecyclerAdapter.java
b/app/src/main/java/org/wikipedia/feed/view/FeedRecyclerAdapter.java
index 5e4962a..cbc5139 100644
--- a/app/src/main/java/org/wikipedia/feed/view/FeedRecyclerAdapter.java
+++ b/app/src/main/java/org/wikipedia/feed/view/FeedRecyclerAdapter.java
@@ -40,6 +40,12 @@
Card item = item(position);
CardView view = holder.getView();
+ if (isCardAssociatedWithView(view, item)) {
+ // Don't bother reloading the same card into the same view
+ return;
+ }
+ associateCardWithView(view, item);
+
if (view instanceof IntegerListCardView) {
((IntegerListCardView) view).set((IntegerListCard) item);
} else if (view instanceof ContinueReadingCardView) {
@@ -88,4 +94,12 @@
throw new IllegalArgumentException("viewType=" + viewType);
}
}
+
+ private boolean isCardAssociatedWithView(@NonNull CardView view, @NonNull
Card card) {
+ return card.equals(view.getTag());
+ }
+
+ private void associateCardWithView(@NonNull CardView view, @NonNull Card
card) {
+ view.setTag(card);
+ }
}
diff --git
a/app/src/main/java/org/wikipedia/page/leadimages/ArticleHeaderImageView.java
b/app/src/main/java/org/wikipedia/page/leadimages/ArticleHeaderImageView.java
index aeeb195..b559341 100644
---
a/app/src/main/java/org/wikipedia/page/leadimages/ArticleHeaderImageView.java
+++
b/app/src/main/java/org/wikipedia/page/leadimages/ArticleHeaderImageView.java
@@ -3,18 +3,21 @@
import android.annotation.TargetApi;
import android.content.Context;
import android.graphics.PointF;
+import android.net.Uri;
import android.os.Build;
import android.support.annotation.Nullable;
+import android.text.TextUtils;
import android.util.AttributeSet;
import android.widget.FrameLayout;
import org.wikipedia.R;
+import org.wikipedia.views.FaceAndColorDetectImageView;
import butterknife.BindView;
import butterknife.ButterKnife;
public class ArticleHeaderImageView extends FrameLayout {
- @BindView(R.id.view_article_header_image_image) ImageViewWithFace image;
+ @BindView(R.id.view_article_header_image_image)
FaceAndColorDetectImageView image;
public ArticleHeaderImageView(Context context) {
super(context);
@@ -37,16 +40,16 @@
init();
}
- public void setLoadListener(@Nullable
ImageViewWithFace.OnImageLoadListener listener) {
+ public void setLoadListener(@Nullable
FaceAndColorDetectImageView.OnImageLoadListener listener) {
image.setOnImageLoadListener(listener);
}
public void load(@Nullable String url) {
- if (url == null) {
+ if (TextUtils.isEmpty(url)) {
setVisibility(GONE);
} else {
setVisibility(VISIBLE);
- image.loadImage(url);
+ image.loadImage(Uri.parse(url));
}
}
@@ -64,7 +67,7 @@
return getVisibility() != GONE;
}
- public ImageViewWithFace getImage() {
+ public FaceAndColorDetectImageView getImage() {
return image;
}
diff --git
a/app/src/main/java/org/wikipedia/page/leadimages/ArticleHeaderView.java
b/app/src/main/java/org/wikipedia/page/leadimages/ArticleHeaderView.java
index ecbf8e5..da3b18e 100644
--- a/app/src/main/java/org/wikipedia/page/leadimages/ArticleHeaderView.java
+++ b/app/src/main/java/org/wikipedia/page/leadimages/ArticleHeaderView.java
@@ -31,7 +31,6 @@
import org.wikipedia.media.AvPlayer;
import org.wikipedia.media.DefaultAvPlayer;
import org.wikipedia.media.MediaPlayerImplementation;
-import org.wikipedia.page.leadimages.ImageViewWithFace.OnImageLoadListener;
import org.wikipedia.richtext.LeadingSpan;
import org.wikipedia.richtext.ParagraphSpan;
import org.wikipedia.richtext.AudioUrlSpan;
@@ -40,6 +39,7 @@
import org.wikipedia.util.GradientUtil;
import org.wikipedia.util.StringUtil;
import org.wikipedia.views.AppTextView;
+import org.wikipedia.views.FaceAndColorDetectImageView;
import org.wikipedia.views.ObservableWebView;
import org.wikipedia.views.ViewUtil;
@@ -114,7 +114,7 @@
return image.getImage();
}
- public void setOnImageLoadListener(@Nullable OnImageLoadListener listener)
{
+ public void setOnImageLoadListener(@Nullable
FaceAndColorDetectImageView.OnImageLoadListener listener) {
image.setLoadListener(listener);
}
diff --git
a/app/src/main/java/org/wikipedia/page/leadimages/LeadImagesHandler.java
b/app/src/main/java/org/wikipedia/page/leadimages/LeadImagesHandler.java
index 3b4a696..f05fdb1 100755
--- a/app/src/main/java/org/wikipedia/page/leadimages/LeadImagesHandler.java
+++ b/app/src/main/java/org/wikipedia/page/leadimages/LeadImagesHandler.java
@@ -28,6 +28,7 @@
import org.wikipedia.readinglist.AddToReadingListDialog;
import org.wikipedia.util.DimenUtil;
import org.wikipedia.util.UriUtil;
+import org.wikipedia.views.FaceAndColorDetectImageView;
import org.wikipedia.views.ObservableWebView;
import static org.wikipedia.util.DimenUtil.getContentTopOffsetPx;
@@ -358,7 +359,7 @@
}
}
- private class ImageLoadListener implements
ImageViewWithFace.OnImageLoadListener {
+ private class ImageLoadListener implements
FaceAndColorDetectImageView.OnImageLoadListener {
@Override
public void onImageLoaded(final int bmpHeight, @Nullable final PointF
faceLocation, @ColorInt final int mainColor) {
articleHeaderView.post(new Runnable() {
diff --git
a/app/src/main/java/org/wikipedia/page/leadimages/ImageViewWithFace.java
b/app/src/main/java/org/wikipedia/views/FaceAndColorDetectImageView.java
similarity index 92%
rename from
app/src/main/java/org/wikipedia/page/leadimages/ImageViewWithFace.java
rename to app/src/main/java/org/wikipedia/views/FaceAndColorDetectImageView.java
index ec261f9..50f3ae1 100644
--- a/app/src/main/java/org/wikipedia/page/leadimages/ImageViewWithFace.java
+++ b/app/src/main/java/org/wikipedia/views/FaceAndColorDetectImageView.java
@@ -1,4 +1,4 @@
-package org.wikipedia.page.leadimages;
+package org.wikipedia.views;
import android.content.Context;
import android.graphics.Bitmap;
@@ -25,7 +25,7 @@
import org.wikipedia.R;
import org.wikipedia.util.log.L;
-public class ImageViewWithFace extends SimpleDraweeView {
+public class FaceAndColorDetectImageView extends SimpleDraweeView {
private static final int BITMAP_COPY_WIDTH = 200;
public interface OnImageLoadListener {
@@ -36,15 +36,15 @@
private FacePostprocessor facePostprocessor = new FacePostprocessor();
@NonNull private OnImageLoadListener listener = new DefaultListener();
- public ImageViewWithFace(Context context) {
+ public FaceAndColorDetectImageView(Context context) {
super(context);
}
- public ImageViewWithFace(Context context, AttributeSet attrs) {
+ public FaceAndColorDetectImageView(Context context, AttributeSet attrs) {
super(context, attrs);
}
- public ImageViewWithFace(Context context, AttributeSet attrs, int
defStyle) {
+ public FaceAndColorDetectImageView(Context context, AttributeSet attrs,
int defStyle) {
super(context, attrs, defStyle);
}
@@ -52,8 +52,8 @@
this.listener = listener == null ? new DefaultListener() : listener;
}
- public void loadImage(String url) {
- ImageRequest request =
ImageRequestBuilder.newBuilderWithSource(Uri.parse(url))
+ public void loadImage(@NonNull Uri uri) {
+ ImageRequest request = ImageRequestBuilder.newBuilderWithSource(uri)
.setProgressiveRenderingEnabled(true)
.setPostprocessor(facePostprocessor)
.build();
diff --git a/app/src/main/res/layout/view_article_header_image.xml
b/app/src/main/res/layout/view_article_header_image.xml
index ed393e6..2ec7fe9 100644
--- a/app/src/main/res/layout/view_article_header_image.xml
+++ b/app/src/main/res/layout/view_article_header_image.xml
@@ -11,7 +11,7 @@
android:src="?lead_image_drawable"
android:contentDescription="@null" />
- <org.wikipedia.page.leadimages.ImageViewWithFace
+ <org.wikipedia.views.FaceAndColorDetectImageView
android:id="@+id/view_article_header_image_image"
android:layout_width="match_parent"
android:layout_height="match_parent"
diff --git a/app/src/main/res/layout/view_card_header_large.xml
b/app/src/main/res/layout/view_card_header_large.xml
index 7024397..33d3a0f 100644
--- a/app/src/main/res/layout/view_card_header_large.xml
+++ b/app/src/main/res/layout/view_card_header_large.xml
@@ -9,6 +9,7 @@
android:orientation="horizontal">
<LinearLayout
+ android:id="@+id/view_card_header_large_background"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
@@ -64,8 +65,8 @@
</LinearLayout>
- <com.facebook.drawee.view.SimpleDraweeView
- style="@style/SimpleDraweeViewPlaceholder.Article"
+ <org.wikipedia.views.FaceAndColorDetectImageView
+ style="@style/SimpleDraweeViewPlaceholder"
android:id="@+id/view_card_header_large_image"
android:layout_width="128dp"
android:layout_height="match_parent" />
--
To view, visit https://gerrit.wikimedia.org/r/295550
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: newchange
Gerrit-Change-Id: I4cdf6599f2e064b37d6f239e09fe2a515130c66c
Gerrit-PatchSet: 1
Gerrit-Project: apps/android/wikipedia
Gerrit-Branch: master
Gerrit-Owner: Dbrant <dbr...@wikimedia.org>
_______________________________________________
MediaWiki-commits mailing list
MediaWiki-commits@lists.wikimedia.org
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
