Combining text and graphics

I have an LED matrix that I use to show tweets from a few accounts. Nothing novel there! When it’s between tweets, the matrix displays a variety of weather-related information and the status of the US House of Representatives and Senate. I use a some Pimoroni hats to grab the indoor weather data, including the atmospheric pressure. The display is mostly text with a few lines separating the groups of information. Without the rpi-rgb-led-matrix library, I’d be stuck for sure!

Since it’s the change in pressure that’s usually more interesting than the current pressure, I’d like to also display a little chart showing the last 24 or 48 hours of pressure readings.

However, it seems to me that displaying things via the “graphics” command can only be text or lines, while displays that leverage matrix = RGBMatrix(options = options) and matrix.SetImage(image.convert(‘RGB’)) can only be images. In other words, I don’t see a simple way to display both images and text at the same time.

Help?

Thanks in advance…

1 Like

Your projects sounds very interesting. For my own (LEDarcade) I wanted a scrolling list of Patrons. I wrote several functions to generate text on the fly and display that like an old 80’s terminal, but this time I wanted it to be a bit fancier.

My strategy (based on an example by others) is to generate an image, write the text on the image, then scroll the image.

Because the image is larger than the screen itself (I am using 64x32 LED matrix), I crop the image then display that cropped version. Then I move my pointers down, and crop the original image again but one pixel lower. Then I display that.

I do that until the end of the image.

Examples:



def CreateCreditImage(names):
  Buffer          = 32
  GradientSection = 32
  text_y_position = 0
  text_padding    = 12
  image_width     = 64
  ColorB          = 52
  TextRGB         = (175,175,175)




  #Create blank image
  image_height    = (len(names) * text_padding) + (Buffer *2) + (GradientSection *2) + 13
  img = Image.new("RGB", (image_width, image_height), color=(0,0,ColorB))
  draw = ImageDraw.Draw(img)

 

  #Draw buffer
  for v in range (0,Buffer):
    draw.line((0,text_y_position,HatWidth,text_y_position),fill=(0,0,0))
    text_y_position += 1

  #draw gradient
  for v in range (0,GradientSection):
    NewColorB = round(ColorB / GradientSection * v)
    draw.line((0,text_y_position,HatWidth,text_y_position),fill=(0,0,NewColorB))
    text_y_position += 1


  #write header
  Text = "PATRONS"
  fnt = ImageFont.truetype("/usr/share/fonts/truetype/noto/NotoMono-Regular.ttf",12)
  header_width, header_height = draw.textsize(Text, font=fnt)
  draw.text(
    ( 
      (image_width - header_width) / 2,  text_y_position ),
      Text,
      font=fnt,
      fill=(250,250,250)
    )
  text_y_position += text_padding


  #write patron names
  for name in names:
     text_width, text_height = draw.textsize(name, font=fnt)
     fnt = ImageFont.truetype("/usr/share/fonts/truetype/noto/NotoMono-Regular.ttf",10)
     draw.text(
       ( 
         (image_width - text_width) / 2,  text_y_position ),
         name,
         font=fnt,
         fill=TextRGB

       )
     text_y_position += text_padding
  


  #draw gradient
  for v in range (GradientSection,0,-1):
    NewColorB = round(ColorB / GradientSection * v)
    draw.line((0,text_y_position,HatWidth,text_y_position),fill=(0,0,NewColorB))
    text_y_position += 1


  #Draw buffer
  for v in range (0,Buffer):
    draw.line((0,text_y_position,HatWidth,text_y_position),fill=(0,0,0))
    text_y_position += 1

  

  img.save('credits.png')       



def ScrollCreditImage(CreditImage,ScrollSleep):
  image = Image.open(CreditImage)
  image = image.convert('RGB')
  width,height = image.size
  print("ScrollCreditImage: CreditImage")
  print("Image width height:", width,height)

  for x in range (0,height - HatHeight):
    #print("Cropping image x:", x)
    ScreenCrop = image.crop((0,x,HatWidth,x + HatHeight))
    TheMatrix.SetImage(ScreenCrop,0,0)
    time.sleep(ScrollSleep)





def AdjustBrightnessRGB(rgb,step):
  r,g,b = rgb
    
  r = r + step
  if r < 0:
    r = 0
  elif r > 255:
    r = 255
  g = g + step
  if g < 0:
    g = 0
  elif g > 255:
    g = 255
  
  b = b + step
  if b < 0:
    b = 0
  elif b > 255:
    b = 255

  return r,g,b

These functions are part of the LEDarcade library:

I hope this helps. Reach out if you have any questions.

Another way is to use my arduino layer and adafruit::GFX that can do text or images into the framebuffer that my library then displays on the matrix.
Yes, this means you do write arduino code, but it gets compiled with gcc on the rPi and runs natively.