Added tab navigation functional. (#721)

- Added tab navigation functional.
- In basic types added parentFlickable property, which will help to ensure, that the item is visible within flickable parent during tab navigation.
- Added focus state for some basic types.
- In PageType qml file added lastItemTabClicked function, which will help to focus tab bar buttons when the last tab on the current page clicked.
- Added Focus for back button for all pages and drawers.
- Added scroll on tab for Servers ListView on PageHome.

client/ui/qml/Pages2/PageSettingsAbout.qml

@@ -13,6 +13,19 @@ import "../Components"
 PageType {
     id: root
 
+    defaultActiveFocusItem: focusItem
+
+    Item {
+        id: focusItem
+        KeyNavigation.tab: backButton
+
+        onFocusChanged: {
+            if (focusItem.activeFocus) {
+                fl.contentY = 0
+            }
+        }
+    }
+
     BackButtonType {
         id: backButton
 
@@ -20,6 +33,8 @@ PageType {
         anchors.left: parent.left
         anchors.right: parent.right
         anchors.topMargin: 20
+
+        KeyNavigation.tab: telegramButton
     }
 
     FlickableType {
@@ -82,6 +97,7 @@ PageType {
             }
 
             LabelWithButtonType {
+                id: telegramButton
                 Layout.fillWidth: true
                 Layout.topMargin: 16
 
@@ -89,6 +105,9 @@ PageType {
                 descriptionText: qsTr("To discuss features")
                 leftImageSource: "qrc:/images/controls/telegram.svg"
 
+                KeyNavigation.tab: mailButton
+                parentFlickable: fl
+
                 clickedFunction: function() {
                     Qt.openUrlExternally(qsTr("https://t.me/amnezia_vpn_en"))
                 }
@@ -97,40 +116,55 @@ PageType {
             DividerType {}
 
             LabelWithButtonType {
+                id: mailButton
                 Layout.fillWidth: true
 
                 text: qsTr("Mail")
                 descriptionText: qsTr("For reviews and bug reports")
                 leftImageSource: "qrc:/images/controls/mail.svg"
 
+                KeyNavigation.tab: githubButton
+                parentFlickable: fl
+
                 clickedFunction: function() {
                 }
+
             }
 
             DividerType {}
 
             LabelWithButtonType {
+                id: githubButton
                 Layout.fillWidth: true
 
                 text: qsTr("Github")
                 leftImageSource: "qrc:/images/controls/github.svg"
 
+                KeyNavigation.tab: websiteButton
+                parentFlickable: fl
+
                 clickedFunction: function() {
                     Qt.openUrlExternally(qsTr("https://github.com/amnezia-vpn/amnezia-client"))
                 }
+
             }
 
             DividerType {}
 
             LabelWithButtonType {
+                id: websiteButton
                 Layout.fillWidth: true
 
                 text: qsTr("Website")
                 leftImageSource: "qrc:/images/controls/amnezia.svg"
 
+                KeyNavigation.tab: checkUpdatesButton
+                parentFlickable: fl
+
                 clickedFunction: function() {
                     Qt.openUrlExternally(qsTr("https://amnezia.org"))
                 }
+
             }
 
             DividerType {}
@@ -146,6 +180,7 @@ PageType {
             }
 
             BasicButtonType {
+                id: checkUpdatesButton
                 Layout.alignment: Qt.AlignHCenter
                 Layout.topMargin: 8
                 Layout.bottomMargin: 16
@@ -159,12 +194,16 @@ PageType {
 
                 text: qsTr("Check for updates")
 
+                KeyNavigation.tab: privacyPolicyButton
+                parentFlickable: fl
+
                 clickedFunc: function() {
                     Qt.openUrlExternally("https://github.com/amnezia-vpn/desktop-client/releases/latest")
                 }
             }
 
             BasicButtonType {
+              id: privacyPolicyButton
               Layout.alignment: Qt.AlignHCenter
               Layout.bottomMargin: 16
               Layout.topMargin: -15
@@ -178,6 +217,9 @@ PageType {
 
               text: qsTr("Privacy Policy")
 
+              Keys.onTabPressed: lastItemTabClicked()
+              parentFlickable: fl
+
               clickedFunc: function() {
                 Qt.openUrlExternally("https://amnezia.org/en/policy")
               }