Replace top and bottom area's background image

To improve scaling, replace top and bottom area's PNG image
to SVG image.

Bug-AGL: SPEC-1611

Change-Id: I547a96671c597cf3ac1ba1d3423fdb782bd93464
Signed-off-by: Tadao Tanikawa <tanikawa.tadao@jp.panasonic.com>

diff --git a/homescreen/qml/MediaAreaBlank.qml b/homescreen/qml/MediaAreaBlank.qml
index 2b888c8..c3a5f89 100644 (file)
--- a/homescreen/qml/MediaAreaBlank.qml
+++ b/homescreen/qml/MediaAreaBlank.qml
@@ -24,7 +24,7 @@ import MasterVolume 1.0
 Image {
     width: 1080
     height: 215
-    source: './images/Utility_Logo_Background-01.png'
+    source: './images/Utility_Logo_Background-01.svg'
     property bool displayVolume: false;
 
     MouseArea {

diff --git a/homescreen/qml/TopArea.qml b/homescreen/qml/TopArea.qml
index 9cff3ed..2a75cf8 100644 (file)
--- a/homescreen/qml/TopArea.qml
+++ b/homescreen/qml/TopArea.qml
@@ -22,7 +22,7 @@ import QtQuick.Controls 2.0
 Image {
     width: 1920
     height: 218
-    source: './images/TopSection_NoText_NoIcons-01.png'
+    source: './images/TopSection_NoText_NoIcons-01.svg'
     fillMode: Image.PreserveAspectCrop
 
     RowLayout {

diff --git a/homescreen/qml/images/TopSection_NoText_NoIcons-01.png b/homescreen/qml/images/TopSection_NoText_NoIcons-01.png
deleted file mode 100644 (file)
index cf9ec4e..0000000
Binary files a/homescreen/qml/images/TopSection_NoText_NoIcons-01.png and /dev/null differ

diff --git a/homescreen/qml/images/TopSection_NoText_NoIcons-01.svg b/homescreen/qml/images/TopSection_NoText_NoIcons-01.svg
new file mode 100644 (file)
index 0000000..6841001
--- /dev/null
+++ b/homescreen/qml/images/TopSection_NoText_NoIcons-01.svg
@@ -0,0 +1,55 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 21.0.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="Layer_1" 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 1080 217.9"
+        style="enable-background:new 0 0 1080 217.9;" xml:space="preserve">
+<style type="text/css">
+       .st0{opacity:0.9;fill:#1B1A1D;}
+       .st1{opacity:0.9;fill:#27232B;}
+       .st2{fill:none;stroke:url(#SVGID_1_);stroke-miterlimit:10;}
+       .st3{fill:none;stroke:url(#SVGID_2_);stroke-miterlimit:10;}
+       .st4{fill:none;stroke:url(#SVGID_3_);stroke-miterlimit:10;}
+       .st5{fill:none;stroke:url(#SVGID_4_);stroke-miterlimit:10;}
+       .st6{opacity:0.9;fill:none;stroke:#545157;stroke-miterlimit:10;}
+</style>
+<switch>
+       <g i:extraneous="self">
+               <rect class="st0" width="784.8" height="214.3"/>
+               <rect x="784.8" y="0" class="st1" width="295.2" height="214.3"/>
+               <linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="391.5756" y1="107.1501" x2="392.5756" y2="107.1501">
+                       <stop  offset="0.4644" style="stop-color:#000000"/>
+                       <stop  offset="0.4741" style="stop-color:#4D4B51"/>
+               </linearGradient>
+               <line class="st2" x1="392.1" y1="214.3" x2="392.1" y2="0"/>
+               <linearGradient id="SVGID_2_" gradientUnits="userSpaceOnUse" x1="195.6923" y1="107.1501" x2="196.6923" y2="107.1501">
+                       <stop  offset="0.4644" style="stop-color:#000000"/>
+                       <stop  offset="0.4741" style="stop-color:#4D4B51"/>
+               </linearGradient>
+               <line class="st3" x1="196.2" y1="214.3" x2="196.2" y2="0"/>
+               <linearGradient id="SVGID_3_" gradientUnits="userSpaceOnUse" x1="587.4589" y1="107.1501" x2="588.4589" y2="107.1501">
+                       <stop  offset="0.4644" style="stop-color:#000000"/>
+                       <stop  offset="0.4741" style="stop-color:#4D4B51"/>
+               </linearGradient>
+               <line class="st4" x1="588" y1="214.3" x2="588" y2="0"/>
+               <linearGradient id="SVGID_4_" gradientUnits="userSpaceOnUse" x1="783.3421" y1="107.1501" x2="784.3421" y2="107.1501">
+                       <stop  offset="0.4644" style="stop-color:#000000"/>
+                       <stop  offset="0.4741" style="stop-color:#4D4B51"/>
+               </linearGradient>
+               <line class="st5" x1="783.8" y1="214.3" x2="783.8" y2="0"/>
+               <g>
+                       <line class="st6" x1="815.1" y1="132" x2="983.5" y2="132"/>
+               </g>
+               <line class="st6" x1="1004.4" y1="-1.1" x2="1004.4" y2="213.2"/>
+       </g>
+</switch>
+</svg>

diff --git a/homescreen/qml/images/Utility_Logo_Background-01.png b/homescreen/qml/images/Utility_Logo_Background-01.png
deleted file mode 100644 (file)
index 21a602d..0000000
Binary files a/homescreen/qml/images/Utility_Logo_Background-01.png and /dev/null differ

diff --git a/homescreen/qml/images/Utility_Logo_Background-01.svg b/homescreen/qml/images/Utility_Logo_Background-01.svg
new file mode 100644 (file)
index 0000000..c289805
--- /dev/null
+++ b/homescreen/qml/images/Utility_Logo_Background-01.svg
@@ -0,0 +1,53 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 21.0.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="Layer_1" 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 1080 215"
+        style="enable-background:new 0 0 1080 215;" xml:space="preserve">
+<style type="text/css">
+       .st0{opacity:0.82;}
+       .st1{fill-rule:evenodd;clip-rule:evenodd;fill:url(#SVGID_1_);}
+       .st2{opacity:0.9;}
+       .st3{fill-rule:evenodd;clip-rule:evenodd;fill:#1B1A1D;}
+</style>
+<switch>
+       <foreignObject requiredExtensions="&ns_ai;" x="0" y="0" width="1" height="1">
+               <i:pgfRef  xlink:href="#adobe_illustrator_pgf">
+               </i:pgfRef>
+       </foreignObject>
+       <g i:extraneous="self">
+               <g>
+                       <g id="box_14_" class="st0">
+                               <g>
+                                       <linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="540" y1="247.5651" x2="540" y2="-6.7541">
+                                               <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>
+                                       <rect class="st1" width="1080" height="215"/>
+                               </g>
+                       </g>
+                       <g id="box_17_" class="st2">
+                               <g>
+                                       <rect class="st3" width="1080" height="215"/>
+                               </g>
+                       </g>
+               </g>
+       </g>
+</switch>
+</svg>

diff --git a/homescreen/qml/images/images.qrc b/homescreen/qml/images/images.qrc
index fb991aa..37ad676 100644 (file)
--- a/homescreen/qml/images/images.qrc
+++ b/homescreen/qml/images/images.qrc
@@ -1,7 +1,7 @@
 <RCC>
     <qresource prefix="/images">
-        <file>TopSection_NoText_NoIcons-01.png</file>
-        <file>Utility_Logo_Background-01.png</file>
+        <file>TopSection_NoText_NoIcons-01.svg</file>
+        <file>Utility_Logo_Background-01.svg</file>
         <file>Utility_Logo_Grey-01.svg</file>
         <file>Utility_Music_Background-01.png</file>
         <file>Utility_Radio_Background-01.png</file>