Display diacritics (Dotted Circle) on the touch keyboard

hello, I am still working on my QWERTY keyboard from Chad and we installed it on the android but, one correctly displays the diacritics(Dotted Circle) and the other displays another symbol like box but i cannot show screenshots and I am confused. your help will be welcome thank you!

Here are the screen shots:

Hello @Roger_Nadoumngar,

This happened because the current font doesn’t support it. Can you make sure that you added the required font into .kps file (Files tab) and also selected it in keyboard font (Keyboards tab)?


This looks like a font issue. It can be challenging to get dotted circles working consistently across devices. With Keyman Developer 17, we have a pathway for improving this situation, but it is a little technical: &displayMap

We would be happy to help you navigate the technicalities of this feature, but please bear with us. I am going on leave tomorrow and the rest of the keyboard support team are still coming up to speed with usage of the feature, so it may take a little bit to get there.

@Lorna and @Martin_Hosken may be the best placed to support you in using &displayMap.

I don’t really see how &displayMap is going to help us. As @Marc said, this looks like a font issue. But it doesn’t seem like re-mapping the characters to other code points (which seems to be what &displayMap is doing) is going to help us. We just need the code points already there to be displayed properly, which seems to be related to getting an appropriate font into the Keyman package and using it to display the keycaps on the visual touch keyboard.

I think we’ll start by trying to follow the advice in the discussion referred to by Nyny above.

1 Like

&displayMap is intended to work with a custom font that has each character combination needed for the keyboard display encoded as a single glyph (in Unicode’s private use area). This way the display is independent of the operating system or rendering software.

If you can find a font that displays the character combinations you need reliably, that is a good solution. There are cases, however, where a sequence that works on one operating system fails on another. For those cases, the &displayMap and a custom font is the best solution.

That sounds like a lot of work… :slight_smile: We’re actually making some progress by putting the Africa subset version of Andika into the font - that seems to help with the touch keyboard display on Android.

But now we are having problems with font choice in the HTML help file that shows up on Android. Roger posted on this, but in a different thread: Dotted Circle with Combining Diacritics on Keycap - #22 by Roger_Nadoumngar. I think he meant to post it here, so I’ll try to quote it:

So to flesh out what Roger said, with the AndikaAfr font added into the package, and the configuration done as mentioned in the other thread, we are now getting dotted circles for our diacritics on the keyboard layout.

But when we install the keyboard (on Android), it pops up the Help HTML page as part of the installation process, and THAT is the screen shot that Roger gave above, with Xbox’es instead of dotted circles. (The original Xbox?!) It should be noted that when the same keyboard is installed on Windows, when the HTML Help pops up after installation, it shows up very nicely with Charis SIL font and dotted circles supporting the diacritics.

Roger also gave you the font definitions for the CSS on our Help web page, which clearly shows that all of the fonts that were chosen were serif, but the screen shot shows very clearly that the font that is being used is sans serif.

So why, in the display of our HTML Help file on Android, is our font-family definition being ignored? There are a few other formatting details that seem to be missing as well - some table formatting, some colors in headings, etc. When the Keyman HTML Help file is displayed on Android, does it use a restricted set of HTML commands - i.e. not a full HTML implementation?

One thing we can try is adding AndikaAfr (the font in the package) into the font-family list in the CSS. That may help with the display of the diacritics, but it won’t be great for the readability of the Help file.

Thanks for any insights you can give us…
Jeff & Roger

Keyman does not use a restricted set of HTML commands. It uses a normal webview (which is Chrome behind the scenes).

Could you share the project with us (zip via private message)? Otherwise we are really just guessing on the causes of the issues, which is not an effective way to address the problem!

thank you for your help here is the zip file
sil_tchad_qwerty.zip (280.4 KB)

You need to add Td.css into Package files.

Here’s the result:

Thank you for all your help. I see that it is almost ready for publication. I just have a few more checks to do. If I encounter any more problems, I will come back. This was a great experience for me and to help others.

1 Like