New network icons

[nautilusx]

Hello,

here are some new or improved network icons.

There will be more in the next days ;o)

[grote]

Nice, thanks a lot! :)

I'll wait for you to add the others here before adding them to the code.

What would actually be most awesome is to use vector graphics wherever possible. Android does not use standard SVG images, but there are tools to convert SVG into Android vector format:
https://inloop.github.io/svg2android/

We have the AVV logo here as SVG: https://github.com/grote/Transportr/blob/master/art/networks/avv.svg

[nautilusx]

Hi Torsten,

the avv.svg has no white background. It looks not so nice if you use the dark theme.

I can make svg if you want but on your transportr homepage is the description for png.

[grote]

Yes, I mention the white background on the homepage as well. You can easily add a white-background there with Inkscape.

The vector support on Android is new. When it works here, I will add this to the homepage. The challenge is to get a vector graphic in the format Android needs.

[nautilusx]

Hi Torsten,

I made new svgs with inkscape
neue svg logos.zip

and convert the svg with https://inloop.github.io/svg2android/
svg_and_xml_logos.zip

But I get only new xml files to download with this converter. (rename to svg did not work)

Can you please check what you need and I will do the new network logos.

By the way thanks to github ;o( (Unfortunately, we don’t support that file type. Try again with a PNG, GIF, JPG, DOCX, PPTX, XLSX, TXT, PDF, or ZIP.)

[grote]

Thanks for trying producing vector drawables. Unfortunately, they do not work.

It is normal that you get an XML. It is a slightly different format from SVG and therefore has a different file ending as well.

I tried it myself with the AVV logo and I can not even get this to work in the svg2android. I can import it with AndroidStudio and create a vector drawable there, but it does not look right :(
Maybe you understand now, why I didn't put vector drawables on the homepage. It is quite tricky to get those right and simple raster graphics is much easier.

You are welcome to try again. With Android Studio, you can check the result and make sure it is correct. If not, we just take the raster graphics.

[grote]

Actually, I got something working with the AVV logo. It just misses the white background. I guess this needs to be its own path. Also it does not look exactly as the official logo, but this is already the case in your SVG file.

Taking my original SVG, I get this which is working and looking like the official logo (still without white background):

<vector xmlns:android="http://schemas.android.com/apk/res/android"
        android:width="164.17184dp"
        android:height="164.15652dp"
        android:viewportWidth="164.17184"
        android:viewportHeight="164.15652">

    <path
        android:fillColor="#0070ae"
        android:pathData="M27.3211,54.8533 L-0.7414,106.103 L15.7586,106.103 L33.7586,73.1973
L45.3211,106.103 L61.8211,106.103 L43.7898,54.8533 L27.3211,54.8533 Z" />
    <path
        android:fillColor="#50bede"
        android:pathData="M52.8836,54.8533 L70.8836,106.103 L70.9146,106.103 L87.3834,106.103
L115.446,54.8533 L98.9455,54.8533 L80.9455,87.7593 L69.3518,54.8533
L52.883,54.8533 Z" />
    <path
        android:fillColor="#c2ce00"
        android:pathData="M145.228,54.8533 L127.197,87.7593 L119.103,64.6973 L109.072,83.0413
L117.166,106.103 L133.666,106.103 L161.729,54.8533 L145.229,54.8533 Z" />
    <path
        android:fillColor="#005386"
        android:pathData="M43.8041,54.8573 L27.3153,54.8573 L27.3153,54.8583 L33.764,73.2003
L43.804,54.8583 L43.804,54.8573 Z" />
    <path
        android:fillColor="#009ad5"
        android:pathData="M70.8962,106.118 L87.3837,106.118 L80.9362,87.7743 L70.8962,106.118 Z" />
    <path
        android:fillColor="#90b912"
        android:pathData="M117.168,106.118 L133.657,106.118 L127.208,87.7743 L117.168,106.118 Z" />
</vector>

[grote]

OK and this is how it looks perfect and finished with white background:

<vector xmlns:android="http://schemas.android.com/apk/res/android"
        android:width="48dp"
        android:height="48dp"
        android:viewportHeight="164"
        android:viewportWidth="164">

    <path
        android:fillColor="#ffffff"
        android:pathData="M0,0 L164,0 L164,164 L0,164 L0,0 Z"/>
    <path
        android:fillColor="#0070ae"
        android:pathData="M31.6494,56.9398 L5.8712,104.018 L21.028,104.018 L37.5628,73.7906
L48.1841,104.018 L63.341,104.018 L46.7774,56.9398 L31.6493,56.9398 Z"/>
    <path
        android:fillColor="#50bede"
        android:pathData="M55.1311,56.9398 L71.6658,104.018 L71.6943,104.018 L86.8225,104.018
L112.6,56.9398 L97.4435,56.9398 L80.9087,87.1672 L70.2587,56.9398
L55.1305,56.9398 Z"/>
    <path
        android:fillColor="#c2ce00"
        android:pathData="M139.958,56.9398 L123.395,87.1672 L115.96,65.9825 L106.745,82.8333
L114.18,104.018 L129.337,104.018 L155.116,56.9398 L139.959,56.9398 Z"/>
    <path
        android:fillColor="#005386"
        android:pathData="M46.7907,56.9435 L31.6441,56.9435 L31.6441,56.9444 L37.5679,73.7934
L46.7906,56.9444 L46.7906,56.9435 Z"/>
    <path
        android:fillColor="#009ad5"
        android:pathData="M71.6774,104.032 L86.8228,104.032 L80.9002,87.181 L71.6774,104.032 Z"/>
    <path
        android:fillColor="#90b912"
        android:pathData="M114.182,104.032 L129.329,104.032 L123.405,87.181 L114.182,104.032 Z"/>
</vector>

[grote]

Da das so super funktionier hat, hab ich das mal offiziell in den Code eingebaut, damit du direkt siehst, wie das geht: b88b2de

Meinst du, du koenntest auch andere logos in dieses format wandeln?

[grote]

Oops, switching back to English here. The DB logo doesn't work, because of the way it uses paths. I created an issue for this here: inloop/svg2android#43

[grote]

There's another converter that has a special option to deal with this problem: https://github.com/a-student/SvgToVectorDrawableConverter#not-supported-svg-features
It also supports batch processing which might be nice to convert many images in one go.

There's also instructions for how to edit a problematic file in Inkscape so it will work. I just tried that and managed to get a vector drawable. So there's nothing stopping you from producing those for as many transport networks as you like! 😄

Here's the DB logo for reference:

<?xml version="1.0" encoding="utf-8"?>
<vector xmlns:android="http://schemas.android.com/apk/res/android"
        android:width="48dp"
        android:height="48dp"
        android:viewportHeight="745"
        android:viewportWidth="745">

    <path
        android:fillColor="#ffffff"
        android:pathData="M0,0 L745,0 L745,745 L0,745 L0,0 Z"/>
    <path
        android:fillColor="#ec1b2d"
        android:pathData="M90.5822,127.023 L654.184,127.023
C694.257,127.023,726.831,159.363,726.831,199.436 L726.831,545.33
C726.831,585.403,694.257,617.977,654.184,617.977 L90.582,617.977
C50.5087,617.977,18.1691,585.403,18.1691,545.33 L18.1691,199.436
C18.1691,159.363,50.5087,127.023,90.582,127.023 Z M91.5195,176.47
C79.0992,176.47,69.0224,186.547,69.0224,198.967 L69.0224,545.799
C69.0224,558.219,79.0992,568.296,91.5195,568.296 L653.481,568.296
C665.901,568.296,675.978,558.219,675.978,545.799 L675.978,198.967
C675.978,186.547,665.901,176.47,653.481,176.47 L91.52,176.47"/>
    <path
        android:fillColor="#ec1b2d"
        android:pathData="M110.736,212.559 L235.408,212.559
C313.211,212.559,358.908,262.709,358.908,370.977
C358.908,486.275,311.102,532.441,235.408,532.441 L110.736,532.441 Z
M393.826,212.559 L533.262,212.559
C591.614,212.559,620.907,247.711,620.907,288.253
C620.907,341.449,589.739,359.494,565.602,364.65 L565.602,366.056
C601.691,370.743,634.265,396.287,634.265,445.265
C634.031,497.993,595.832,532.442,524.591,532.442 L393.826,532.442 Z
M187.836,481.354 L216.66,481.354 C255.562,481.354,282.98,455.576,282.98,369.571
C282.98,294.58,259.546,262.709,215.254,262.709 L187.836,262.709 Z
M470.223,339.34 L499.282,339.34 C529.513,339.34,542.402,322.701,542.402,298.798
C542.402,279.113,529.982,262.24,499.751,262.24 L470.224,262.24 Z
M470.223,481.354 L507.015,481.354
C532.793,481.354,552.009,466.122,552.009,439.64
C552.009,416.908,542.401,399.567,506.546,399.567 L470.222,399.567 Z"/>
</vector>

[nautilusx]

Hi Torsten,

all network logos for Germany and Austria are done.

Next week I try all the other 35 networks. ;o)

@vinzv Can you help me please with the MVV, DING, VRS and SVV (Austria). There are still pictures in the svgs.

[grote]

Thanks @nautilusx and @vinzv!

I have now added all logos and fixed the problematic ones. This completes Germany and Austria! Feel free to complete all the logos! :)
If you want to do more, maybe write here which ones, so that you don't do something the other one is already doing.

I'll update the SVG for Ontario and Quebec and create the vector drawables for those.

[grote]

Since all network logos (at least for Germany and Austria) have been implemented, I will close this issue. Feel free to open a new one for other regions.