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 \ DISTFILES += qml/harbour-fernschreiber.qml \
qml/components/AudioPreview.qml \ qml/components/AudioPreview.qml \
qml/components/BackgroundImage.qml \
qml/components/ChatListViewItem.qml \ qml/components/ChatListViewItem.qml \
qml/components/DocumentPreview.qml \ qml/components/DocumentPreview.qml \
qml/components/ImagePreview.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 visible: status === Image.Ready ? true : false
} }
Image { BackgroundImage {
id: imageLoadingBackgroundImage
source: "../../images/background-" + ( Theme.colorScheme ? "black" : "white" ) + "-small.png"
anchors {
centerIn: parent
}
width: parent.width - Theme.paddingSmall
height: parent.height - Theme.paddingSmall
visible: placeholderImage.status !== Image.Ready visible: placeholderImage.status !== Image.Ready
asynchronous: true
fillMode: Image.PreserveAspectFit
opacity: 0.15
} }
Rectangle { 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 { BackgroundImage {
id: imageLoadingBackgroundImage
source: "../../images/background-" + ( Theme.colorScheme ? "black" : "white" ) + "-small.png"
anchors {
centerIn: parent
}
width: parent.width - Theme.paddingMedium
height: parent.height - Theme.paddingMedium
visible: singleImage.status !== Image.Ready visible: singleImage.status !== Image.Ready
asynchronous: true
fillMode: Image.PreserveAspectFit
opacity: 0.15
} }
} }

View file

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

View file

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

View file

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

View file

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

View file

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

View file

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

View file

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

View file

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