phone: add tabbed view

Adds support for a tabbed view of contacts, recent call,
and the dialpad. This adjusts the UI to look more like a
modern mobile phone app. The same models populate the
contacts view and the recent call view as before with
the latter being a more useful full screen list. The recent
call history also includes type of call information (missed,
incoming, outgoing) and the UI displays icons accordingly
to indicate type of call that occured as well as a time
stamp. For now, the icons are placeholders but will be
replaced by icons design to match the AGL look and feel.

Bug-AGL: SPEC-1435

Change-Id: I521155a11208e92ece83f20f7f3dd643deb92099
Signed-off-by: Matt Porter <mporter@konsulko.com>

1 files changed, 84 insertions, 0 deletions

diff --git a/app/TabImageButton.qml b/app/TabImageButton.qml
new file mode 100644
index 0000000..2176595
--- /dev/null
+++ b/app/TabImageButton.qml
@@ -0,0 +1,84 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: http://www.qt.io/licensing/
+** Copyright (C) 2018 Konsulko Group
+**
+** This file is part of the Qt Quick Controls 2 module of the Qt Toolkit.
+** Modified for AGL to match the behavior of the similar ImageButton control
+**
+** $QT_BEGIN_LICENSE:LGPL3$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see http://www.qt.io/terms-conditions. For further
+** information use the contact form at http://www.qt.io/contact-us.
+**
+** GNU Lesser General Public License Usage
+** Alternatively, this file may be used under the terms of the GNU Lesser
+** General Public License version 3 as published by the Free Software
+** Foundation and appearing in the file LICENSE.LGPLv3 included in the
+** packaging of this file. Please review the following information to
+** ensure the GNU Lesser General Public License version 3 requirements
+** will be met: https://www.gnu.org/licenses/lgpl.html.
+**
+** GNU General Public License Usage
+** Alternatively, this file may be used under the terms of the GNU
+** General Public License version 2.0 or later as published by the Free
+** Software Foundation and appearing in the file LICENSE.GPL included in
+** the packaging of this file. Please review the following information to
+** ensure the GNU General Public License version 2.0 requirements will be
+** met: http://www.gnu.org/licenses/gpl-2.0.html.
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick 2.9
+import QtQuick.Layouts 1.1
+import QtQuick.Controls 2.2
+import QtQuick.Controls.impl 2.2
+import QtQuick.Templates 2.2 as T
+
+T.TabButton {
+    id: control
+
+    implicitWidth: Math.max(background ? background.implicitWidth : 0,
+                            contentItem.implicitWidth + leftPadding + rightPadding)
+    implicitHeight: Math.max(background ? background.implicitHeight : 0,
+                             contentItem.implicitHeight + topPadding + bottomPadding)
+    baselineOffset: contentItem.y + contentItem.baselineOffset
+
+    padding: 6
+
+    property url icon
+
+    contentItem: ColumnLayout {
+        spacing: 20
+        Image {
+            Layout.alignment: Qt.AlignCenter
+            source: control.icon
+            width: 96
+            height: 96
+
+        }
+        Text {
+            Layout.alignment: Qt.AlignCenter
+            text: control.text
+            font: control.font
+            elide: Text.ElideRight 
+            opacity: enabled ? 1 : 0.3
+            color: !control.checked ? Default.textLightColor : control.down ? Default.textDarkColor : Default.textColor
+            horizontalAlignment: Text.AlignHCenter
+            verticalAlignment: Text.AlignVCenter
+        }
+    }
+    background: Rectangle {
+        implicitHeight: 160
+        color: control.down
+            ? (control.checked ? Default.tabButtonCheckedPressedColor : Default.tabButtonPressedColor)
+            : (control.checked ? "transparent" : Default.tabButtonColor)
+    }
+}