wrapping to multiple lines at word boundaries

[LenShustek]

A great library! But I was disappointed that drawSTR doesn't wrap to multiple lines, so I wrote this function to print a string on multiple lines, breaking it into words at a space where possible. Maybe it can be useful to other folks.
To start at the top of the screen, call it like this: printwords("blah blah blah...", 0, u8g2.getMaxCharHeight());

// display a string on multiple lines, keeping words intact where possible
void printwords(const char *msg, int xloc, int yloc) {
   int dspwidth = u8g2.getDisplayWidth(); // display width in pixels
   int strwidth = 0;  // string width in pixels
   char glyph[2]; glyph[1] = 0;
   for (const char *ptr = msg, *lastblank = NULL; *ptr; ++ptr) {
      while (xloc == 0 && *msg == ' ')
         if (ptr == msg++) ++ptr; // skip blanks at the left edge
      glyph[0] = *ptr;
      strwidth += u8g2.getStrWidth(glyph); // accumulate the pixel width
      if (*ptr == ' ')  lastblank = ptr; // remember where the last blank was
      else ++strwidth; // non-blanks will be separated by one additional pixel
      if (xloc + strwidth > dspwidth) { // if we ran past the right edge of the display
         int starting_xloc = xloc;
         while (msg < (lastblank ? lastblank : ptr)) { // print to the last blank, or a full line
            glyph[0] = *msg++;
            xloc += u8g2.drawStr(xloc, yloc, glyph); }
         strwidth -= xloc - starting_xloc; // account for what we printed
         yloc += u8g2.getMaxCharHeight(); // advance to the next line
         xloc = 0; lastblank = NULL; } }
   while (*msg) { // print any characters left over
      glyph[0] = *msg++;
      xloc += u8g2.drawStr(xloc, yloc, glyph); } }

[warriorCavt]

this looks kinda messy, cleaner:

// display a string on multiple lines, keeping words intact where possible
void printwords(const char *msg, int xloc, int yloc) {

   int dspwidth = u8g2.getDisplayWidth();                        // display width in pixels
   int strwidth = 0;                         // string width in pixels
   char glyph[2]; glyph[1] = 0;

   for (const char *ptr = msg, *lastblank = NULL; *ptr; ++ptr) {
      while (xloc == 0 && *msg == ' ')
         if (ptr == msg++) ++ptr;                        // skip blanks at the left edge

      glyph[0] = *ptr;
      strwidth += u8g2.getStrWidth(glyph);                        // accumulate the pixel width
      if (*ptr == ' ')  lastblank = ptr;                        // remember where the last blank was
      else ++strwidth;                        // non-blanks will be separated by one additional pixel

      if (xloc + strwidth > dspwidth) {                        // if we ran past the right edge of the display
         int starting_xloc = xloc;
         while (msg < (lastblank ? lastblank : ptr)) {                        // print to the last blank, or a full line
            glyph[0] = *msg++;
            xloc += u8g2.drawStr(xloc, yloc, glyph); 
         }

         strwidth -= xloc - starting_xloc;                        // account for what we printed
         yloc += u8g2.getMaxCharHeight();                        // advance to the next line
         xloc = 0; lastblank = NULL;
      }
   }
   while (*msg) {                        // print any characters left over
      glyph[0] = *msg++;
      xloc += u8g2.drawStr(xloc, yloc, glyph);
   }
}

by the way thanks for the code

[LenShustek]

You're welcome.

Your version is exactly the same code, character-for-character, just formatted differently. Whether mine is "messy" and yours is "cleaner" is a matter of taste.

I prefer to let indentation do the work of showing block structure, like Python does, and I treat the brackets as unfortunately necessary "syntactic sugar". I also use very few blank lines so that I can see as much code as possible on one screen.

Both are valid approaches. As they said in Roman times, de gustibus non est disputandum.

[warriorCavt]

but this style of indentation is hard to edit I guess ;)

[LenShustek]

Not at all -- no harder than for the more "airy" styles.

I use the Astyle code formatter with the "--style=python" option to do it automatically. Astyle is available as a standalone program for many operating systems, and as a plug-in for Visual Studio, Visual Code, Arduino IDE, PlatformIO, etc.
https://astyle.sourceforge.net/
https://github.com/arduino/astyle
https://marketplace.visualstudio.com/items?itemName=chiehyu.vscode-astyle

[LenShustek]

By the way, here is a slightly extended version that allows an embedded \n character to force a new line.

// display a string on multiple text lines, keeping words intact where possible,
// and accepting \n to force a new line
void printwords(const char *msg, int xloc, int yloc /*bottom*/ ) {
   int dspwidth = u8g2.getDisplayWidth(); // display width in pixels
   int strwidth = 0;  // string width in pixels
   char glyph[2]; glyph[1] = 0;
   for (const char *ptr = msg, *lastblank = NULL; *ptr; ++ptr) {
      while (xloc == 0 && (*msg == ' ' || *msg == '\n'))
         if (ptr == msg++) ++ptr; // skip blanks and newlines at the left edge
      glyph[0] = *ptr;
      strwidth += u8g2.getStrWidth(glyph); // accumulate the pixel width
      if (*ptr == ' ')  lastblank = ptr; // remember where the last blank was
      else ++strwidth; // non-blanks will be separated by one additional pixel
      if (*ptr == '\n' ||   // if we found a newline character,
            xloc + strwidth > dspwidth) { // or if we ran past the right edge of the display
         int starting_xloc = xloc;
         // print to just before the last blank, or to just before where we got to
         while (msg < (lastblank ? lastblank : ptr)) {
            glyph[0] = *msg++;
            xloc += u8g2.drawStr(xloc, yloc, glyph); }
         strwidth -= xloc - starting_xloc; // account for what we printed
         yloc += u8g2.getMaxCharHeight(); // advance to the next line
         xloc = 0; lastblank = NULL; } }
   while (*msg) { // print any characters left over
      glyph[0] = *msg++;
      xloc += u8g2.drawStr(xloc, yloc, glyph); } }

[doug93]

what us xloc and yloc in that function?

[LenShustek]

The screen location, in x and y coordinates, of the lower left corner of the first character you want drawn.

[olikraus]

Very nice. I like all the contributions :-)

[mgagic]

thanks for sharing, everyone!
One question - this won't allow for scrolling text if it's larger than the screen or am I mistaken?
Does anyone have an example (C) of scrolling through a text block - not just a list?

[olikraus]

There is an example for scrolling itself without the wrapping: https://github.com/olikraus/u8g2/blob/master/sys/arduino/u8g2_page_buffer/Shennong/Shennong.ino

[mgagic]

Thank you, I will check it out!

[LenShustek]

That's correct, mgagic -- my code doesn't scroll if the text overflows the bottom of the screen.

That would require a design for the user interface: Does it scroll automatically to the end of the text,, and at what speed? How would the user get back to the top? Should text movement be controlled with events representing external key or button presses?

[mgagic]

yes, I wasn't clear enough - I saw some examples for automatic scrolling, but I'm looking for something that can be controlled with a press of a button to move the text up/down
Thanks anyway :)

[olikraus]

hmmm... could be a nice idea for mui (https://github.com/olikraus/u8g2/wiki/muimanual)

[mgagic]

That would be great, it seems like quite a common "requirement".
I just started getting familiar with your library, but maybe I can also contribute something in the future

[mgagic]

Just adding to the pile, this is what I ended up with for wrapping the text around.
Argument max_chr_per_line can be used to limit the print inside a "box" by not using the whole width of the screen and the bottom pixel of the last printed line is returned so it can be easily used for drawing something below the text.

edit: changed it to correctly handle strings that include multi-byte utf8 characters

uint32_t draw_string_multi_line(const char *str, uint8_t max_chr_per_line, int32_t x, int32_t y)
{
	uint32_t string_length_bytes = strlen(str);
	char partial_string[SCREEN_WIDTH_MAX_CHRS + 1] = {'\0'};

	uint8_t line_start = 0;
	uint8_t line_end = 0;
	uint8_t max_chr_h = u8g2_GetMaxCharHeight(&u8g2);

	while (line_start < string_length_bytes) {
		memset(partial_string, 0, max_chr_per_line + 1);
		line_end = line_start + max_chr_per_line - 1;

		uint8_t i;
		uint8_t last_space_idx = line_start; /* used to keep track of the last space */
                /* for strings with multi-byte utf8 characters, these two values will be different */
		uint8_t partial_str_len = 0;
                uint8_t partial_str_len_bytes = 0; 

		/**
		 * Parse the string until a new line is found or we process the max number of characters
		 * that can fit in a single line. Save the index of the last space/new line in order not to
		 * break the word in the middle in case it cannot fit in the line completely.
		 */
		for (i = line_start; (partial_str_len <= max_chr_per_line) && (str[i] != '\0'); i++) {
			if (str[i] == '\n') {
				last_space_idx = i;
				break;
			} else if (str[i] == ' ') {
				last_space_idx = i;
				partial_str_len++;
			} else {
				if ((str[i] & 0xc0) != 0x80) {
					/**
					 * Count only the first byte of each glyph for the length in characters.
					 * UTF8 glyphs can be multi-byte and continuation bytes will have
					 * 0x10xxxxxx (0x80) as leftmost bits
					 */
					partial_str_len++;
				}
				partial_str_len_bytes++;
			}
		}

		/**
		 * If new line was found, or a word would be partially cut off, force the last known
		 * space/new line as the end of the first line to be drawn;
		 * otherwise, take the calculated length of the string that can fit the single line and
		 * discard the beginning of the word that cannot fully fit.
		 */
		if ((str[i] == '\n') || (partial_str_len > max_chr_per_line)) {
			line_end = last_space_idx;
		} else {
			line_end = partial_str_len + line_start;
			while (line_end < (string_length - 1) && !isspace((unsigned char)str[line_end]) &&
				(line_end > line_start)) {
				line_end--;
			}
		}

		/**
		 * If a word is longer than the max num of characters that can be shown,
		 * we can't rely on spaces and new lines so we split the word at the line limit
		 */
		if (line_end == line_start) {
			line_end = line_start + max_chr_per_line;
		} else if (line_end == (string_length - 1) &&
				!isspace((unsigned char)str[line_end])) {
			line_end = line_start + max_chr_per_line - 1;
		}

		strncpy(partial_string, &str[line_start], line_end - line_start);
                u8g2_DrawUTF8(&u8g2, x, y, partial_string);

		/* Prepare the coordinates and indices for the next line */
		y += max_chr_h + LINE_SPACING_MULTILINE_TEXT_PX;

		line_start = line_end;
		while (line_start < string_length_bytes && isspace((unsigned char)str[line_start])) {
			line_start++;
		}
	}

	/* Remove the spacing that was added to the last line */
	return y - max_chr_h - LINE_SPACING_MULTILINE_TEXT_PX;
}

[austinhutchen]

Very helpful. thank you!