diff --git a/WordPress/src/main/java/org/wordpress/android/ui/main/WPMainNavigationView.kt b/WordPress/src/main/java/org/wordpress/android/ui/main/WPMainNavigationView.kt
index beca76c4484c..57138416e919 100644
--- a/WordPress/src/main/java/org/wordpress/android/ui/main/WPMainNavigationView.kt
+++ b/WordPress/src/main/java/org/wordpress/android/ui/main/WPMainNavigationView.kt
@@ -1,18 +1,22 @@
package org.wordpress.android.ui.main
import android.content.Context
+import android.graphics.ColorMatrix
+import android.graphics.ColorMatrixColorFilter
import android.graphics.drawable.BitmapDrawable
import android.util.AttributeSet
import android.view.HapticFeedbackConstants
import android.view.LayoutInflater
import android.view.MenuItem
import android.view.View
+import android.view.animation.AnimationUtils
import android.widget.ImageView
import android.widget.TextView
import androidx.annotation.DrawableRes
import androidx.annotation.IdRes
import androidx.annotation.StringRes
import androidx.core.content.res.ResourcesCompat
+import androidx.core.view.setPadding
import androidx.core.widget.ImageViewCompat
import androidx.fragment.app.Fragment
import androidx.fragment.app.FragmentManager
@@ -72,6 +76,9 @@ class WPMainNavigationView @JvmOverloads constructor(
MaterialR.dimen.material_emphasis_disabled
)
+ val disabledColorFilter = ColorMatrixColorFilter(ColorMatrix().apply { setSaturation(0f) })
+ val enabledColorFilter = ColorMatrixColorFilter(ColorMatrix().apply { setSaturation(1f) })
+
@Inject
lateinit var meGravatarLoader: MeGravatarLoader
@@ -130,6 +137,10 @@ class WPMainNavigationView @JvmOverloads constructor(
itemView.addView(customView)
}
+ if(getMainPageIndex() != getPosition(ME)) {
+ setImageViewSelected(getPosition(ME), false)
+ }
+
currentPosition = getMainPageIndex()
}
@@ -138,6 +149,7 @@ class WPMainNavigationView @JvmOverloads constructor(
AppLog.d(AppLog.T.MAIN, "Attempted to load an empty Gravatar URL!")
return
}
+ imgIcon.setPadding(resources.getDimensionPixelSize(R.dimen.navbar_me_icon_padding))
AppLog.d(AppLog.T.MAIN, meGravatarLoader.constructGravatarUrl(avatarUrl))
imgIcon.let {
meGravatarLoader.load(
@@ -282,8 +294,19 @@ class WPMainNavigationView @JvmOverloads constructor(
private fun setImageViewSelected(position: Int, isSelected: Boolean) {
getImageViewForPosition(position)?.let {
+ if(position == getPosition(ME)) {
+ if(!isSelected){
+ it.colorFilter = disabledColorFilter
+ } else
+ it.colorFilter = enabledColorFilter
+ }
+
it.isSelected = isSelected
it.alpha = if (isSelected) 1f else unselectedButtonAlpha
+ if(it.isSelected) {
+ val pop = AnimationUtils.loadAnimation(it.context, R.anim.bottom_nav_icon_pop)
+ it.startAnimation(pop)
+ }
}
}
@@ -298,10 +321,10 @@ class WPMainNavigationView @JvmOverloads constructor(
@DrawableRes
private fun getDrawableResForPosition(position: Int): Int {
return when (getPageTypeOrNull(position)) {
- MY_SITE -> R.drawable.ic_my_sites_white_24dp
- READER -> R.drawable.ic_reader_white_24dp
- NOTIFS -> R.drawable.ic_bell_white_24dp
- else -> R.drawable.ic_user_primary_white_24
+ MY_SITE -> R.drawable.ic_home_selected
+ READER -> R.drawable.ic_reader_selected
+ NOTIFS -> R.drawable.ic_notifications_selected
+ else -> R.drawable.ic_me_bottom_nav
}
}
diff --git a/WordPress/src/main/res/anim/bottom_nav_icon_pop.xml b/WordPress/src/main/res/anim/bottom_nav_icon_pop.xml
new file mode 100644
index 000000000000..27815dc4c318
--- /dev/null
+++ b/WordPress/src/main/res/anim/bottom_nav_icon_pop.xml
@@ -0,0 +1,11 @@
+
+
diff --git a/WordPress/src/main/res/drawable/ic_home_selected.xml b/WordPress/src/main/res/drawable/ic_home_selected.xml
new file mode 100644
index 000000000000..12fd0afa8638
--- /dev/null
+++ b/WordPress/src/main/res/drawable/ic_home_selected.xml
@@ -0,0 +1,12 @@
+
+
+
+
+
+
diff --git a/WordPress/src/main/res/drawable/ic_me_bottom_nav.xml b/WordPress/src/main/res/drawable/ic_me_bottom_nav.xml
new file mode 100644
index 000000000000..8393c3ffa1e3
--- /dev/null
+++ b/WordPress/src/main/res/drawable/ic_me_bottom_nav.xml
@@ -0,0 +1,16 @@
+
+
+
+
diff --git a/WordPress/src/main/res/drawable/ic_notifications_selected.xml b/WordPress/src/main/res/drawable/ic_notifications_selected.xml
new file mode 100644
index 000000000000..19103ae2fdd6
--- /dev/null
+++ b/WordPress/src/main/res/drawable/ic_notifications_selected.xml
@@ -0,0 +1,14 @@
+
+
+
+
diff --git a/WordPress/src/main/res/drawable/ic_reader_selected.xml b/WordPress/src/main/res/drawable/ic_reader_selected.xml
new file mode 100644
index 000000000000..d3d5e70339f8
--- /dev/null
+++ b/WordPress/src/main/res/drawable/ic_reader_selected.xml
@@ -0,0 +1,24 @@
+
+
+
+
+
+
+
diff --git a/WordPress/src/main/res/drawable/nav_bar_button_selector.xml b/WordPress/src/main/res/drawable/nav_bar_button_selector.xml
index 003c854c0051..505046fbd95a 100644
--- a/WordPress/src/main/res/drawable/nav_bar_button_selector.xml
+++ b/WordPress/src/main/res/drawable/nav_bar_button_selector.xml
@@ -3,6 +3,6 @@
xmlns:android="http://schemas.android.com/apk/res/android">
-
+
diff --git a/WordPress/src/main/res/layout/navbar_item.xml b/WordPress/src/main/res/layout/navbar_item.xml
index 0f2ea08363d4..a41da5929983 100644
--- a/WordPress/src/main/res/layout/navbar_item.xml
+++ b/WordPress/src/main/res/layout/navbar_item.xml
@@ -18,6 +18,8 @@
android:layout_width="@dimen/bottom_nav_bar_icon_size"
android:layout_height="@dimen/bottom_nav_bar_icon_size"
android:layout_gravity="center"
+ android:layout_marginEnd="4dp"
+ android:layout_marginStart="4dp"
android:importantForAccessibility="no"
app:tint="@drawable/nav_bar_button_selector"
tools:src="@drawable/ic_create_white_24dp" />
diff --git a/WordPress/src/main/res/values/dimens.xml b/WordPress/src/main/res/values/dimens.xml
index 7d0a903e6682..6dba1b57bc6b 100644
--- a/WordPress/src/main/res/values/dimens.xml
+++ b/WordPress/src/main/res/values/dimens.xml
@@ -67,7 +67,7 @@
0dp
- 24dp
+ 32dp
12dp
@@ -773,4 +773,5 @@
7dp
4dp
24dp
+ 4dp