Damn! I remember that website from like early 2000s, the OG one was Graffiticreator.com. Throwback! Nice wallpaper.I have this Graffiti App that i use. I onky wish i could use my letters
How do I get the clock photo without hands? NEED!Maybe just me, but I thought it seemed like an obvious choice for wallpaper and clock background...
Ok I sent you a PM.How do I get the clock photo without hands? NEED!
Did you get my PM?How do I get the clock photo without hands? NEED!
Yup, just sent it!Did you get my PM?
Thanks to your expertly-laid-out dial, I was able to paste in the new "California" clock face from my Apple Watch and have it line up correctly. I'd give a dozen thumbs-up to your post if I could.Here's the first pass at the 70's-style clock background, and the Python source code to generate it. The code is a bit long and messy, but it's hand-tweaked to get everything aligned nicely. I'll probably at some point add in the equivalent to the yellow inner "km/h" marks as hours 13-24.
https://i.imgur.com/AaQoiZS.jpg
Code:import math from PIL import Image, ImageDraw, ImageFont def findPointOnCircle(cx, cy, radius, angle): x = cx + math.sin(math.radians(angle)) * radius y = cy - math.cos(math.radians(angle)) * radius x = int(round(x, 0)) y = int(round(y, 0)) return(x,y) im = Image.new("RGB",(800,480)) fnt = ImageFont.truetype("Eurostile-LT-Std-Demi_16310.ttf", 30) liner = ImageDraw.Draw(im).line circle = ImageDraw.Draw(im).ellipse texter = ImageDraw.Draw(im).text arcer = ImageDraw.Draw(im).arc zeros = (0,0) lowright = (800,480) center = (800/2,480/2) white = (255,255,255) black = (0,0,0) red = (255,0,0) green = (0,255,0) blue = (0,0,255) gray = (128,128,128) # This is probably the primary color used for the Civic's clock. It's the Java standard "light gray". lightGray = (0xD3,0xD3,0xD3) # Lines and circles for debugging the image. # liner([zeros, lowright], fill=white,width=1) # liner([(0,480),(800,0)], fill=white,width=1) # liner([(0,240),(800,240)], fill=white,width=1) # liner([(400,0),(400,480)], fill=white,width=1) # circle([(400-10,240-10),(400+10,240+10)], outline=gray) # for i in range(10,240,10): # circle([(400-i,240-i),(400+i,240+i)], outline=gray) for i in range(0,12): pipInside = findPointOnCircle(400,240,130,i*30) # pipOutside = findPointOnCircle(400,240,150,i*30) # liner([pipInside, pipOutside], fill=green,width=8) # pipOutside = findPointOnCircle(400,240,149,i*30) # liner([pipInside, pipOutside], fill=blue,width=8) # pipOutside = findPointOnCircle(400,240,148,i*30) # liner([pipInside, pipOutside], fill=red,width=8) pipOutside = findPointOnCircle(400,240,148,i*30) liner([pipInside, pipOutside], fill=lightGray,width=8) for i in range(0,12): pipInside = findPointOnCircle(400,240,130,i*30 + 15) pipOutside = findPointOnCircle(400,240,148,i*30 + 15) liner([pipInside, pipOutside], fill=lightGray,width=5) noonTextPoint = findPointOnCircle(400,240,110,0) noonTextPoint = (noonTextPoint[0] - 20, noonTextPoint[1] - 15) texter(noonTextPoint, "12", font=fnt, fill=lightGray) oneTextPoint = findPointOnCircle(400,240,110,30) oneTextPoint = (oneTextPoint[0] - 10, oneTextPoint[1] - 15) texter(oneTextPoint, "1", font=fnt, fill=lightGray) twoTextPoint = findPointOnCircle(400,240,110,60) twoTextPoint = (twoTextPoint[0] - 7, twoTextPoint[1] - 15) texter(twoTextPoint, "2", font=fnt, fill=lightGray) threeTextPoint = findPointOnCircle(400,240,110,90) threeTextPoint = (threeTextPoint[0] - 5, threeTextPoint[1] - 10) texter(threeTextPoint, "3", font=fnt, fill=lightGray) fourTextPoint = findPointOnCircle(400,240,110,120) fourTextPoint = (fourTextPoint[0] - 10, fourTextPoint[1] - 5) texter(fourTextPoint, "4", font=fnt, fill=lightGray) fiveTextPoint = findPointOnCircle(400,240,110,150) fiveTextPoint = (fiveTextPoint[0] - 10, fiveTextPoint[1] - 10) texter(fiveTextPoint, "5", font=fnt, fill=lightGray) sixTextPoint = findPointOnCircle(400,240,110,180) sixTextPoint = (sixTextPoint[0] - 10, sixTextPoint[1] - 10) texter(sixTextPoint, "6", font=fnt, fill=lightGray) sevenTextPoint = findPointOnCircle(400,240,110,210) sevenTextPoint = (sevenTextPoint[0] - 10, sevenTextPoint[1] - 10) texter(sevenTextPoint, "7", font=fnt, fill=lightGray) eightTextPoint = findPointOnCircle(400,240,110,240) eightTextPoint = (eightTextPoint[0] - 10, eightTextPoint[1] - 5) texter(eightTextPoint, "8", font=fnt, fill=lightGray) nineTextPoint = findPointOnCircle(400,240,110,270) nineTextPoint = (nineTextPoint[0] - 15, nineTextPoint[1] - 10) texter(nineTextPoint, "9", font=fnt, fill=lightGray) tenTextPoint = findPointOnCircle(400,240,110,300) tenTextPoint = (tenTextPoint[0] - 15, tenTextPoint[1] - 15) texter(tenTextPoint, "10", font=fnt, fill=lightGray) elevenTextPoint = findPointOnCircle(400,240,110,330) elevenTextPoint = (elevenTextPoint[0] - 15, elevenTextPoint[1] - 15) texter(elevenTextPoint, "11", font=fnt, fill=lightGray) # Draw the equivalent of the lower-case "mpg" at the bottom of the dial. hondaTextPoint = findPointOnCircle(400,240,170,180) hondaTextPoint = (hondaTextPoint[0] - 45, hondaTextPoint[1]) texter(hondaTextPoint, "honda", font=fnt, fill=lightGray) # Draw the "low gear range" arc from 8 o'clock to noon, just inside the numbers. # Include the little "L" in the circle, and the pips on the ends of the arc. arcer([(400-80,240-80),(400+80,240+80)], 150, 270, fill=lightGray) lowPipInside = findPointOnCircle(400,240,80,240) lowPipOutside = findPointOnCircle(400,240,85,240) liner([lowPipInside, lowPipOutside], fill=lightGray,width=1) highPipInside = findPointOnCircle(400,240,80,0) highPipOutside = findPointOnCircle(400,240,85,0) liner([highPipInside, highPipOutside], fill=lightGray,width=1) # Put the "L" in the circle between 10 and 11 o'clock directly on the arc. # Arguably it should go between right under 10, but that looks weird and this # covers up an ugly part of the arc. lilCircleCenter = findPointOnCircle(400,240,80,320) circle([(lilCircleCenter[0]-10,lilCircleCenter[1]-10),(lilCircleCenter[0]+10,lilCircleCenter[1]+10)], outline=lightGray, fill=black) lilfnt = ImageFont.truetype("Eurostile-LT-Std-Demi_16310.ttf", 12) texter((lilCircleCenter[0]-3,lilCircleCenter[1]-3), "L", font=lilfnt, fill=lightGray) # im.save("that_70s_clock.png","PNG") # im.save("that_70s_clock.gif","GIF") im.save("that_70s_clock.jpg","JPEG")
Hey, I had to choose a different font name to run this on macOS. A couple different tries and the "honda" at the bottom is off center, and the numerals are also off to the left. What should I look at to fix it?Here's the first pass at the 70's-style clock background, and the Python source code to generate it. The code is a bit long and messy, but it's hand-tweaked to get everything aligned nicely. I'll probably at some point add in the equivalent to the yellow inner "km/h" marks as hours 13-24.
https://i.imgur.com/AaQoiZS.jpg
Code:import math from PIL import Image, ImageDraw, ImageFont def findPointOnCircle(cx, cy, radius, angle): x = cx + math.sin(math.radians(angle)) * radius y = cy - math.cos(math.radians(angle)) * radius x = int(round(x, 0)) y = int(round(y, 0)) return(x,y) im = Image.new("RGB",(800,480)) fnt = ImageFont.truetype("Eurostile-LT-Std-Demi_16310.ttf", 30) liner = ImageDraw.Draw(im).line circle = ImageDraw.Draw(im).ellipse texter = ImageDraw.Draw(im).text arcer = ImageDraw.Draw(im).arc zeros = (0,0) lowright = (800,480) center = (800/2,480/2) white = (255,255,255) black = (0,0,0) red = (255,0,0) green = (0,255,0) blue = (0,0,255) gray = (128,128,128) # This is probably the primary color used for the Civic's clock. It's the Java standard "light gray". lightGray = (0xD3,0xD3,0xD3) # Lines and circles for debugging the image. # liner([zeros, lowright], fill=white,width=1) # liner([(0,480),(800,0)], fill=white,width=1) # liner([(0,240),(800,240)], fill=white,width=1) # liner([(400,0),(400,480)], fill=white,width=1) # circle([(400-10,240-10),(400+10,240+10)], outline=gray) # for i in range(10,240,10): # circle([(400-i,240-i),(400+i,240+i)], outline=gray) for i in range(0,12): pipInside = findPointOnCircle(400,240,130,i*30) # pipOutside = findPointOnCircle(400,240,150,i*30) # liner([pipInside, pipOutside], fill=green,width=8) # pipOutside = findPointOnCircle(400,240,149,i*30) # liner([pipInside, pipOutside], fill=blue,width=8) # pipOutside = findPointOnCircle(400,240,148,i*30) # liner([pipInside, pipOutside], fill=red,width=8) pipOutside = findPointOnCircle(400,240,148,i*30) liner([pipInside, pipOutside], fill=lightGray,width=8) for i in range(0,12): pipInside = findPointOnCircle(400,240,130,i*30 + 15) pipOutside = findPointOnCircle(400,240,148,i*30 + 15) liner([pipInside, pipOutside], fill=lightGray,width=5) noonTextPoint = findPointOnCircle(400,240,110,0) noonTextPoint = (noonTextPoint[0] - 20, noonTextPoint[1] - 15) texter(noonTextPoint, "12", font=fnt, fill=lightGray) oneTextPoint = findPointOnCircle(400,240,110,30) oneTextPoint = (oneTextPoint[0] - 10, oneTextPoint[1] - 15) texter(oneTextPoint, "1", font=fnt, fill=lightGray) twoTextPoint = findPointOnCircle(400,240,110,60) twoTextPoint = (twoTextPoint[0] - 7, twoTextPoint[1] - 15) texter(twoTextPoint, "2", font=fnt, fill=lightGray) threeTextPoint = findPointOnCircle(400,240,110,90) threeTextPoint = (threeTextPoint[0] - 5, threeTextPoint[1] - 10) texter(threeTextPoint, "3", font=fnt, fill=lightGray) fourTextPoint = findPointOnCircle(400,240,110,120) fourTextPoint = (fourTextPoint[0] - 10, fourTextPoint[1] - 5) texter(fourTextPoint, "4", font=fnt, fill=lightGray) fiveTextPoint = findPointOnCircle(400,240,110,150) fiveTextPoint = (fiveTextPoint[0] - 10, fiveTextPoint[1] - 10) texter(fiveTextPoint, "5", font=fnt, fill=lightGray) sixTextPoint = findPointOnCircle(400,240,110,180) sixTextPoint = (sixTextPoint[0] - 10, sixTextPoint[1] - 10) texter(sixTextPoint, "6", font=fnt, fill=lightGray) sevenTextPoint = findPointOnCircle(400,240,110,210) sevenTextPoint = (sevenTextPoint[0] - 10, sevenTextPoint[1] - 10) texter(sevenTextPoint, "7", font=fnt, fill=lightGray) eightTextPoint = findPointOnCircle(400,240,110,240) eightTextPoint = (eightTextPoint[0] - 10, eightTextPoint[1] - 5) texter(eightTextPoint, "8", font=fnt, fill=lightGray) nineTextPoint = findPointOnCircle(400,240,110,270) nineTextPoint = (nineTextPoint[0] - 15, nineTextPoint[1] - 10) texter(nineTextPoint, "9", font=fnt, fill=lightGray) tenTextPoint = findPointOnCircle(400,240,110,300) tenTextPoint = (tenTextPoint[0] - 15, tenTextPoint[1] - 15) texter(tenTextPoint, "10", font=fnt, fill=lightGray) elevenTextPoint = findPointOnCircle(400,240,110,330) elevenTextPoint = (elevenTextPoint[0] - 15, elevenTextPoint[1] - 15) texter(elevenTextPoint, "11", font=fnt, fill=lightGray) # Draw the equivalent of the lower-case "mpg" at the bottom of the dial. hondaTextPoint = findPointOnCircle(400,240,170,180) hondaTextPoint = (hondaTextPoint[0] - 45, hondaTextPoint[1]) texter(hondaTextPoint, "honda", font=fnt, fill=lightGray) # Draw the "low gear range" arc from 8 o'clock to noon, just inside the numbers. # Include the little "L" in the circle, and the pips on the ends of the arc. arcer([(400-80,240-80),(400+80,240+80)], 150, 270, fill=lightGray) lowPipInside = findPointOnCircle(400,240,80,240) lowPipOutside = findPointOnCircle(400,240,85,240) liner([lowPipInside, lowPipOutside], fill=lightGray,width=1) highPipInside = findPointOnCircle(400,240,80,0) highPipOutside = findPointOnCircle(400,240,85,0) liner([highPipInside, highPipOutside], fill=lightGray,width=1) # Put the "L" in the circle between 10 and 11 o'clock directly on the arc. # Arguably it should go between right under 10, but that looks weird and this # covers up an ugly part of the arc. lilCircleCenter = findPointOnCircle(400,240,80,320) circle([(lilCircleCenter[0]-10,lilCircleCenter[1]-10),(lilCircleCenter[0]+10,lilCircleCenter[1]+10)], outline=lightGray, fill=black) lilfnt = ImageFont.truetype("Eurostile-LT-Std-Demi_16310.ttf", 12) texter((lilCircleCenter[0]-3,lilCircleCenter[1]-3), "L", font=lilfnt, fill=lightGray) # im.save("that_70s_clock.png","PNG") # im.save("that_70s_clock.gif","GIF") im.save("that_70s_clock.jpg","JPEG")
I think they store the Clock Wallpaper images in a totally different directory. Shoot, I think the teams that wrote the background wallpaper selector app and the Clock app didn't interact with each other at all, which is why they're so different.(Attempt 1) I initially tried changing the wallpaper by going through the settings/clock-wallpaper, and in the wallpaper setting there was a way to add 5 images (max) via USB thumb drive. Here you could preview what they'd look like or delete them from the head unit. However, I was never able to get these to successfully show up as wallpaper.
(Attempt 2) I then read some of the posts here and was able to change the wallpaper setting from the blank screen in the main menu via upload of an individual jpg via USB from a thumb drive. When the thumb drive was plugged in the display showed "Gallery", "Wallpapers", and I think a "Live Wallpapers" folders, as well as images found on the thumb drive. It allowed me to crop to specs (which I couldn't do in attempt #1).
What is puzzling is why did none of the 5 images I saved to the head unit in attempt #1 show up in any of the folders during attempt #2? Id like to be able to somewhat easily change wallpapers w/o having to constantly have a thumb drive in hand, but is that possible?. To change the wallpaper does one always go thru a USB connected device and have only one image at a time in storage? If so, what's the point of being able to load the 5 images as described in step #1? Thanks...