Display blank icon with first letter in new color scheme

    For new color scheme, when icon file is not exist,
    Display a blank icon with first letter.

Change-Id: Ifdb8254435d9ebbd93eca0005e088b99964e9187
Signed-off-by: zheng_wenlong <wenlong_zheng@nexty-ele.com>

8 files changed, 132 insertions, 5 deletions

diff --git a/homescreen/qml/IconItem.qml b/homescreen/qml/IconItem.qml
index c616722..b0373d2 100644
--- a/homescreen/qml/IconItem.qml
+++ b/homescreen/qml/IconItem.qml
@@ -13,7 +13,7 @@ Item {
             y: 60
             font.pixelSize: 125
             anchors.horizontalCenter: parent.horizontalCenter
-            color: "#5CFE96"
+            color: "#00ADDC"
             text: model.icon == 'Blank' ? model.name.substring(0,1).toUpperCase() : ''
         }
 
@@ -27,7 +27,7 @@ Item {
             anchors.horizontalCenter: parent.horizontalCenter
             horizontalAlignment: Text.AlignHCenter
             color: "white"
-            text: model.icon == 'Blank' ? model.name.toUpperCase() : ''
+            text: qsTr(model.name.toUpperCase())
         }
 
         source: './images/HMI_AppLauncher_%1_%2-01.svg'.arg(model.icon).arg(loc.pressed && (loc.index === model.index || loc.currentId === model.id) ? 'Active' : 'Inactive')
diff --git a/homescreen/qml/MediaAreaBlank.qml b/homescreen/qml/MediaAreaBlank.qml
index 5733392..f5aa91b 100644
--- a/homescreen/qml/MediaAreaBlank.qml
+++ b/homescreen/qml/MediaAreaBlank.qml
@@ -84,7 +84,7 @@ Image {
             font.pixelSize: 36
             anchors.horizontalCenter: parent.horizontalCenter
             color: "white"
-            text: "Master Volume"
+            text: qsTr("Master Volume")
         }
 
         RowLayout {
diff --git a/homescreen/qml/ShortcutIcon.qml b/homescreen/qml/ShortcutIcon.qml
index c6f5a4e..39931d1 100644
--- a/homescreen/qml/ShortcutIcon.qml
+++ b/homescreen/qml/ShortcutIcon.qml
@@ -16,6 +16,7 @@
  */
 
 import QtQuick 2.2
+import QtQuick.Controls 2.0
 
 MouseArea {
     id: root
@@ -33,6 +34,18 @@ MouseArea {
         source: './images/Shortcut/HMI_Shortcut_%1_Active-01.svg'.arg(root.name)
         opacity: 1.0 - icon.opacity
     }
+    Label {
+        id: name
+        y: 160
+        width: root.width - 10
+        font.pixelSize: 15
+        font.letterSpacing: 5
+        // wrapMode: Text.WordWrap
+        anchors.horizontalCenter: parent.horizontalCenter
+        horizontalAlignment: Text.AlignHCenter
+        color: "white"
+        text: qsTr(model.name.toUpperCase())
+    }
     states: [
         State {
             when: root.active
diff --git a/homescreen/qml/images/Home/HMI_AppLauncher_Blank_Active-01.png b/homescreen/qml/images/Home/HMI_AppLauncher_Blank_Active-01.png
deleted file mode 100644
index 32558b3..0000000
--- a/homescreen/qml/images/Home/HMI_AppLauncher_Blank_Active-01.png
+++ /dev/null
diff --git a/homescreen/qml/images/Home/HMI_AppLauncher_Blank_Active-01.svg b/homescreen/qml/images/Home/HMI_AppLauncher_Blank_Active-01.svg
new file mode 100644
index 0000000..8d082d6
--- /dev/null
+++ b/homescreen/qml/images/Home/HMI_AppLauncher_Blank_Active-01.svg
@@ -0,0 +1,74 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 21.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" [
+	<!ENTITY ns_extend "http://ns.adobe.com/Extensibility/1.0/">
+	<!ENTITY ns_ai "http://ns.adobe.com/AdobeIllustrator/10.0/">
+	<!ENTITY ns_graphs "http://ns.adobe.com/Graphs/1.0/">
+	<!ENTITY ns_vars "http://ns.adobe.com/Variables/1.0/">
+	<!ENTITY ns_imrep "http://ns.adobe.com/ImageReplacement/1.0/">
+	<!ENTITY ns_sfw "http://ns.adobe.com/SaveForWeb/1.0/">
+	<!ENTITY ns_custom "http://ns.adobe.com/GenericCustomNamespace/1.0/">
+	<!ENTITY ns_adobe_xpath "http://ns.adobe.com/XPath/1.0/">
+]>
+<svg version="1.1" id="HVAC_Active" xmlns:x="&ns_extend;" xmlns:i="&ns_ai;" xmlns:graph="&ns_graphs;"
+	 xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 320 320"
+	 style="enable-background:new 0 0 320 320;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:url(#SVGID_1_);}
+	.st1{opacity:0.4;fill:url(#SVGID_2_);}
+	.st2{fill:#FFFFFF;}
+	.st3{font-family:'Roboto-Regular';}
+	.st4{font-size:25px;}
+	.st5{letter-spacing:6;}
+	.st6{fill:url(#SVGID_3_);}
+	.st7{fill:url(#SVGID_4_);}
+	.st8{fill:url(#SVGID_5_);}
+	.st9{fill:url(#SVGID_6_);}
+	.st10{fill:url(#SVGID_7_);}
+	.st11{fill:url(#SVGID_8_);}
+	.st12{fill:url(#SVGID_9_);}
+	.st13{fill:url(#SVGID_10_);}
+	.st14{fill:url(#SVGID_11_);}
+	.st15{fill:url(#SVGID_12_);}
+	.st16{fill:url(#SVGID_13_);}
+	.st17{fill:url(#SVGID_14_);}
+	.st18{fill:url(#SVGID_15_);}
+	.st19{fill:url(#SVGID_16_);}
+	.st20{fill:url(#SVGID_17_);}
+	.st21{fill:url(#SVGID_18_);}
+	.st22{fill:url(#SVGID_19_);}
+</style>
+<switch>
+	<g i:extraneous="self">
+		<linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="116.0821" y1="254.3919" x2="256.5356" y2="-133.3184">
+			<stop  offset="0" style="stop-color:#0DF9FF"/>
+			<stop  offset="9.208472e-02" style="stop-color:#0DF9FF;stop-opacity:0.853"/>
+			<stop  offset="0.6264" style="stop-color:#0DF9FF;stop-opacity:0"/>
+		</linearGradient>
+		<circle class="st0" cx="159.8" cy="133.6" r="101.9"/>
+		<linearGradient id="SVGID_2_" gradientUnits="userSpaceOnUse" x1="-55.7969" y1="435.511" x2="216.9304" y2="53.6929">
+			<stop  offset="0.2978" style="stop-color:#FFFFFF;stop-opacity:0"/>
+			<stop  offset="0.3685" style="stop-color:#FAFAFA;stop-opacity:0.1007"/>
+			<stop  offset="0.4554" style="stop-color:#EBEBEB;stop-opacity:0.2245"/>
+			<stop  offset="0.5508" style="stop-color:#D2D2D2;stop-opacity:0.3603"/>
+			<stop  offset="0.6523" style="stop-color:#AFAFAF;stop-opacity:0.5048"/>
+			<stop  offset="0.7585" style="stop-color:#828282;stop-opacity:0.6562"/>
+			<stop  offset="0.8689" style="stop-color:#4B4B4B;stop-opacity:0.8133"/>
+			<stop  offset="0.9806" style="stop-color:#0C0C0C;stop-opacity:0.9724"/>
+			<stop  offset="1" style="stop-color:#000000"/>
+		</linearGradient>
+		<circle class="st1" cx="159.8" cy="133.6" r="101.9"/>
+		<g>
+			
+				<linearGradient id="SVGID_3_" gradientUnits="userSpaceOnUse" x1="4.0481" y1="287.9492" x2="320.4859" y2="-15.4029" gradientTransform="matrix(1 5.464556e-03 -5.464556e-03 1 -2.0192 -3.0212)">
+				<stop  offset="0" style="stop-color:#00ADDC"/>
+				<stop  offset="1" style="stop-color:#6BFBFF"/>
+			</linearGradient>
+			<path class="st6" d="M160,238.8c-0.2,0-0.4,0-0.6,0c-58-0.3-104.9-47.7-104.6-105.7C55.2,75.3,102.3,28.5,160,28.5
+				c0.2,0,0.4,0,0.6,0c58,0.3,104.9,47.7,104.6,105.7l0,0C264.8,192,217.7,238.8,160,238.8z M160,32.2
+				c-55.7,0-101.2,45.2-101.5,100.9c-0.3,55.9,45,101.7,100.9,102c0.2,0,0.4,0,0.6,0c55.7,0,101.2-45.2,101.5-100.9
+				c0.3-55.9-45-101.7-100.9-102C160.4,32.2,160.2,32.2,160,32.2z"/>
+		</g>
+	</g>
+</switch>
+</svg>
diff --git a/homescreen/qml/images/Home/HMI_AppLauncher_Blank_Inactive-01.png b/homescreen/qml/images/Home/HMI_AppLauncher_Blank_Inactive-01.png
deleted file mode 100644
index bd374c6..0000000
--- a/homescreen/qml/images/Home/HMI_AppLauncher_Blank_Inactive-01.png
+++ /dev/null
diff --git a/homescreen/qml/images/Home/HMI_AppLauncher_Blank_Inactive-01.svg b/homescreen/qml/images/Home/HMI_AppLauncher_Blank_Inactive-01.svg
new file mode 100644
index 0000000..1821339
--- /dev/null
+++ b/homescreen/qml/images/Home/HMI_AppLauncher_Blank_Inactive-01.svg
@@ -0,0 +1,40 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 21.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" [
+	<!ENTITY ns_extend "http://ns.adobe.com/Extensibility/1.0/">
+	<!ENTITY ns_ai "http://ns.adobe.com/AdobeIllustrator/10.0/">
+	<!ENTITY ns_graphs "http://ns.adobe.com/Graphs/1.0/">
+	<!ENTITY ns_vars "http://ns.adobe.com/Variables/1.0/">
+	<!ENTITY ns_imrep "http://ns.adobe.com/ImageReplacement/1.0/">
+	<!ENTITY ns_sfw "http://ns.adobe.com/SaveForWeb/1.0/">
+	<!ENTITY ns_custom "http://ns.adobe.com/GenericCustomNamespace/1.0/">
+	<!ENTITY ns_adobe_xpath "http://ns.adobe.com/XPath/1.0/">
+]>
+<svg version="1.1" id="Connectivity_Inactive" xmlns:x="&ns_extend;" xmlns:i="&ns_ai;" xmlns:graph="&ns_graphs;"
+	 xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 320 320"
+	 style="enable-background:new 0 0 320 320;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:#FFFFFF;}
+	.st1{font-family:'Roboto-Regular';}
+	.st2{font-size:25px;}
+	.st3{letter-spacing:6;}
+	.st4{fill:url(#SVGID_1_);}
+</style>
+<switch>
+	<g i:extraneous="self">
+		<g>
+			<g>
+				
+					<linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="162.7637" y1="227.3414" x2="162.7637" y2="-19.1675" gradientTransform="matrix(1 5.464556e-03 -5.464556e-03 1 -2.0192 -3.0212)">
+					<stop  offset="0" style="stop-color:#00ADDC"/>
+					<stop  offset="1" style="stop-color:#6BFBFF"/>
+				</linearGradient>
+				<path class="st4" d="M160,238.8c-0.2,0-0.4,0-0.6,0c-58-0.3-104.9-47.7-104.6-105.7C55.2,75.3,102.3,28.5,160,28.5
+					c0.2,0,0.4,0,0.6,0c58,0.3,104.9,47.7,104.6,105.7l0,0C264.8,192,217.7,238.8,160,238.8z M160,32.2
+					c-55.7,0-101.2,45.2-101.5,100.9c-0.3,55.9,45,101.7,100.9,102c0.2,0,0.4,0,0.6,0c55.7,0,101.2-45.2,101.5-100.9
+					c0.3-55.9-45-101.7-100.9-102C160.4,32.2,160.2,32.2,160,32.2z"/>
+			</g>
+		</g>
+	</g>
+</switch>
+</svg>
diff --git a/homescreen/qml/images/Home/home.qrc b/homescreen/qml/images/Home/home.qrc
index a9db5c2..a523a96 100644
--- a/homescreen/qml/images/Home/home.qrc
+++ b/homescreen/qml/images/Home/home.qrc
@@ -21,7 +21,7 @@
         <file>HMI_AppLauncher_Radio_Inactive-01.svg</file>
         <file>HMI_AppLauncher_Settings_Active-01.svg</file>
         <file>HMI_AppLauncher_Settings_Inactive-01.svg</file>
-        <file>HMI_AppLauncher_Blank_Active-01.png</file>
-        <file>HMI_AppLauncher_Blank_Inactive-01.png</file>
+        <file>HMI_AppLauncher_Blank_Active-01.svg</file>
+        <file>HMI_AppLauncher_Blank_Inactive-01.svg</file>
     </qresource>
 </RCC>