UI: Revamp empty state of SourcesTree

The empty state of the SourcesTree widget looks rather busy, with
multiple icons and text without spacing. Revamp that state to use
a single, faded-out, 32px icon, add some spacing between the icon
and the text, and put the icon above the text.
master
Georges Basile Stavracas Neto 2022-08-01 11:43:24 -03:00
parent 3f3cf02d2a
commit 2de20ac00d
3 changed files with 16 additions and 42 deletions

View File

@ -1,18 +1,4 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg width="125" height="40" viewBox="0 0 125 40" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:1.41421;">
<g transform="matrix(1.3524,0,0,1.3524,-40.8078,-17.9807)">
<g transform="matrix(0.0855581,0,0,0.0855581,29.3907,17.4063)">
<path d="M128,80L160,80L160,112L128,112L128,80ZM224,72L224,224C224,232.8 216.8,240 208,240L48,240C39.2,240 32,232.8 32,224L32,32C32,23.2 39.2,16 48,16L168,16L224,72ZM208,80L160,32L48,32L48,208L96,128L128,192L160,160L208,208L208,80Z" style="fill:#d2d2d2;"/>
</g>
<g transform="matrix(0.0859541,0,0,0.0859541,98.7496,17.3555)">
<path d="M240,48L112,48C112,39.2 104.8,32 96,32L32,32C23.2,32 16,39.2 16,48C7.2,48 0,55.2 0,64L0,208C0,216.8 7.2,224 16,224L240,224C248.8,224 256,216.8 256,208L256,64C256,55.2 248.8,48 240,48ZM96,80L32,80L32,64L96,64L96,80ZM168,192C136.96,192 112,167.04 112,136C112,104.96 136.96,80 168,80C199.04,80 224,104.96 224,136C224,167.04 199.04,192 168,192ZM208,136C208,158.08 189.92,176 168,176C146.08,176 128,157.92 128,136C128,114.08 146.08,96 168,96C189.92,96 208,114.08 208,136Z" style="fill:#d2d2d2;"/>
</g>
<g transform="matrix(0.0855581,0,0,0.0855581,75.3166,17.4063)">
<path d="M128,16C66.24,16 16,66.24 16,128C16,189.76 66.24,240 128,240C135.68,240 143.04,239.2 150.08,237.76C147.36,236.48 146.88,226.08 149.76,220.32C152.8,213.76 162.72,197.12 152.96,191.52C143.2,185.92 145.92,183.52 140,176.96C134.08,170.4 136.48,169.44 136,167.68C134.72,162.24 141.76,153.44 142.24,152.64C142.56,151.68 142.56,148.32 142.24,147.36C142.24,146.08 137.92,143.84 136.8,143.68C135.84,143.68 135.04,145.44 133.6,145.76C132.16,146.08 125.6,141.76 124.16,140.48C122.72,139.2 121.92,136.8 119.84,135.04C117.76,132.96 117.6,134.56 114.56,133.28C111.52,132 101.76,128.32 94.08,125.6C86.4,122.56 85.76,118.08 85.76,115.04C85.44,111.84 80.96,107.52 79.04,104.32C76.8,101.12 76.48,96.8 75.84,97.76C75.2,98.72 79.84,110.24 79.04,110.72C78.24,111.04 76.48,107.52 74.24,104.64C72,101.6 76.48,103.2 69.44,89.44C62.4,75.68 71.68,68.64 72.16,61.44C72.64,54.24 78.24,64.16 75.2,59.36C72.16,54.56 75.2,45.12 72.96,41.6C70.88,38.08 58.88,45.6 58.88,45.6C59.2,42.08 69.92,36.32 77.44,30.88C84.96,25.44 89.92,29.92 96,31.68C102.24,33.76 102.56,33.12 100.48,30.88C98.4,28.8 101.44,28.16 106.24,28.8C110.72,29.6 112.32,35.36 119.52,34.56C127.04,34.08 120.32,36 121.28,38.08C122.24,40.16 120.32,39.84 115.2,42.88C110.4,46.08 115.52,46.4 124,52.64C132.48,58.88 130.08,48.64 128.96,43.84C127.84,39.04 135.2,42.88 135.2,42.88C140.48,46.4 139.52,43.2 143.2,44.16C146.88,45.12 157.76,54.4 157.76,54.4C144.48,61.44 152.8,62.08 155.04,63.84C157.28,65.6 150.56,68.64 150.56,68.64C147.84,65.92 147.52,68.96 145.76,69.92C144,70.88 145.44,73.44 145.44,73.44C136.48,74.88 138.4,84.48 138.72,86.72C138.72,88.96 132.64,92.48 131.2,96C129.76,99.2 135.2,106.24 132.16,106.56C129.12,107.04 126.72,96 111.2,100C106.4,101.28 96.16,106.56 101.76,117.28C107.52,128.32 116.48,114.24 119.52,115.84C122.56,117.44 118.56,124.32 119.2,124.64C119.84,124.96 127.68,124.96 128.16,134.4C128.64,143.84 140.48,142.88 142.88,143.2C145.6,143.2 154.08,136.16 155.2,136C156.16,135.52 161.28,131.52 171.68,137.44C182.24,143.2 187.36,142.4 190.88,144.96C194.4,147.52 192.16,152.48 195.36,154.24C198.56,156 212.32,153.76 215.84,159.2C219.36,164.64 201.76,192.64 196.32,195.68C190.88,198.72 188.64,205.92 182.88,210.4C177.12,214.88 169.92,220.64 162.56,224.96C156,228.64 155.04,235.52 152,237.76C202.24,226.56 239.68,181.76 239.68,128.32C239.68,66.56 189.44,16.32 127.68,16.32L128,16ZM154.24,120.96C152.8,121.44 149.76,124.48 141.76,119.68C134.08,114.88 128.8,116 128,115.2C128,115.2 127.2,113.44 130.72,112.96C137.76,112.16 146.4,119.52 148.48,119.52C150.56,119.52 151.52,117.44 155.04,118.72C158.56,120 155.84,120.8 154.24,120.96ZM117.44,27.2C116.64,26.72 117.92,25.92 118.88,24.96C119.36,24.48 119.2,23.2 119.68,22.72C121.44,20.96 129.44,18.72 128,23.2C126.24,27.52 118.72,28 117.44,27.2ZM137.12,41.44C134.08,41.12 127.84,40.64 128.8,39.2C133.6,34.72 127.36,33.12 123.36,33.12C119.36,32.8 117.92,30.56 119.84,30.08C121.76,29.6 129.6,30.4 131.04,31.36C132.32,32.32 139.36,35.36 139.84,37.44C140.16,39.52 139.84,41.44 137.12,41.44ZM160.64,40.64C158.4,42.08 147.36,34.08 145.44,32.32C136.48,24.64 131.2,27.36 129.44,25.76C127.68,24.16 128.16,22.72 131.2,20.32C134.24,17.92 142.24,21.28 147.2,21.76C152,22.24 157.76,26.08 157.76,30.56C158.08,34.56 163.04,38.56 160.8,40.64L160.64,40.64Z" style="fill:#d2d2d2;"/>
</g>
<g transform="matrix(0.0914992,0,0,0.0914992,51.1921,15.9137)">
<path d="M240,32L16,32C7.2,32 0,39.2 0,48L0,192C0,200.8 7.2,208 16,208L101.44,208C97.44,217.76 87.68,230.24 64,240L192,240C168.32,230.24 158.56,217.76 154.56,208L240,208C248.8,208 256,200.8 256,192L256,48C256,39.2 248.8,32 240,32ZM240,176L16,176L16,48L240,48L240,176Z" style="fill:#d2d2d2;"/>
</g>
</g>
<?xml version="1.0" encoding="UTF-8"?>
<svg height="16px" viewBox="0 0 16 16" width="16px" xmlns="http://www.w3.org/2000/svg">
<path d="m 4 1 c -1.644531 0 -3 1.355469 -3 3 v 1 h 1 v -1 c 0 -1.109375 0.890625 -2 2 -2 h 1 v -1 z m 2 0 v 1 h 4 v -1 z m 5 0 v 1 h 1 c 1.109375 0 2 0.890625 2 2 v 1 h 1 v -1 c 0 -1.644531 -1.355469 -3 -3 -3 z m -3.03125 2 c -0.050781 0 -0.101562 0 -0.152344 0.003906 c -1.644531 0.09375 -2.90625 1.359375 -2.8125 3 h 2 c -0.035156 -0.5625 0.371094 -0.96875 0.9375 -1 c 0.5625 -0.03125 1.027344 0.375 1.0625 0.9375 v 0.03125 c 0.003906 0.128906 -0.035156 0.324219 -0.125 0.4375 c -0.230468 0.273438 -0.484375 0.496094 -0.6875 0.65625 c -0.230468 0.171875 -0.476562 0.382813 -0.71875 0.6875 c -0.246094 0.304688 -0.46875 0.746094 -0.46875 1.25 c -0.007812 0.527344 0.46875 1 1 1 c 0.523438 0 1 -0.46875 1 -0.992187 c 0 0 0.007813 -0.011719 0.027344 -0.039063 c 0.050781 -0.0625 0.1875 -0.167968 0.375 -0.3125 c 1.21875 -0.921875 1.59375 -1.441406 1.59375 -2.84375 c -0.085938 -1.589844 -1.453125 -2.824218 -3.03125 -2.816406 z m -6.96875 3 v 4 h 1 v -4 z m 13 0 v 4 h 1 v -4 z m -13 5 v 1 c 0 1.644531 1.355469 3 3 3 h 1 v -1 h -1 c -1.109375 0 -2 -0.890625 -2 -2 v -1 z m 13 0 v 1 c 0 1.109375 -0.890625 2 -2 2 h -1 v 1 h 1 c 1.644531 0 3 -1.355469 3 -3 v -1 z m -5.996094 0.003906 c -0.554687 0 -1 0.449219 -1 1 c 0 0.550782 0.445313 1 1 1 c 0.550782 0 1 -0.449218 1 -1 c 0 -0.550781 -0.449218 -1 -1 -1 z m -2.003906 2.996094 v 1 h 4 v -1 z m 0 0" fill="#fefefe" fill-opacity="0.34902"/>
</svg>

Before

Width:  |  Height:  |  Size: 5.1 KiB

After

Width:  |  Height:  |  Size: 1.5 KiB

View File

@ -1,18 +1,4 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg width="125" height="40" viewBox="0 0 125 40" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:1.41421;">
<g transform="matrix(1.3524,0,0,1.3524,-40.8078,-17.9807)">
<g transform="matrix(0.0855581,0,0,0.0855581,29.3907,17.4063)">
<path d="M128,80L160,80L160,112L128,112L128,80ZM224,72L224,224C224,232.8 216.8,240 208,240L48,240C39.2,240 32,232.8 32,224L32,32C32,23.2 39.2,16 48,16L168,16L224,72ZM208,80L160,32L48,32L48,208L96,128L128,192L160,160L208,208L208,80Z" style="fill:#000000;"/>
</g>
<g transform="matrix(0.0859541,0,0,0.0859541,98.7496,17.3555)">
<path d="M240,48L112,48C112,39.2 104.8,32 96,32L32,32C23.2,32 16,39.2 16,48C7.2,48 0,55.2 0,64L0,208C0,216.8 7.2,224 16,224L240,224C248.8,224 256,216.8 256,208L256,64C256,55.2 248.8,48 240,48ZM96,80L32,80L32,64L96,64L96,80ZM168,192C136.96,192 112,167.04 112,136C112,104.96 136.96,80 168,80C199.04,80 224,104.96 224,136C224,167.04 199.04,192 168,192ZM208,136C208,158.08 189.92,176 168,176C146.08,176 128,157.92 128,136C128,114.08 146.08,96 168,96C189.92,96 208,114.08 208,136Z" style="fill:#000000;"/>
</g>
<g transform="matrix(0.0855581,0,0,0.0855581,75.3166,17.4063)">
<path d="M128,16C66.24,16 16,66.24 16,128C16,189.76 66.24,240 128,240C135.68,240 143.04,239.2 150.08,237.76C147.36,236.48 146.88,226.08 149.76,220.32C152.8,213.76 162.72,197.12 152.96,191.52C143.2,185.92 145.92,183.52 140,176.96C134.08,170.4 136.48,169.44 136,167.68C134.72,162.24 141.76,153.44 142.24,152.64C142.56,151.68 142.56,148.32 142.24,147.36C142.24,146.08 137.92,143.84 136.8,143.68C135.84,143.68 135.04,145.44 133.6,145.76C132.16,146.08 125.6,141.76 124.16,140.48C122.72,139.2 121.92,136.8 119.84,135.04C117.76,132.96 117.6,134.56 114.56,133.28C111.52,132 101.76,128.32 94.08,125.6C86.4,122.56 85.76,118.08 85.76,115.04C85.44,111.84 80.96,107.52 79.04,104.32C76.8,101.12 76.48,96.8 75.84,97.76C75.2,98.72 79.84,110.24 79.04,110.72C78.24,111.04 76.48,107.52 74.24,104.64C72,101.6 76.48,103.2 69.44,89.44C62.4,75.68 71.68,68.64 72.16,61.44C72.64,54.24 78.24,64.16 75.2,59.36C72.16,54.56 75.2,45.12 72.96,41.6C70.88,38.08 58.88,45.6 58.88,45.6C59.2,42.08 69.92,36.32 77.44,30.88C84.96,25.44 89.92,29.92 96,31.68C102.24,33.76 102.56,33.12 100.48,30.88C98.4,28.8 101.44,28.16 106.24,28.8C110.72,29.6 112.32,35.36 119.52,34.56C127.04,34.08 120.32,36 121.28,38.08C122.24,40.16 120.32,39.84 115.2,42.88C110.4,46.08 115.52,46.4 124,52.64C132.48,58.88 130.08,48.64 128.96,43.84C127.84,39.04 135.2,42.88 135.2,42.88C140.48,46.4 139.52,43.2 143.2,44.16C146.88,45.12 157.76,54.4 157.76,54.4C144.48,61.44 152.8,62.08 155.04,63.84C157.28,65.6 150.56,68.64 150.56,68.64C147.84,65.92 147.52,68.96 145.76,69.92C144,70.88 145.44,73.44 145.44,73.44C136.48,74.88 138.4,84.48 138.72,86.72C138.72,88.96 132.64,92.48 131.2,96C129.76,99.2 135.2,106.24 132.16,106.56C129.12,107.04 126.72,96 111.2,100C106.4,101.28 96.16,106.56 101.76,117.28C107.52,128.32 116.48,114.24 119.52,115.84C122.56,117.44 118.56,124.32 119.2,124.64C119.84,124.96 127.68,124.96 128.16,134.4C128.64,143.84 140.48,142.88 142.88,143.2C145.6,143.2 154.08,136.16 155.2,136C156.16,135.52 161.28,131.52 171.68,137.44C182.24,143.2 187.36,142.4 190.88,144.96C194.4,147.52 192.16,152.48 195.36,154.24C198.56,156 212.32,153.76 215.84,159.2C219.36,164.64 201.76,192.64 196.32,195.68C190.88,198.72 188.64,205.92 182.88,210.4C177.12,214.88 169.92,220.64 162.56,224.96C156,228.64 155.04,235.52 152,237.76C202.24,226.56 239.68,181.76 239.68,128.32C239.68,66.56 189.44,16.32 127.68,16.32L128,16ZM154.24,120.96C152.8,121.44 149.76,124.48 141.76,119.68C134.08,114.88 128.8,116 128,115.2C128,115.2 127.2,113.44 130.72,112.96C137.76,112.16 146.4,119.52 148.48,119.52C150.56,119.52 151.52,117.44 155.04,118.72C158.56,120 155.84,120.8 154.24,120.96ZM117.44,27.2C116.64,26.72 117.92,25.92 118.88,24.96C119.36,24.48 119.2,23.2 119.68,22.72C121.44,20.96 129.44,18.72 128,23.2C126.24,27.52 118.72,28 117.44,27.2ZM137.12,41.44C134.08,41.12 127.84,40.64 128.8,39.2C133.6,34.72 127.36,33.12 123.36,33.12C119.36,32.8 117.92,30.56 119.84,30.08C121.76,29.6 129.6,30.4 131.04,31.36C132.32,32.32 139.36,35.36 139.84,37.44C140.16,39.52 139.84,41.44 137.12,41.44ZM160.64,40.64C158.4,42.08 147.36,34.08 145.44,32.32C136.48,24.64 131.2,27.36 129.44,25.76C127.68,24.16 128.16,22.72 131.2,20.32C134.24,17.92 142.24,21.28 147.2,21.76C152,22.24 157.76,26.08 157.76,30.56C158.08,34.56 163.04,38.56 160.8,40.64L160.64,40.64Z" style="fill:#000000;"/>
</g>
<g transform="matrix(0.0914992,0,0,0.0914992,51.1921,15.9137)">
<path d="M240,32L16,32C7.2,32 0,39.2 0,48L0,192C0,200.8 7.2,208 16,208L101.44,208C97.44,217.76 87.68,230.24 64,240L192,240C168.32,230.24 158.56,217.76 154.56,208L240,208C248.8,208 256,200.8 256,192L256,48C256,39.2 248.8,32 240,32ZM240,176L16,176L16,48L240,48L240,176Z" style="fill:#000000;"/>
</g>
</g>
<?xml version="1.0" encoding="UTF-8"?>
<svg height="16px" viewBox="0 0 16 16" width="16px" xmlns="http://www.w3.org/2000/svg">
<path d="m 4 1 c -1.644531 0 -3 1.355469 -3 3 v 1 h 1 v -1 c 0 -1.109375 0.890625 -2 2 -2 h 1 v -1 z m 2 0 v 1 h 4 v -1 z m 5 0 v 1 h 1 c 1.109375 0 2 0.890625 2 2 v 1 h 1 v -1 c 0 -1.644531 -1.355469 -3 -3 -3 z m -3.03125 2 c -0.050781 0 -0.101562 0 -0.152344 0.003906 c -1.644531 0.09375 -2.90625 1.359375 -2.8125 3 h 2 c -0.035156 -0.5625 0.371094 -0.96875 0.9375 -1 c 0.5625 -0.03125 1.027344 0.375 1.0625 0.9375 v 0.03125 c 0.003906 0.128906 -0.035156 0.324219 -0.125 0.4375 c -0.230468 0.273438 -0.484375 0.496094 -0.6875 0.65625 c -0.230468 0.171875 -0.476562 0.382813 -0.71875 0.6875 c -0.246094 0.304688 -0.46875 0.746094 -0.46875 1.25 c -0.007812 0.527344 0.46875 1 1 1 c 0.523438 0 1 -0.46875 1 -0.992187 c 0 0 0.007813 -0.011719 0.027344 -0.039063 c 0.050781 -0.0625 0.1875 -0.167968 0.375 -0.3125 c 1.21875 -0.921875 1.59375 -1.441406 1.59375 -2.84375 c -0.085938 -1.589844 -1.453125 -2.824218 -3.03125 -2.816406 z m -6.96875 3 v 4 h 1 v -4 z m 13 0 v 4 h 1 v -4 z m -13 5 v 1 c 0 1.644531 1.355469 3 3 3 h 1 v -1 h -1 c -1.109375 0 -2 -0.890625 -2 -2 v -1 z m 13 0 v 1 c 0 1.109375 -0.890625 2 -2 2 h -1 v 1 h 1 c 1.644531 0 3 -1.355469 3 -3 v -1 z m -5.996094 0.003906 c -0.554687 0 -1 0.449219 -1 1 c 0 0.550782 0.445313 1 1 1 c 0.550782 0 1 -0.449218 1 -1 c 0 -0.550781 -0.449218 -1 -1 -1 z m -2.003906 2.996094 v 1 h 4 v -1 z m 0 0" fill="#000000" fill-opacity="0.34902"/>
</svg>

Before

Width:  |  Height:  |  Size: 5.1 KiB

After

Width:  |  Height:  |  Size: 1.5 KiB

View File

@ -1721,22 +1721,24 @@ void SourceTree::paintEvent(QPaintEvent *event)
}
QRectF iconRect = iconNoSources.viewBoxF();
iconRect.setSize(QSizeF(32.0, 32.0));
QSizeF iconSize = iconRect.size();
QSizeF textSize = textNoSources.size();
QSizeF thisSize = size();
const qreal spacing = 16.0;
qreal totalHeight = textSize.height() + iconSize.height();
qreal totalHeight =
iconSize.height() + spacing + textSize.height();
qreal x = thisSize.width() / 2.0 - textSize.width() / 2.0;
qreal x = thisSize.width() / 2.0 - iconSize.width() / 2.0;
qreal y = thisSize.height() / 2.0 - totalHeight / 2.0;
p.drawStaticText(x, y, textNoSources);
x = thisSize.width() / 2.0 - iconSize.width() / 2.0;
y += textSize.height();
iconRect.moveTo(x, y);
iconRect.moveTo(std::round(x), std::round(y));
iconNoSources.render(&p, iconRect);
x = thisSize.width() / 2.0 - textSize.width() / 2.0;
y += spacing + iconSize.height();
p.drawStaticText(x, y, textNoSources);
} else {
QListView::paintEvent(event);
}