How do I Custom colors?

You should be able to just use a hex value as hex is a representation of an integer. The API values are all defined as 0xRRGGBB.

var forground = 0x123456;
var background= 0x789ABC;
dc.setColor(foreground, background);


Ken - but aren't there only 16 or 64 actual colors on most devices? 0x123456 and 0x789ABC aren't really colors on the devices.

Here's a table that someone posted a while back with the 16 and 64 colors...

https://docs.google.com/spreadsheets/d/1moYO2F3ltqbEde_vHaoKstnXLRR4AgQgQ4Yp_aGQPn4/edit#gid=0

Ken - but aren't there only 16 or 64 actual colors on most devices? 0x123456 and 0x789ABC aren't really colors on the devices.

Here's a table that someone posted a while back with the 16 and 64 colors...

https://docs.google.com/spreadsheets/d/1moYO2F3ltqbEde_vHaoKstnXLRR4AgQgQ4Yp_aGQPn4/edit#gid=0

I was using those values as example hex color codes. The valid colors used on the devices are in devices.xml. I believe the dc.setColor() API will match the colors you pass to the closest color on the device. I would recommend checking the list of supported colors though so there's no question what color you provide will be mapped to.

I was using those values as example hex color codes. The valid colors used on the devices are in devices.xml. I believe the dc.setColor() API will match the colors you pass to the closest color on the device. I would recommend checking the list of supported colors though so there's no question what color you provide will be mapped to.

Something that would be useful is a palette comparison chart on http://developer.garmin.com/connect-iq/user-experience-guide/
where colors are listed in a table and devices supporting that color are listed on the other axis. Kind of like a "free vs premium" like table you see on many sites today. Would make it easier to get an overview of which colors are supported by most devices.


Thanks

That chart would get pretty big pretty quick. All devices are supposed to support the base 15 colors listed in the documentation (14 colors + transparent). Some devices support 64 colors, and at least one device supports 16-bit color (65535 colors). To show all of the possible colors for the last set of devices would take hundreds of pages.

Do you really need a visualization of the colors supported by these devices? If you are making graphics in an editor, create color swatches for the 14 and 64 color cases, and then just make 16-bit color images for the high-end devices.

The following python code will read {SDK}/bin/devices.xml and generate a html table showing the colors supported by devices with a color palette.

import sys
import math
import argparse as argparse
import xml.etree.ElementTree as xml


def color_sort(x, y):
rx = (x & 0xff0000) >> 16
ry = (y & 0xff0000) >> 16

gx = (x & 0x00ff00) >> 8
gy = (y & 0x00ff00) >> 8

bx = (x & 0x00ff00) >> 0
by = (y & 0x00ff00) >> 0

hx = 0.2126 * (rx**2.2) + 0.7151 * (gx**2.2) + 0.0721 * (bx**2.2)
hy = 0.2126 * (ry**2.2) + 0.7151 * (gy**2.2) + 0.0721 * (by**2.2)

return cmp(hx, hy)


def read_devices(infile):

tree = xml.parse(infile)

device_list = []

root = tree.getroot()
for device in root.findall('./devices/device'):
device_name = device.get('id')

if not 'sim' in device_name and not 'watch' in device_name:
palette = device.find('./palette')
if palette is not None:

device_list.append({
'name': device.attrib['id'],
'colors': [ int(color.text, 16) for color in palette.findall('./color') ]
})

return device_list

def write_devices(device_list):

all_colors = set()

for device in device_list:
for color in device['colors']:
all_colors.add(color)

all_colors = [ color for color in all_colors ]
all_colors.sort(cmp=color_sort)

html = xml.Element('html')
head = xml.SubElement(html, 'head')
body = xml.SubElement(html, 'body')

table = xml.SubElement(body, 'table')
table.attrib['border'] = '1'

row = xml.SubElement(table, 'tr')

col = xml.SubElement(row, 'th')

for device in device_list:
col = xml.SubElement(row, 'th')
col.text = device['name']

for color in all_colors:
row = xml.SubElement(table, 'tr')

r = ((color & 0xff0000) >> 16) / 255.0
g = ((color & 0x00ff00) >> 8) / 255.0
b = ((color & 0x0000ff) >> 0) / 255.0
y = 0.2126 * (r**2.2) + 0.7151 * (g**2.2) + 0.0721 * (b**2.2)

cell = xml.SubElement(row, 'td')
cell.attrib['bgcolor'] = '{:06x}'.format(color)

cell_text = xml.SubElement(cell, 'font')
cell_text.text = '{:#08x}'.format(color)
if y < 0.18:
cell_text.attrib['color'] = 'white'
else:
cell_text.attrib['color'] = 'black'

for device in device_list:
device_cell = xml.SubElement(row, 'td')

if color in device['colors']:
device_cell.attrib['bgcolor'] = cell.attrib['bgcolor']

device_cell_text = xml.SubElement(device_cell, 'font')
device_cell_text.text = cell_text.text
device_cell_text.attrib['color'] = cell_text.attrib['color']

xml.dump(html)



def main():
parser = argparse.ArgumentParser(description='Read garmin device color information.')
parser.add_argument('--input', '-i',
dest='infile',
metavar='filename',
required=True,
type=argparse.FileType('r', 1024))

args = parser.parse_args();

write_devices(read_devices(args.infile))

if __name__ == '__main__':
main()


I've attached the resulting html (renamed to .txt to allow posting). You'll need to save it to your computer and change the extension back to html so you can view it.

The following python code will read {SDK}/bin/devices.xml and generate a html table showing the colors supported by devices with a color palette.

import sys
import math
import argparse as argparse
import xml.etree.ElementTree as xml


def color_sort(x, y):
rx = (x & 0xff0000) >> 16
ry = (y & 0xff0000) >> 16

gx = (x & 0x00ff00) >> 8
gy = (y & 0x00ff00) >> 8

bx = (x & 0x00ff00) >> 0
by = (y & 0x00ff00) >> 0

hx = 0.2126 * (rx**2.2) + 0.7151 * (gx**2.2) + 0.0721 * (bx**2.2)
hy = 0.2126 * (ry**2.2) + 0.7151 * (gy**2.2) + 0.0721 * (by**2.2)

return cmp(hx, hy)


def read_devices(infile):

tree = xml.parse(infile)

device_list = []

root = tree.getroot()
for device in root.findall('./devices/device'):
device_name = device.get('id')

if not 'sim' in device_name and not 'watch' in device_name:
palette = device.find('./palette')
if palette is not None:

device_list.append({
'name': device.attrib['id'],
'colors': [ int(color.text, 16) for color in palette.findall('./color') ]
})

return device_list

def write_devices(device_list):

all_colors = set()

for device in device_list:
for color in device['colors']:
all_colors.add(color)

all_colors = [ color for color in all_colors ]
all_colors.sort(cmp=color_sort)

html = xml.Element('html')
head = xml.SubElement(html, 'head')
body = xml.SubElement(html, 'body')

table = xml.SubElement(body, 'table')
table.attrib['border'] = '1'

row = xml.SubElement(table, 'tr')

col = xml.SubElement(row, 'th')

for device in device_list:
col = xml.SubElement(row, 'th')
col.text = device['name']

for color in all_colors:
row = xml.SubElement(table, 'tr')

r = ((color & 0xff0000) >> 16) / 255.0
g = ((color & 0x00ff00) >> 8) / 255.0
b = ((color & 0x0000ff) >> 0) / 255.0
y = 0.2126 * (r**2.2) + 0.7151 * (g**2.2) + 0.0721 * (b**2.2)

cell = xml.SubElement(row, 'td')
cell.attrib['bgcolor'] = '{:06x}'.format(color)

cell_text = xml.SubElement(cell, 'font')
cell_text.text = '{:#08x}'.format(color)
if y < 0.18:
cell_text.attrib['color'] = 'white'
else:
cell_text.attrib['color'] = 'black'

for device in device_list:
device_cell = xml.SubElement(row, 'td')

if color in device['colors']:
device_cell.attrib['bgcolor'] = cell.attrib['bgcolor']

device_cell_text = xml.SubElement(device_cell, 'font')
device_cell_text.text = cell_text.text
device_cell_text.attrib['color'] = cell_text.attrib['color']

xml.dump(html)



def main():
parser = argparse.ArgumentParser(description='Read garmin device color information.')
parser.add_argument('--input', '-i',
dest='infile',
metavar='filename',
required=True,
type=argparse.FileType('r', 1024))

args = parser.parse_args();

write_devices(read_devices(args.infile))

if __name__ == '__main__':
main()


I've attached the resulting html (renamed to .txt to allow posting). You'll need to save it to your computer and change the extension back to html so you can view it.

Wow that was very kind of you! Thanks!

Its a shame there is no turquoise/teal that works on all devices.