diff --git a/WordPress/src/main/java/org/wordpress/android/ui/ActionableEmptyView.kt b/WordPress/src/main/java/org/wordpress/android/ui/ActionableEmptyView.kt
new file mode 100644
index 000000000000..0f4ec879ca06
--- /dev/null
+++ b/WordPress/src/main/java/org/wordpress/android/ui/ActionableEmptyView.kt
@@ -0,0 +1,91 @@
+package org.wordpress.android.ui
+
+import android.content.Context
+import android.support.annotation.DrawableRes
+import android.support.annotation.NonNull
+import android.support.v7.widget.AppCompatButton
+import android.util.AttributeSet
+import android.view.View
+import android.widget.ImageView
+import android.widget.LinearLayout
+import org.wordpress.android.R
+import org.wordpress.android.widgets.WPTextView
+
+/**
+ * View shown when screen is in an empty state. It contains the following:
+ * - Image showing related illustration (optional)
+ * - Title describing cause for empty state (required)
+ * - Subtitle detailing cause for empty state (optional)
+ * - Button providing action to take (optional)
+ */
+class ActionableEmptyView : LinearLayout {
+ lateinit var button: AppCompatButton
+ lateinit var image: ImageView
+ lateinit var subtitle: WPTextView
+ lateinit var title: WPTextView
+
+ constructor(context: Context, attrs: AttributeSet) : super(context, attrs) {
+ initView(context, attrs)
+ }
+
+ constructor(context: Context, attrs: AttributeSet, defStyle: Int) : super(context, attrs, defStyle) {
+ initView(context, attrs)
+ }
+
+ private fun initView(context: Context, attrs: AttributeSet) {
+ val layout = View.inflate(context, R.layout.actionable_empty_view, this)
+
+ image = layout.findViewById(R.id.image)
+ title = layout.findViewById(R.id.title)
+ subtitle = layout.findViewById(R.id.subtitle)
+ button = layout.findViewById(R.id.button)
+
+ attrs.let {
+ val typedArray = context.obtainStyledAttributes(it, R.styleable.ActionableEmptyView, 0, 0)
+
+ val imageResource = typedArray.getResourceId(R.styleable.ActionableEmptyView_aevImage, 0)
+ val titleAttribute = typedArray.getString(R.styleable.ActionableEmptyView_aevTitle)
+ val subtitleAttribute = typedArray.getString(R.styleable.ActionableEmptyView_aevSubtitle)
+ val buttonAttribute = typedArray.getString(R.styleable.ActionableEmptyView_aevButton)
+
+ if (imageResource != 0) {
+ image.setImageResource(imageResource)
+ image.visibility = View.VISIBLE
+ }
+
+ if (!titleAttribute.isNullOrEmpty()) {
+ title.text = titleAttribute
+ } else {
+ throw RuntimeException(context.toString() + ": ActionableEmptyView must have a title (wpTitle)")
+ }
+
+ if (!subtitleAttribute.isNullOrEmpty()) {
+ subtitle.text = subtitleAttribute
+ subtitle.visibility = View.VISIBLE
+ }
+
+ if (!buttonAttribute.isNullOrEmpty()) {
+ button.text = buttonAttribute
+ button.visibility = View.VISIBLE
+ }
+
+ typedArray.recycle()
+ }
+ }
+
+ fun setButtonClickListener(@NonNull listener: OnClickListener) {
+ button.setOnClickListener(listener)
+ }
+
+ fun setImageResource(@NonNull @DrawableRes resId: Int) {
+ image.setImageResource(resId)
+ }
+
+ fun setSubtitleText(@NonNull charSequence: CharSequence) {
+ subtitle.text = charSequence
+ }
+
+ fun setTitleText(@NonNull charSequence: CharSequence) {
+ title.text = charSequence
+ }
+}
diff --git a/WordPress/src/main/java/org/wordpress/android/ui/media/MediaBrowserActivity.java b/WordPress/src/main/java/org/wordpress/android/ui/media/MediaBrowserActivity.java
index 632ec1812be1..5fd3d67b3008 100755
--- a/WordPress/src/main/java/org/wordpress/android/ui/media/MediaBrowserActivity.java
+++ b/WordPress/src/main/java/org/wordpress/android/ui/media/MediaBrowserActivity.java
@@ -784,7 +784,7 @@ public void onReceive(Context context, Intent intent) {
}
};
- private void showAddMediaPopup() {
+ public void showAddMediaPopup() {
View anchor = findViewById(R.id.menu_new_media);
PopupMenu popup = new PopupMenu(this, anchor);
diff --git a/WordPress/src/main/java/org/wordpress/android/ui/media/MediaGridFragment.java b/WordPress/src/main/java/org/wordpress/android/ui/media/MediaGridFragment.java
index c8191648d124..c958a6271b2a 100755
--- a/WordPress/src/main/java/org/wordpress/android/ui/media/MediaGridFragment.java
+++ b/WordPress/src/main/java/org/wordpress/android/ui/media/MediaGridFragment.java
@@ -17,8 +17,8 @@
import android.view.MenuInflater;
import android.view.MenuItem;
import android.view.View;
+import android.view.View.OnClickListener;
import android.view.ViewGroup;
-import android.widget.TextView;
import org.greenrobot.eventbus.Subscribe;
import org.greenrobot.eventbus.ThreadMode;
@@ -34,6 +34,7 @@
import org.wordpress.android.fluxc.store.MediaStore.MediaErrorType;
import org.wordpress.android.fluxc.store.MediaStore.OnMediaListFetched;
import org.wordpress.android.fluxc.utils.MediaUtils;
+import org.wordpress.android.ui.ActionableEmptyView;
import org.wordpress.android.ui.EmptyViewMessageType;
import org.wordpress.android.ui.media.MediaGridAdapter.MediaGridAdapterCallback;
import org.wordpress.android.ui.media.services.MediaDeleteService;
@@ -146,7 +147,7 @@ private static MediaFilter fromMimeType(@NonNull String mimeType) {
private SwipeToRefreshHelper mSwipeToRefreshHelper;
- private TextView mEmptyView;
+ private ActionableEmptyView mEmptyView;
private EmptyViewMessageType mEmptyViewMessageType = EmptyViewMessageType.NO_CONTENT;
private SiteModel mSite;
@@ -241,7 +242,14 @@ public void onScrollStateChanged(RecyclerView recyclerView, int newState) {
}
});
- mEmptyView = (TextView) view.findViewById(R.id.empty_view);
+ mEmptyView = (ActionableEmptyView) view.findViewById(R.id.actionable_empty_view);
+ mEmptyView.setButtonClickListener(new OnClickListener() {
+ @Override public void onClick(View view) {
+ if (isAdded() && getActivity() instanceof MediaBrowserActivity) {
+ ((MediaBrowserActivity) getActivity()).showAddMediaPopup();
+ }
+ }
+ });
mRecycler.setEmptyView(mEmptyView);
// swipe to refresh setup
@@ -599,7 +607,7 @@ private void updateEmptyView(EmptyViewMessageType emptyViewMessageType) {
break;
}
- mEmptyView.setText(getText(stringId));
+ mEmptyView.setTitleText(getText(stringId));
mEmptyView.setVisibility(View.VISIBLE);
} else {
mEmptyView.setVisibility(View.GONE);
diff --git a/WordPress/src/main/res/drawable/img_illustration_media.xml b/WordPress/src/main/res/drawable/img_illustration_media.xml
new file mode 100644
index 000000000000..e10c1486e3d3
--- /dev/null
+++ b/WordPress/src/main/res/drawable/img_illustration_media.xml
@@ -0,0 +1,28 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/WordPress/src/main/res/layout/actionable_empty_view.xml b/WordPress/src/main/res/layout/actionable_empty_view.xml
new file mode 100644
index 000000000000..4feaa766f12b
--- /dev/null
+++ b/WordPress/src/main/res/layout/actionable_empty_view.xml
@@ -0,0 +1,70 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/WordPress/src/main/res/layout/media_grid_fragment.xml b/WordPress/src/main/res/layout/media_grid_fragment.xml
index d0b6c4e7fc60..3af8446c6f89 100644
--- a/WordPress/src/main/res/layout/media_grid_fragment.xml
+++ b/WordPress/src/main/res/layout/media_grid_fragment.xml
@@ -33,21 +33,15 @@
-
+ app:aevButton="@string/media_empty_upload_media"
+ app:aevImage="@drawable/img_illustration_media"
+ app:aevTitle="@string/media_empty_list"
+ tools:visibility="visible" >
+
diff --git a/WordPress/src/main/res/values/attrs.xml b/WordPress/src/main/res/values/attrs.xml
index e9d4d0af3de9..a7c828da791f 100644
--- a/WordPress/src/main/res/values/attrs.xml
+++ b/WordPress/src/main/res/values/attrs.xml
@@ -139,4 +139,18 @@
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/WordPress/src/main/res/values/dimens.xml b/WordPress/src/main/res/values/dimens.xml
index d12ec0f97081..f40b4f6a7ee5 100644
--- a/WordPress/src/main/res/values/dimens.xml
+++ b/WordPress/src/main/res/values/dimens.xml
@@ -315,5 +315,9 @@
40dp
16dp
+
+ 30dp
+ 440dp
+
18dp
diff --git a/WordPress/src/main/res/values/strings.xml b/WordPress/src/main/res/values/strings.xml
index 22904df42e8f..e384fba1d07c 100644
--- a/WordPress/src/main/res/values/strings.xml
+++ b/WordPress/src/main/res/values/strings.xml
@@ -198,11 +198,12 @@
Some media can\'t be deleted at this time. Try again later.
Media has been removed. Delete it from this post?
- No media
+ You don\'t have any media
You don\'t have any images
You don\'t have any videos
You don\'t have any documents
You don\'t have any audio
+ Upload media
Delete
Delete this image?
Remove this image from the post?
diff --git a/WordPress/src/main/res/values/styles.xml b/WordPress/src/main/res/values/styles.xml
index be8defa5cf0c..3115fad6e6b6 100644
--- a/WordPress/src/main/res/values/styles.xml
+++ b/WordPress/src/main/res/values/styles.xml
@@ -698,4 +698,32 @@
- @dimen/list_divider_height
- @color/grey_lighten_20
+
+
+
+
+
+
+