diff --git a/src/qml/NavigationActionBar.qml b/src/qml/NavigationActionBar.qml
--- a/src/qml/NavigationActionBar.qml
+++ b/src/qml/NavigationActionBar.qml
@@ -226,6 +226,8 @@
 
             spacing: 0
 
+            visible: opacity > 0.0
+
             Layout.fillWidth: true
             Layout.topMargin: elisaTheme.layoutVerticalMargin * 2
             Layout.leftMargin: !LayoutMirroring.enabled ? elisaTheme.layoutHorizontalMargin : 0
@@ -317,21 +319,34 @@
                 target: navigationBar
                 height: elisaTheme.navigationBarHeight
             }
+            PropertyChanges {
+                target: filterRow
+                opacity: 0.0
+            }
         },
         State {
             name: 'expanded'
             when: !collapsed
             PropertyChanges {
                 target: navigationBar
                 height: elisaTheme.navigationBarHeight + elisaTheme.navigationBarFilterHeight
             }
+            PropertyChanges {
+                target: filterRow
+                opacity: 1.0
+            }
         }
     ]
     transitions: Transition {
         PropertyAnimation {
             properties: "height"
             easing.type: Easing.Linear
             duration: 250
         }
+        PropertyAnimation {
+            properties: "opacity"
+            easing.type: Easing.Linear
+            duration: 250
+        }
     }
 }