Merge pull request #900 from wordpress-mobile/issue/888-woo-aztec-toolbar-design-changes

Issue/888 woo aztec toolbar design changes

Author: 0nko

app/build.gradle

@@ -11,6 +11,7 @@ android {
         targetSdkVersion 28
         versionCode 1
         versionName "1.0"
+        vectorDrawables.useSupportLibrary = true
         testInstrumentationRunner 'androidx.test.runner.AndroidJUnitRunner'
     }
 

app/src/main/kotlin/org/wordpress/aztec/demo/MainActivity.kt

@@ -29,8 +29,8 @@ import android.widget.PopupMenu
 import android.widget.ToggleButton
 import androidx.appcompat.app.AlertDialog
 import androidx.appcompat.app.AppCompatActivity
+import androidx.appcompat.content.res.AppCompatResources
 import androidx.core.app.ActivityCompat.OnRequestPermissionsResultCallback
-import androidx.core.content.ContextCompat
 import androidx.core.content.FileProvider
 import org.wordpress.android.util.AppLog
 import org.wordpress.android.util.ImageUtils
@@ -339,7 +339,7 @@ open class MainActivity : AppCompatActivity(),
         aztec.visualEditor.setOverlay(predicate, 0, ColorDrawable(0x80000000.toInt()), Gravity.FILL)
         aztec.visualEditor.updateElementAttributes(predicate, attrs)
 
-        val progressDrawable = ContextCompat.getDrawable(this, android.R.drawable.progress_horizontal)!!
+        val progressDrawable = AppCompatResources.getDrawable(this, android.R.drawable.progress_horizontal)!!
         // set the height of the progress bar to 2 (it's in dp since the drawable will be adjusted by the span)
         progressDrawable.setBounds(0, 0, 0, 4)
 
@@ -361,7 +361,7 @@ open class MainActivity : AppCompatActivity(),
 
                 if (attrs.hasAttribute("video")) {
                     attrs.removeAttribute(attrs.getIndex("video"))
-                    aztec.visualEditor.setOverlay(predicate, 0, ContextCompat.getDrawable(this, android.R.drawable.ic_media_play), Gravity.CENTER)
+                    aztec.visualEditor.setOverlay(predicate, 0, AppCompatResources.getDrawable(this, android.R.drawable.ic_media_play), Gravity.CENTER)
                 }
 
                 aztec.visualEditor.updateElementAttributes(predicate, attrs)

app/src/main/kotlin/org/wordpress/aztec/demo/MediaToolbarAction.kt

@@ -5,8 +5,12 @@ import org.wordpress.aztec.ITextFormat
 import org.wordpress.aztec.toolbar.IToolbarAction
 import org.wordpress.aztec.toolbar.ToolbarActionType
 
-enum class MediaToolbarAction constructor(override val buttonId: Int, override val actionType: ToolbarActionType,
-                                          override val textFormats: Set<ITextFormat> = setOf()) : IToolbarAction {
-    GALLERY(R.id.media_bar_button_gallery, ToolbarActionType.OTHER, setOf(AztecTextFormat.FORMAT_NONE)),
-    CAMERA(R.id.media_bar_button_camera, ToolbarActionType.OTHER, setOf(AztecTextFormat.FORMAT_NONE))
+enum class MediaToolbarAction constructor(
+        override val buttonId: Int,
+        override val buttonDrawableRes: Int,
+        override val actionType: ToolbarActionType,
+        override val textFormats: Set<ITextFormat> = setOf()
+) : IToolbarAction {
+    GALLERY(R.id.media_bar_button_gallery, R.drawable.media_bar_button_image_multiple_selector, ToolbarActionType.OTHER, setOf(AztecTextFormat.FORMAT_NONE)),
+    CAMERA(R.id.media_bar_button_camera, R.drawable.media_bar_button_camera_selector, ToolbarActionType.OTHER, setOf(AztecTextFormat.FORMAT_NONE))
 }

app/src/main/res/drawable/ic_action_redo_selector.xml

@@ -1,9 +1,10 @@
 <?xml version="1.0" encoding="utf-8"?>
 
-<selector
-    xmlns:android="http://schemas.android.com/apk/res/android" >
+<animated-selector xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:tools="http://schemas.android.com/tools"
+    tools:targetApi="lollipop">
 
     <item android:drawable="@drawable/ic_action_redo_white_30_24dp" android:state_enabled="false" />
     <item android:drawable="@drawable/ic_action_redo_white_24dp" />
 
-</selector>
+</animated-selector>

app/src/main/res/drawable/ic_action_undo_selector.xml

@@ -1,9 +1,10 @@
 <?xml version="1.0" encoding="utf-8"?>
 
-<selector
-    xmlns:android="http://schemas.android.com/apk/res/android" >
+<animated-selector xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:tools="http://schemas.android.com/tools"
+    tools:targetApi="lollipop">
 
     <item android:drawable="@drawable/ic_action_undo_white_30_24dp" android:state_enabled="false" />
     <item android:drawable="@drawable/ic_action_undo_white_24dp" />
 
-</selector>
+</animated-selector>

app/src/main/res/drawable/media_bar_button_camera.xml

@@ -7,7 +7,7 @@
 
     <!-- @color/grey_darken_20 -->
     <path
-        android:fillColor="#ff4f748e"
+        android:fillColor="?attr/toolbarIconNormalColor"
         android:pathData="M29,24c0,1.7-1.3,3-3,3s-3-1.3-3-3s1.3-3,3-3S29,22.3,29,24zM34,19v11c0,1.1-0.9,2-2,2H16c-1.1,0-2-0.9-2-2V19c0-1.1,0.9-2,2-2v-1h4v1h2l1-2h6l1,2h2C33.1,17,34,17.9,34,19zM19.5,21c0-0.8-0.7-1.5-1.5-1.5s-1.5,0.7-1.5,1.5s0.7,1.5,1.5,1.5S19.5,21.8,19.5,21z M31,24c0-2.8-2.2-5-5-5s-5,2.2-5,5s2.2,5,5,5S31,26.8,31,24z">
     </path>
 

app/src/main/res/drawable/media_bar_button_camera_disabled.xml

@@ -7,7 +7,7 @@
 
     <!-- @color/grey_lighten_20 -->
     <path
-        android:fillColor="#ffc8d7e1"
+        android:fillColor="?attr/toolbarIconDisabledColor"
         android:pathData="M29,24c0,1.7-1.3,3-3,3s-3-1.3-3-3s1.3-3,3-3S29,22.3,29,24zM34,19v11c0,1.1-0.9,2-2,2H16c-1.1,0-2-0.9-2-2V19c0-1.1,0.9-2,2-2v-1h4v1h2l1-2h6l1,2h2C33.1,17,34,17.9,34,19zM19.5,21c0-0.8-0.7-1.5-1.5-1.5s-1.5,0.7-1.5,1.5s0.7,1.5,1.5,1.5S19.5,21.8,19.5,21z M31,24c0-2.8-2.2-5-5-5s-5,2.2-5,5s2.2,5,5,5S31,26.8,31,24z">
     </path>
 

app/src/main/res/drawable/media_bar_button_camera_highlighted.xml

@@ -7,7 +7,7 @@
 
     <!-- @color/almost_black -->
     <path
-        android:fillColor="#ff11181D"
+        android:fillColor="?attr/toolbarIconHighlightColor"
         android:pathData="M29,24c0,1.7-1.3,3-3,3s-3-1.3-3-3s1.3-3,3-3S29,22.3,29,24zM34,19v11c0,1.1-0.9,2-2,2H16c-1.1,0-2-0.9-2-2V19c0-1.1,0.9-2,2-2v-1h4v1h2l1-2h6l1,2h2C33.1,17,34,17.9,34,19zM19.5,21c0-0.8-0.7-1.5-1.5-1.5s-1.5,0.7-1.5,1.5s0.7,1.5,1.5,1.5S19.5,21.8,19.5,21z M31,24c0-2.8-2.2-5-5-5s-5,2.2-5,5s2.2,5,5,5S31,26.8,31,24z">
     </path>
 

app/src/main/res/drawable/media_bar_button_camera_selector.xml

@@ -1,8 +1,10 @@
 <?xml version="1.0" encoding="utf-8"?>
-<selector xmlns:android="http://schemas.android.com/apk/res/android">
+<animated-selector xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:tools="http://schemas.android.com/tools"
+    tools:targetApi="lollipop">
 
     <item android:drawable="@drawable/media_bar_button_camera_disabled" android:state_enabled="false"/>
     <item android:drawable="@drawable/media_bar_button_camera_highlighted" android:state_focused="true"/>
     <item android:drawable="@drawable/media_bar_button_camera"/>
 
-</selector>
+</animated-selector>

app/src/main/res/drawable/media_bar_button_image_multiple.xml

@@ -9,7 +9,7 @@
 
     <!-- @color/grey_darken_20 -->
     <path
-        android:fillColor="#ff4f748e"
+        android:fillColor="?attr/toolbarIconNormalColor"
         android:pathData="M27,19.5c0-0.8,0.7-1.5,1.5-1.5s1.5,0.7,1.5,1.5S29.3,21,28.5,21S27,20.3,27,19.5z M16,32h14c0,1.1-0.9,2-2,2H16 c-1.1,0-2-0.9-2-2V20c0-1.1,0.9-2,2-2V32z M34,16v12c0,1.1-0.9,2-2,2H20c-1.1,0-2-0.9-2-2V16c0-1.1,0.9-2,2-2h12 C33.1,14,34,14.9,34,16z M20,16v6.3l3-3.3l4.9,5.4l0.7-0.7c0.8-0.9,2.2-0.9,3,0l0.5,0.6V16H20z" >
     </path>