New UI for e-Ink display

Hello to all Meshtastic lovers.
I have noticed that some of you have bought the T-Echo with e-Ink display.
In the forums I have read that you have Meshtastic display problems, and I have made a commitment to design a new and more beautiful UI in comparison with the old Ui of small oled displays.
In the past I had already tried to design a UI for small oleds but I had little space and not much could be done.
The new 200x200 e-Ink displays have a bit more space which I believe could be done better.
I made some little progress! I leave an incomplete screen of the new UI for you to appreciate :grin:

e-Ink Meshtastic Designe By TitanTronics

12 Likes

OMG that is so cool. If someone could translate that into the cpp code someday that would be great. I’m happy to advise/help but in short:

  • Edit Screen.cpp/Screen.h to make two new subclasses of the Screen class. One version for eink one version for oled (most of the drawing code you could leave in the base Screen class - just make a new primary layout function for the eink version.
  • Optionally (but preferably) move those subclasses into ScreenSmall.cpp/.h (for the oleds and other small displays) and ScreenLarge.cpp/.h for the eink (and eventually other devices)
2 Likes

Thanks @geeksville for appreciating the new UI, it helps me a lot to do even better.
I’ll do the other menu steps first and then do the animation, then translate the individual images of each animation for use in the Meshtastic code
“I’ll do the request on github”

4 Likes

I like that a bunch TitanTronics - do you mind if I also take a stab at it using that image as a start?

2 Likes

Of course, I drew it for that :relieved:
You can use the Initial Layout of the UI that I have already drawn.
““But no one is allowed to use the UI for other different projects that are not part of Meshtastic :firecracker::boom:””
Later I will give you a guideline and individual layout images to use to create the code around them, also coming soon the following screens where you can read the messages according to the radio that sent them.
However, consider that the UI has been designed as squares attached to each other to be animated with the functions according to the icons that contain inside these squares.
I want to split blocks of code to match with Meshtastic core as a top layer and various features to make it easy to add more features if you have a larger display with other code blocks according to the square that contains the icons.

“If you like the idea and believe you can follow a certain line with the Ui concept conceived by me, we can start collaborating in the project to make it possible for the benefit of all Meshtastic lovers”

*However everything will be donated to Meshtastic on GitHub both the icons and the animations and the complete UI as soon as possible, there will also be a guideline on how to make the UI work. Everyone is free to use it for the Meshtastic project. :grin:

1 Like

Copy that - here is my suggestion and maybe that will be enough as time just crunched again.

I recommend putting all device status stuff up top in a block that has a border. Then put incoming messages and health of the mesh stuff down bottom in 3 vertical touch panels.

I would center the location/signal/sats thing in the middle top, then the TX power below it center, then Power/Sleep indicators on the top right.

Maybe a “last message” on the left, “nodes” list center bottom, “furthest direction” stuff on the right where it is.

Also, I have heard screen refresh is VERY slow on the e-paper display. This is secondhand information though.

1 Like