Adding Vehicle Images

Adding Vehicle Images

Note: this page is meant for developers. There currently is no means to import any custom images into the App.

Minimum Requirements

A minimum car image set consists of…

1. a main image (view from front, half profile left or right)
2. an outline image (view from above)
3. a map icon (normally the scaled down outline image).

All images should have the background (outside the vehicle) removed and replaced by transparency. Use feathering on the edges to achieve a smooth transition.

Image aspect ratio can be chosen as is best for the vehicle, the images will be scaled automatically to fill the view. Image sizes should not exceed 800 pixels in any direction, 650 pixels are totally sufficient. For the map icon, a maximum size of 128 pixel in any direction is allowed.

Image file format for all is currently PNG. Optimize your PNGs using a specialized tool like https://www.img2go.com/compress-image -- this reduces PNG sizes far better than your standard image processing software, without noticable losses.

You can add multiple colors, but please try to cut down the outline and map icon images to a single color to save space -- all images currently need to be added to the App package. If you need to add multiple colors, make all images the same size, and keep in mind common overlays may need to be applied.

Image files are all placed in res/drawable_nodpi, names need to follow this convention:

1. Main image(s): car_<vehicleshortcut>_<color>.png
2. Outline image(s): ol_car_<vehicleshortcut>_<color>.png
3. Map icon(s): map_car_<vehicleshortcut>_<color>.png

Example

1. car_env200_white.png
2. ol_car_env200_white.png
3. map_car_env200_white.png

Additional Overlays

Depending on the status features supported by the vehicle adapter you may want to add overlays to show certain vehicle states. Typical candidates for this are showing a currently active charge process (e.g. by overlaying a plugged in charge cable), showing open doors or frunks, and showing the vehicle lights.

These overlays are applied onto the outline image, so they need to match the dimension of these and be transparent except for the parts to be overlayed.

Example:

• Twizy outline
• Twizy charge overlay

Code Integration

1. Add the set of main image names (with extension removed) to the string array sAvailableColors in module ui/Settings/CarEditorFragment.java: https://github.com/openvehicles/Open-Vehicle-Android/blob/master/app/src/main/java/com/openvehicles/OVMS/ui/settings/CarEditorFragment.java#L298
2. Add the outline image case to method updateCarBodyView() in ui/CarFragment.java: https://github.com/openvehicles/Open-Vehicle-Android/blob/master/app/src/main/java/com/openvehicles/OVMS/ui/CarFragment.java#L514
3. If any, add functional overlays to method updateCarBodyView() in ui/CarFragment.java: https://github.com/openvehicles/Open-Vehicle-Android/blob/master/app/src/main/java/com/openvehicles/OVMS/ui/CarFragment.java#L807
4. Add the map icon case to method update() in ui/FragMap.java: https://github.com/openvehicles/Open-Vehicle-Android/blob/master/app/src/main/java/com/openvehicles/OVMS/ui/FragMap.java#L517
5. Add the map icon case to method onMessageReceived() in receiver/MyGcmListenerService.java: https://github.com/openvehicles/Open-Vehicle-Android/blob/master/app/src/main/java/com/openvehicles/OVMS/receiver/MyFirebaseMessagingService.java#L155