use svg icons

Closes #102.

Doesn't use Shader/HighlightImage for background/placeholder, since that neither matched the previous look nor meet my visual expectations at all. I created both previously available color variations as svg accordingly.
Implementation of the background images has been outsourced to a dedicated qml file to reduce duplication and ensure the same layout. Padding is now "medium" everywhere (stickers had none, audio had "small").

For the Icons, some (Highlight-)Image+MouseArea combinations have been changed to IconButton.
Regarding videos, I'm not actually sure if the missing "highlight" on the fullscreen icon was intentional. An issue with videos possibly having the same color as the icon remains basically the same. Nonetheless, if this isn't desired, I'll revert to just using the white image.

The sticker icon actually does look a bit differently now – it's a bit smaller. I've redrawn it from scratch but mostly kept the dimensions of icon-m-other (which doesn't look good when zoomed in, btw). Perhaps I actually did made a mistake drawing the previous one. Either way, I think it fits well enough.

The notification icon remains png, but I managed to reduce its file size by ~60% without visibly impacting it much imho.

This may be the longest commit message I've ever written.
This commit is contained in:
John Gibbon 2020-10-26 15:15:53 +01:00
parent 70170c894f
commit d38490fb09
26 changed files with 293 additions and 118 deletions

View file

@ -34,6 +34,7 @@ SOURCES += src/harbour-fernschreiber.cpp \
DISTFILES += qml/harbour-fernschreiber.qml \
qml/components/AudioPreview.qml \
qml/components/BackgroundImage.qml \
qml/components/ChatListViewItem.qml \
qml/components/DocumentPreview.qml \
qml/components/ImagePreview.qml \

Binary file not shown.

Before

Width:  |  Height:  |  Size: 8.8 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 38 KiB

View file

@ -0,0 +1,64 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
width="114.667"
height="114.667"
version="1.1"
id="svg19">
<metadata
id="metadata23">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<defs
id="defs9">
<linearGradient
id="linearGradient4649">
<stop
style="stop-color:#979797;stop-opacity:1"
offset="0"
id="stop4645" />
<stop
style="stop-color:#797979;stop-opacity:1"
offset="1"
id="stop4647" />
</linearGradient>
<linearGradient
xlink:href="#linearGradient4649"
id="linearGradient4651"
x1="0.81535178"
y1="0.99882859"
x2="71.914337"
y2="74.307625"
gradientUnits="userSpaceOnUse" />
</defs>
<path
d="M 0.301,43 0.3,1.723 C 0.3,0.938 0.938,0.3 1.723,0.3 H 43 C 66.584,0.3 85.7,19.417 85.7,43 85.7,66.583 66.584,85.7 43,85.7 19.417,85.7 0.301,66.583 0.301,43"
transform="matrix(1.33333,0,0,-1.33333,0,114.667)"
id="path11"
style="fill:url(#linearGradient4651);fill-opacity:1" />
<path
d="m 100,57.117 c 0,-23.408 -19.043,-42.45 -42.45,-42.45 -23.409,0 -42.451,19.042 -42.451,42.45 v 42.45 h 42.45 C 80.957,99.567 100,80.525 100,57.117"
id="path13"
style="fill:#444444;fill-opacity:1" />
<path
d="m 81.517,53.646 c -0.0573,2.403947 3.578298,2.403947 3.521,0 0.0573,-2.403947 -3.578298,-2.403947 -3.521,0 m -8.73,0 c 0.09308,2.256331 3.433918,2.256331 3.527,0 0,-2.351999 -3.528,-2.351999 -3.528,0 m -8.723,0 c 0,2.347999 3.522,2.347999 3.522,0 0,-2.347999 -3.522,-2.347999 -3.522,0 m -8.727,0 c -0.101696,2.44622 3.621306,2.447277 3.521,10e-4 -0.09236,-2.252442 -3.427362,-2.253389 -3.521,-10e-4 m -8.728,0 c -0.05733,2.406646 3.58233,2.406646 3.525,0 -0.05466,-2.294686 -3.470338,-2.294686 -3.525,0 m -8.726,0 c 6.67e-4,2.350666 3.526667,2.349666 3.526,-10e-4 0,-2.350666 -3.526,-2.350666 -3.526,0 m -8.726,0 c -0.05801,2.406625 3.581643,2.407658 3.525,10e-4 -0.05466,-2.294686 -3.470338,-2.294686 -3.525,0 m -8.728,0 c 0,2.353332 3.53,2.353332 3.53,0 0,-0.973 -0.79,-1.763 -1.766,-1.763 -0.975,0 -1.764,0.79 -1.764,1.763"
id="path15"
style="fill:#000000;fill-opacity:1" />
<path
d="m 79.751,79.82 c -0.08052,4.780502 7.131515,4.780502 7.051,0 -0.109325,-4.589371 -6.940675,-4.589371 -7.05,0 m 0,-8.722 c 0.0022,1.946378 1.578625,3.524144 3.525,3.528 4.703331,0 4.703331,-7.055 0,-7.055 -1.946832,0.0022 -3.524347,1.580167 -3.526,3.527 m 0,-8.727 c 0.0017,1.946995 1.579006,3.525244 3.526,3.528 4.703998,0 4.703998,-7.056 0,-7.056 -1.946994,0.0028 -3.524348,1.581005 -3.526,3.528 M 71.025,44.92 c 0.0018,3.140416 3.799089,4.710649 6.018485,2.489364 C 79.262881,45.188079 77.689416,41.39211 74.549,41.393 c -1.946965,0.0011 -3.524552,1.580034 -3.524,3.527 m 0,-8.728 c -0.0013,4.699998 7.048667,4.701998 7.05,0.002 0.0013,-4.699998 -7.048667,-4.701998 -7.05,-0.002 m -8.727,34.906 c 0.0011,1.946833 1.578168,3.525243 3.525,3.528 4.624805,-0.07787 4.624805,-6.977129 0,-7.055 -1.946899,0.0017 -3.524449,1.580101 -3.525,3.527 m 0,-26.178 c 0,1.946804 1.578196,3.525 3.525,3.525 4.701331,0 4.701331,-7.052 0,-7.052 -1.947127,0.0011 -3.525,1.579872 -3.525,3.527 m -8.73,34.9 c -5.53e-4,1.948689 1.579311,3.528553 3.528,3.528 1.94947,0.0017 3.530553,-1.578529 3.53,-3.528 -0.0033,-1.946737 -1.583261,-3.522659 -3.53,-3.521 -1.946186,-0.0011 -3.525241,1.574816 -3.528,3.521 m 0,-8.722 c 0.0028,1.947319 1.580681,3.525246 3.528,3.528 1.9481,-0.0017 3.527244,-1.579902 3.53,-3.528 -0.0022,-1.948165 -1.581834,-3.52645 -3.53,-3.527 -1.947613,0.0011 -3.526345,1.579387 -3.528,3.527 m 0,-26.178 c 0.0017,1.947289 1.58071,3.525001 3.528,3.525 1.947842,5.53e-4 3.527792,-1.577159 3.53,-3.525 -0.109388,-4.594641 -6.948612,-4.594641 -7.058,0 m -8.723,-8.728 c -5.53e-4,1.948528 1.579472,3.528105 3.528,3.527 4.701331,0 4.701331,-7.052 0,-7.052 -1.947518,-5.52e-4 -3.526896,1.577482 -3.528,3.525 M 36.12,79.82 c -0.0017,1.948757 1.578243,3.529106 3.527,3.528 1.948435,0.0011 3.527766,-1.579567 3.525,-3.528 -5.52e-4,-1.945928 -1.579072,-3.522658 -3.525,-3.521 -1.946252,-0.0017 -3.525344,1.574748 -3.527,3.521 m 0,-34.9 c 0.0013,4.701331 7.053333,4.699331 7.052,-0.002 -0.0013,-4.701331 -7.053333,-4.699331 -7.052,0.002 m -8.726,-8.728 c -6.67e-4,4.701331 7.051333,4.702331 7.052,10e-4 6.67e-4,-4.701331 -7.051333,-4.702331 -7.052,-10e-4 M 18.667,79.82 c -0.0022,1.948204 1.576795,3.528554 3.525,3.528 4.699998,0 4.699998,-7.05 0,-7.05 -1.94609,-0.0011 -3.524448,1.57591 -3.525,3.522"
id="path17"
style="fill:#000000;fill-opacity:1" />
</svg>

After

Width:  |  Height:  |  Size: 4.9 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 8.9 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 38 KiB

View file

@ -0,0 +1,64 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
id="svg19"
version="1.1"
height="114.667"
width="114.667">
<metadata
id="metadata23">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<defs
id="defs9">
<linearGradient
id="linearGradient4649">
<stop
id="stop4645"
offset="0"
style="stop-color:#686868;stop-opacity:1" />
<stop
id="stop4647"
offset="1"
style="stop-color:#868686;stop-opacity:1" />
</linearGradient>
<linearGradient
gradientUnits="userSpaceOnUse"
y2="74.307625"
x2="71.914337"
y1="0.99882859"
x1="0.81535178"
id="linearGradient4651"
xlink:href="#linearGradient4649" />
</defs>
<path
style="fill:url(#linearGradient4651);fill-opacity:1"
id="path11"
transform="matrix(1.33333,0,0,-1.33333,0,114.667)"
d="M 0.301,43 0.3,1.723 C 0.3,0.938 0.938,0.3 1.723,0.3 H 43 C 66.584,0.3 85.7,19.417 85.7,43 85.7,66.583 66.584,85.7 43,85.7 19.417,85.7 0.301,66.583 0.301,43" />
<path
style="fill:#bbbbbb;fill-opacity:1"
id="path13"
d="m 100,57.117 c 0,-23.408 -19.043,-42.45 -42.45,-42.45 -23.409,0 -42.451,19.042 -42.451,42.45 v 42.45 h 42.45 C 80.957,99.567 100,80.525 100,57.117" />
<path
style="fill:#f7f7f7;fill-opacity:1"
id="path15"
d="m 81.517,53.646 c -0.0573,2.403947 3.578298,2.403947 3.521,0 0.0573,-2.403947 -3.578298,-2.403947 -3.521,0 m -8.73,0 c 0.09308,2.256331 3.433918,2.256331 3.527,0 0,-2.351999 -3.528,-2.351999 -3.528,0 m -8.723,0 c 0,2.347999 3.522,2.347999 3.522,0 0,-2.347999 -3.522,-2.347999 -3.522,0 m -8.727,0 c -0.101696,2.44622 3.621306,2.447277 3.521,10e-4 -0.09236,-2.252442 -3.427362,-2.253389 -3.521,-10e-4 m -8.728,0 c -0.05733,2.406646 3.58233,2.406646 3.525,0 -0.05466,-2.294686 -3.470338,-2.294686 -3.525,0 m -8.726,0 c 6.67e-4,2.350666 3.526667,2.349666 3.526,-10e-4 0,-2.350666 -3.526,-2.350666 -3.526,0 m -8.726,0 c -0.05801,2.406625 3.581643,2.407658 3.525,10e-4 -0.05466,-2.294686 -3.470338,-2.294686 -3.525,0 m -8.728,0 c 0,2.353332 3.53,2.353332 3.53,0 0,-0.973 -0.79,-1.763 -1.766,-1.763 -0.975,0 -1.764,0.79 -1.764,1.763" />
<path
style="fill:#fcfcfc;fill-opacity:1"
id="path17"
d="m 79.751,79.82 c -0.08052,4.780502 7.131515,4.780502 7.051,0 -0.109325,-4.589371 -6.940675,-4.589371 -7.05,0 m 0,-8.722 c 0.0022,1.946378 1.578625,3.524144 3.525,3.528 4.703331,0 4.703331,-7.055 0,-7.055 -1.946832,0.0022 -3.524347,1.580167 -3.526,3.527 m 0,-8.727 c 0.0017,1.946995 1.579006,3.525244 3.526,3.528 4.703998,0 4.703998,-7.056 0,-7.056 -1.946994,0.0028 -3.524348,1.581005 -3.526,3.528 M 71.025,44.92 c 0.0018,3.140416 3.799089,4.710649 6.018485,2.489364 C 79.262881,45.188079 77.689416,41.39211 74.549,41.393 c -1.946965,0.0011 -3.524552,1.580034 -3.524,3.527 m 0,-8.728 c -0.0013,4.699998 7.048667,4.701998 7.05,0.002 0.0013,-4.699998 -7.048667,-4.701998 -7.05,-0.002 m -8.727,34.906 c 0.0011,1.946833 1.578168,3.525243 3.525,3.528 4.624805,-0.07787 4.624805,-6.977129 0,-7.055 -1.946899,0.0017 -3.524449,1.580101 -3.525,3.527 m 0,-26.178 c 0,1.946804 1.578196,3.525 3.525,3.525 4.701331,0 4.701331,-7.052 0,-7.052 -1.947127,0.0011 -3.525,1.579872 -3.525,3.527 m -8.73,34.9 c -5.53e-4,1.948689 1.579311,3.528553 3.528,3.528 1.94947,0.0017 3.530553,-1.578529 3.53,-3.528 -0.0033,-1.946737 -1.583261,-3.522659 -3.53,-3.521 -1.946186,-0.0011 -3.525241,1.574816 -3.528,3.521 m 0,-8.722 c 0.0028,1.947319 1.580681,3.525246 3.528,3.528 1.9481,-0.0017 3.527244,-1.579902 3.53,-3.528 -0.0022,-1.948165 -1.581834,-3.52645 -3.53,-3.527 -1.947613,0.0011 -3.526345,1.579387 -3.528,3.527 m 0,-26.178 c 0.0017,1.947289 1.58071,3.525001 3.528,3.525 1.947842,5.53e-4 3.527792,-1.577159 3.53,-3.525 -0.109388,-4.594641 -6.948612,-4.594641 -7.058,0 m -8.723,-8.728 c -5.53e-4,1.948528 1.579472,3.528105 3.528,3.527 4.701331,0 4.701331,-7.052 0,-7.052 -1.947518,-5.52e-4 -3.526896,1.577482 -3.528,3.525 M 36.12,79.82 c -0.0017,1.948757 1.578243,3.529106 3.527,3.528 1.948435,0.0011 3.527766,-1.579567 3.525,-3.528 -5.52e-4,-1.945928 -1.579072,-3.522658 -3.525,-3.521 -1.946252,-0.0017 -3.525344,1.574748 -3.527,3.521 m 0,-34.9 c 0.0013,4.701331 7.053333,4.699331 7.052,-0.002 -0.0013,-4.701331 -7.053333,-4.699331 -7.052,0.002 m -8.726,-8.728 c -6.67e-4,4.701331 7.051333,4.702331 7.052,10e-4 6.67e-4,-4.701331 -7.051333,-4.702331 -7.052,-10e-4 M 18.667,79.82 c -0.0022,1.948204 1.576795,3.528554 3.525,3.528 4.699998,0 4.699998,-7.05 0,-7.05 -1.94609,-0.0011 -3.524448,1.57591 -3.525,3.522" />
</svg>

After

Width:  |  Height:  |  Size: 4.9 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 14 KiB

After

Width:  |  Height:  |  Size: 6 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 74 KiB

66
images/fernschreiber.svg Normal file
View file

@ -0,0 +1,66 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
id="svg19"
version="1.1"
height="114.667"
width="114.667">
<metadata
id="metadata23">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<defs
id="defs9">
<linearGradient
id="a"
spreadMethod="pad"
gradientTransform="rotate(-135 51.755 21.438) scale(102.49707)"
gradientUnits="userSpaceOnUse"
y2="0"
x2="1"
y1="0"
x1="0">
<stop
id="stop2"
stop-color="#ec7221"
offset="0" />
<stop
id="stop4"
stop-color="#e7454c"
offset=".959" />
<stop
id="stop6"
stop-color="#e7454c"
offset="1" />
</linearGradient>
</defs>
<path
id="path11"
transform="matrix(1.33333 0 0 -1.33333 0 114.667)"
fill="url(#a)"
d="M.301 43L.3 1.723C.3.938.938.3 1.723.3H43C66.584.3 85.7 19.417 85.7 43c0 23.583-19.116 42.7-42.7 42.7C19.417 85.7.301 66.583.301 43" />
<path
id="path13"
fill="#fcba02"
d="M100 57.117c0-23.408-19.043-42.45-42.45-42.45-23.409 0-42.451 19.042-42.451 42.45v42.45h42.45c23.408 0 42.451-19.042 42.451-42.45" />
<path
style="fill:#fffda9"
id="path15"
d="m 81.517,53.646 c -0.0573,2.403947 3.578298,2.403947 3.521,0 0.0573,-2.403947 -3.578298,-2.403947 -3.521,0 m -8.73,0 c 0.09308,2.256331 3.433918,2.256331 3.527,0 0,-2.351999 -3.528,-2.351999 -3.528,0 m -8.723,0 c 0,2.347999 3.522,2.347999 3.522,0 0,-2.347999 -3.522,-2.347999 -3.522,0 m -8.727,0 c -0.101696,2.44622 3.621306,2.447277 3.521,10e-4 -0.09236,-2.252442 -3.427362,-2.253389 -3.521,-10e-4 m -8.728,0 c -0.05733,2.406646 3.58233,2.406646 3.525,0 -0.05466,-2.294686 -3.470338,-2.294686 -3.525,0 m -8.726,0 c 6.67e-4,2.350666 3.526667,2.349666 3.526,-10e-4 0,-2.350666 -3.526,-2.350666 -3.526,0 m -8.726,0 c -0.05801,2.406625 3.581643,2.407658 3.525,10e-4 -0.05466,-2.294686 -3.470338,-2.294686 -3.525,0 m -8.728,0 c 0,2.353332 3.53,2.353332 3.53,0 0,-0.973 -0.79,-1.763 -1.766,-1.763 -0.975,0 -1.764,0.79 -1.764,1.763" />
<path
style="fill:#fffee3"
id="path17"
d="m 79.751,79.82 c -0.08052,4.780502 7.131515,4.780502 7.051,0 -0.109325,-4.589371 -6.940675,-4.589371 -7.05,0 m 0,-8.722 c 0.0022,1.946378 1.578625,3.524144 3.525,3.528 4.703331,0 4.703331,-7.055 0,-7.055 -1.946832,0.0022 -3.524347,1.580167 -3.526,3.527 m 0,-8.727 c 0.0017,1.946995 1.579006,3.525244 3.526,3.528 4.703998,0 4.703998,-7.056 0,-7.056 -1.946994,0.0028 -3.524348,1.581005 -3.526,3.528 M 71.025,44.92 c 0.0018,3.140416 3.799089,4.710649 6.018485,2.489364 C 79.262881,45.188079 77.689416,41.39211 74.549,41.393 c -1.946965,0.0011 -3.524552,1.580034 -3.524,3.527 m 0,-8.728 c -0.0013,4.699998 7.048667,4.701998 7.05,0.002 0.0013,-4.699998 -7.048667,-4.701998 -7.05,-0.002 m -8.727,34.906 c 0.0011,1.946833 1.578168,3.525243 3.525,3.528 4.624805,-0.07787 4.624805,-6.977129 0,-7.055 -1.946899,0.0017 -3.524449,1.580101 -3.525,3.527 m 0,-26.178 c 0,1.946804 1.578196,3.525 3.525,3.525 4.701331,0 4.701331,-7.052 0,-7.052 -1.947127,0.0011 -3.525,1.579872 -3.525,3.527 m -8.73,34.9 c -5.53e-4,1.948689 1.579311,3.528553 3.528,3.528 1.94947,0.0017 3.530553,-1.578529 3.53,-3.528 -0.0033,-1.946737 -1.583261,-3.522659 -3.53,-3.521 -1.946186,-0.0011 -3.525241,1.574816 -3.528,3.521 m 0,-8.722 c 0.0028,1.947319 1.580681,3.525246 3.528,3.528 1.9481,-0.0017 3.527244,-1.579902 3.53,-3.528 -0.0022,-1.948165 -1.581834,-3.52645 -3.53,-3.527 -1.947613,0.0011 -3.526345,1.579387 -3.528,3.527 m 0,-26.178 c 0.0017,1.947289 1.58071,3.525001 3.528,3.525 1.947842,5.53e-4 3.527792,-1.577159 3.53,-3.525 -0.109388,-4.594641 -6.948612,-4.594641 -7.058,0 m -8.723,-8.728 c -5.53e-4,1.948528 1.579472,3.528105 3.528,3.527 4.701331,0 4.701331,-7.052 0,-7.052 -1.947518,-5.52e-4 -3.526896,1.577482 -3.528,3.525 M 36.12,79.82 c -0.0017,1.948757 1.578243,3.529106 3.527,3.528 1.948435,0.0011 3.527766,-1.579567 3.525,-3.528 -5.52e-4,-1.945928 -1.579072,-3.522658 -3.525,-3.521 -1.946252,-0.0017 -3.525344,1.574748 -3.527,3.521 m 0,-34.9 c 0.0013,4.701331 7.053333,4.699331 7.052,-0.002 -0.0013,-4.701331 -7.053333,-4.699331 -7.052,0.002 m -8.726,-8.728 c -6.67e-4,4.701331 7.051333,4.702331 7.052,10e-4 6.67e-4,-4.701331 -7.051333,-4.702331 -7.052,-10e-4 M 18.667,79.82 c -0.0022,1.948204 1.576795,3.528554 3.525,3.528 4.699998,0 4.699998,-7.05 0,-7.05 -1.94609,-0.0011 -3.524448,1.57591 -3.525,3.522" />
</svg>

After

Width:  |  Height:  |  Size: 4.8 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.7 KiB

View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="96" width="96"><rect ry="4.266" y="22.813" x="10.724" height="50.374" width="74.552" fill="none" stroke="#fff" stroke-width="2"/><rect ry="2.854" y="31.152" x="19.266" height="33.696" width="57.467" opacity=".6" fill="none" stroke="#fff" stroke-width="2"/></svg>

After

Width:  |  Height:  |  Size: 310 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.1 KiB

View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="64" width="64"><path d="M15.268 13c-1.1 0-2.268.9-2.268 2v34c0 1.1 1.168 2 2.268 2H36.74L51 37.01V15c0-1.1-.633-2-1.732-2h-34zm11.007 7.975a1 1 0 011.016 1.015v5.897c0 1.333-2 1.333-2 0V21.99a1 1 0 01.984-1.015zm11.987 0a1.001 1.001 0 011.013 1.015v5.897c0 1.333-2 1.333-2 0V21.99a1 1 0 01.987-1.015zm8.62 11.863v.002a.999.999 0 01.987 1.29c-1.788 6.11-8.123 10.468-15.586 10.468-7.384 0-13.686-4.29-15.55-10.3-.427-1.29 1.532-1.896 1.91-.591 1.563 5.039 7.031 8.89 13.64 8.89 6.68 0 12.168-3.909 13.666-9.027a1 1 0 01.934-.732z" fill="#fff" fill-opacity=".502"/><path d="M36.74 39.125V51l14.267-14H39.132c-1.1 0-2.392 1.025-2.392 2.125z" fill="#fff"/></svg>

After

Width:  |  Height:  |  Size: 706 B

View file

@ -112,19 +112,8 @@ Item {
visible: status === Image.Ready ? true : false
}
Image {
id: imageLoadingBackgroundImage
source: "../../images/background-" + ( Theme.colorScheme ? "black" : "white" ) + "-small.png"
anchors {
centerIn: parent
}
width: parent.width - Theme.paddingSmall
height: parent.height - Theme.paddingSmall
BackgroundImage {
visible: placeholderImage.status !== Image.Ready
asynchronous: true
fillMode: Image.PreserveAspectFit
opacity: 0.15
}
Rectangle {

View file

@ -0,0 +1,38 @@
/*
Copyright (C) 2020 Sebastian J. Wolf and other contributors
This file is part of Fernschreiber.
Fernschreiber is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.
Fernschreiber is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU General Public License for more details.
You should have received a copy of the GNU General Public License
along with Fernschreiber. If not, see <http://www.gnu.org/licenses/>.
*/
import QtQuick 2.0
import Sailfish.Silica 1.0
Image {
id: imageLoadingBackgroundImage
asynchronous: true
fillMode: Image.PreserveAspectFit
width: sourceDimension
height: sourceDimension
opacity: 0.15
source: "../../images/background-" + ( Theme.colorScheme ? "black" : "white" ) + ".svg"
property int sourceDimension: Math.min(parent.width, parent.height) - Theme.paddingMedium
anchors {
centerIn: parent
}
sourceSize {
width: sourceDimension
height: sourceDimension
}
}

View file

@ -81,19 +81,7 @@ Item {
}
}
Image {
id: imageLoadingBackgroundImage
source: "../../images/background-" + ( Theme.colorScheme ? "black" : "white" ) + "-small.png"
anchors {
centerIn: parent
}
width: parent.width - Theme.paddingMedium
height: parent.height - Theme.paddingMedium
BackgroundImage {
visible: singleImage.status !== Image.Ready
asynchronous: true
fillMode: Image.PreserveAspectFit
opacity: 0.15
}
}

View file

@ -103,19 +103,8 @@ Item {
}
}
Image {
id: imageLoadingBackgroundImage
source: "../../images/background-" + ( Theme.colorScheme ? "black" : "white" ) + "-small.png"
anchors {
centerIn: parent
}
width: parent.width - Theme.paddingMedium
height: parent.height - Theme.paddingMedium
BackgroundImage {
visible: singleImage.status !== Image.Ready
asynchronous: true
fillMode: Image.PreserveAspectFit
opacity: 0.15
}
}

View file

@ -78,12 +78,7 @@ Item {
Loader {
anchors.fill: parent
sourceComponent: Component {
Image {
source: "../../images/background-" + ( Theme.colorScheme ? "black" : "white" ) + "-small.png"
asynchronous: true
fillMode: Image.PreserveAspectFit
}
BackgroundImage {}
}
active: opacity > 0

View file

@ -134,19 +134,8 @@ Item {
visible: status === Image.Ready ? true : false
}
Image {
id: imageLoadingBackgroundImage
source: "../../images/background-" + ( Theme.colorScheme ? "black" : "white" ) + "-small.png"
anchors {
centerIn: parent
}
width: parent.width - Theme.paddingSmall
height: parent.height - Theme.paddingSmall
BackgroundImage {
visible: placeholderImage.status !== Image.Ready
asynchronous: true
fillMode: Image.PreserveAspectFit
opacity: 0.15
}
Rectangle {
@ -193,20 +182,23 @@ Item {
height: parent.height
width: parent.width / 2
visible: !videoMessageComponent.fullscreen
Image {
IconButton {
id: fullscreenButton
anchors.centerIn: parent
width: Theme.iconSizeLarge
height: Theme.iconSizeLarge
asynchronous: true
source: "../../images/icon-l-fullscreen.png"
visible: ( placeholderImage.status === Image.Ready && !videoMessageComponent.fullscreen ) ? true : false
MouseArea {
anchors.fill: parent
onClicked: {
pageStack.push(Qt.resolvedUrl("../pages/VideoPage.qml"), {"videoData": videoData});
icon {
asynchronous: true
source: "../../images/icon-l-fullscreen.svg"
sourceSize {
width: Theme.iconSizeLarge
height: Theme.iconSizeLarge
}
}
visible: ( placeholderImage.status === Image.Ready && !videoMessageComponent.fullscreen ) ? true : false
onClicked: {
pageStack.push(Qt.resolvedUrl("../pages/VideoPage.qml"), {"videoData": videoData});
}
}
}
}
@ -424,20 +416,23 @@ Item {
height: parent.height
width: parent.width / 2
visible: !videoMessageComponent.fullscreen
Image {
IconButton {
id: pausedFullscreenButton
anchors.centerIn: parent
width: Theme.iconSizeLarge
height: Theme.iconSizeLarge
asynchronous: true
source: "../../images/icon-l-fullscreen.png"
visible: ( videoComponentLoader.active && messageVideo.playbackState === MediaPlayer.PausedState ) ? true : false
MouseArea {
anchors.fill: parent
onClicked: {
pageStack.push(Qt.resolvedUrl("../pages/VideoPage.qml"), {"videoData": videoData});
icon {
asynchronous: true
source: "../../images/icon-l-fullscreen.svg"
sourceSize {
width: Theme.iconSizeLarge
height: Theme.iconSizeLarge
}
}
visible: ( videoComponentLoader.active && messageVideo.playbackState === MediaPlayer.PausedState ) ? true : false
onClicked: {
pageStack.push(Qt.resolvedUrl("../pages/VideoPage.qml"), {"videoData": videoData});
}
}
}
}

View file

@ -138,19 +138,8 @@ Column {
}
}
Image {
id: imageLoadingBackgroundImage
source: "../../images/background-" + ( Theme.colorScheme ? "black" : "white" ) + "-small.png"
anchors {
centerIn: parent
}
width: parent.width - Theme.paddingMedium
height: parent.height - Theme.paddingMedium
BackgroundImage {
visible: hasImage && singleImage.status !== Image.Ready
asynchronous: true
fillMode: Image.PreserveAspectFit
opacity: 0.15
}
}

View file

@ -44,14 +44,18 @@ Page {
Image {
id: wunderfitzImage
source: "../../images/fernschreiber.png"
source: "../../images/fernschreiber.svg"
anchors {
horizontalCenter: parent.horizontalCenter
}
sourceSize {
width: width
height: height
}
fillMode: Image.PreserveAspectFit
asynchronous: true
width: Math.min(2 * Theme.itemSizeHuge, Math.min(aboutPage.width, aboutPage.height) / 2)
height: width
}
Label {

View file

@ -1146,18 +1146,17 @@ Page {
pageStack.push(documentPickerPage);
}
}
HighlightImage {
source: "../../images/icon-m-sticker.png"
width: Theme.itemSizeSmall
height: Theme.itemSizeSmall
color: Theme.primaryColor
highlightColor: Theme.highlightColor
highlighted: stickerPickerLoader.active
MouseArea {
anchors.fill: parent
onClicked: {
stickerPickerLoader.active = !stickerPickerLoader.active;
}
IconButton {
icon.source: "../../images/icon-m-sticker.svg"
icon.sourceSize {
width: Theme.iconSizeMedium
height: Theme.iconSizeMedium
}
highlighted: down || stickerPickerLoader.active
onClicked: {
stickerPickerLoader.active = !stickerPickerLoader.active;
}
}
}

View file

@ -19,6 +19,7 @@
import QtQuick 2.5
import Sailfish.Silica 1.0
import WerkWolf.Fernschreiber 1.0
import "../components"
import "../js/functions.js" as Functions
CoverBackground {
@ -90,21 +91,19 @@ CoverBackground {
}
}
Image {
BackgroundImage {
id: backgroundImage
source: "../../images/background-" + ( Theme.colorScheme ? "black" : "white" ) + ".png"
width: parent.height - Theme.paddingLarge
height: width
sourceDimension: width
anchors {
verticalCenter: parent.verticalCenter
centerIn: undefined
bottom: parent.bottom
bottomMargin: Theme.paddingMedium
right: parent.right
rightMargin: Theme.paddingMedium
}
fillMode: Image.PreserveAspectFit
opacity: 0.15
}
Column {

View file

@ -179,19 +179,8 @@ Page {
}
Image {
id: imageLoadingBackgroundImage
source: "../../images/background-" + ( Theme.colorScheme ? "black" : "white" ) + "-small.png"
anchors {
centerIn: parent
}
width: parent.width - Theme.paddingMedium
height: parent.height - Theme.paddingMedium
BackgroundImage {
visible: singleImage.status !== Image.Ready
asynchronous: true
fillMode: Image.PreserveAspectFit
opacity: 0.15
}
}

View file

@ -116,14 +116,18 @@ Page {
}
Image {
source: "../../images/fernschreiber.png"
source: "../../images/fernschreiber.svg"
anchors {
horizontalCenter: parent.horizontalCenter
}
sourceSize {
width: width
height: height
}
fillMode: Image.PreserveAspectFit
asynchronous: true
width: Math.min(2 * Theme.itemSizeHuge, Math.min(Screen.width, Screen.height) / 2)
height: width
}
BusyLabel {