Setting a custom default font

[0pcom]

I'm still a bit mystified as to how exactly a custom default font can be set when creating a cogentcore application.

Suppose that I have the .ttf of the font, or whatever file defines the font.

Probably I should embed it, right? Then, how can i make the cogentcore application actually use that as the default font?

The documentation on this is a bit lacking.

This is a great font, by the way - one i hope to use with a cogentcore application:

https://madmalik.github.io/mononoki/

[kkoreilly]

Yes, the documentation is certainly incomplete in this area right now, but we will definitely improve it going forward. It is possible to do this now, although the API for this may change after issues like #568, which we are planning to work on in the next few weeks. Regardless, here is the code I got working for this now (to make all widgets in the app use the embedded font by default):

package main

import (
	"embed"

	"cogentcore.org/core/base/mergefs"
	"cogentcore.org/core/core"
	"cogentcore.org/core/paint"
	"cogentcore.org/core/styles"
)

//go:embed myFonts/*.ttf
var myFonts embed.FS

func main() {
	core.TheApp.SetSceneInit(func(sc *core.Scene) {
		sc.SetWidgetInit(func(w core.Widget) {
			w.AsWidget().Styler(func(s *styles.Style) {
				s.Font.Family = "My Font"
			})
		})
	})
	b := core.NewBody()
	paint.FontLibrary.FontsFS = mergefs.Merge(paint.FontLibrary.FontsFS, myFonts)
	paint.FontLibrary.UpdateFontsAvail()
	core.NewText(b).SetText("Hello, world!")
	b.RunMainWindow()
}

Please let me know if that works for you and if you have any questions. We will probably make that API easier in the future.

[0pcom]

Thanks very much ; Here is the test I've made of this

I downloaded the font from here https://github.com/madmalik/mononoki/releases/download/1.6/mononoki.zip and extracted it

package main

import (
	"embed"

	"cogentcore.org/core/base/mergefs"
	"cogentcore.org/core/core"
	"cogentcore.org/core/paint"
	"cogentcore.org/core/styles"
)

//go:embed mononoki/*.ttf
var mononoki embed.FS

//go:embed font-test.txt
var fontTest string

func main() {
	core.TheApp.SetSceneInit(func(sc *core.Scene) {
		sc.SetWidgetInit(func(w core.Widget) {
			w.AsWidget().Styler(func(s *styles.Style) {
				s.Font.Family = "mononoki"
			})
		})
	})
	b := core.NewBody()
	paint.FontLibrary.FontsFS = mergefs.Merge(paint.FontLibrary.FontsFS, mononoki)
	paint.FontLibrary.UpdateFontsAvail()
	core.NewText(b).SetText(fontTest)
	b.RunMainWindow()
}

Here I've made a test file to render:

&nbsp;┌─┐┌─┐┌─┐┌─┐┌┐┌┌┬┐&nbsp;&nbsp;┌─┐┌─┐┬─┐┌─┐&nbsp;&nbsp;┬┌─┐&nbsp;&nbsp;┌─┐┬&nbsp;┬┌─┐┌─┐┌─┐┌┬┐┌─┐<br>
│&nbsp;&nbsp;│&nbsp;││&nbsp;┬├┤&nbsp;│││&nbsp;│&nbsp;&nbsp;&nbsp;│&nbsp;&nbsp;│&nbsp;│├┬┘├┤&nbsp;&nbsp;&nbsp;│└─┐&nbsp;&nbsp;├─┤│││├┤&nbsp;└─┐│&nbsp;││││├┤<br>
└─┘└─┘└─┘└─┘┘└┘&nbsp;┴&nbsp;&nbsp;&nbsp;└─┘└─┘┴└─└─┘&nbsp;&nbsp;┴└─┘&nbsp;&nbsp;┴&nbsp;┴└┴┘└─┘└─┘└─┘┴&nbsp;┴└─┘<br>
Hello, world!
A Á Ă Ắ Ặ Ằ Ẳ Ẵ  Ấ Ậ Ầ Ẩ Ẫ Ä Ạ À Ả Ā Ą Å Ã Æ B C Ć Č Ç Ĉ D Ð Ď Đ E É Ě Ê Ế Ệ Ề Ể Ễ Ë Ė Ẹ È Ẻ Ē Ę Ẽ F G Ğ Ĝ H Ĥ I IJ Í Î Ï İ Ị Ì Ỉ Ī Į Ĩ J Ĵ K L Ĺ Ľ Ŀ Ł M N Ń Ň Ñ O Ó Ô Ố Ộ Ồ Ổ Ỗ Ö Ọ Ò Ỏ Ơ Ớ Ợ Ờ Ở Ỡ Ő Ō Ø Õ Œ P Þ Q R Ŕ Ř S Ś Š Ş Ŝ ẞ T Ŧ Ť Ţ U Ú Ŭ Û Ü Ụ Ù Ủ Ư Ứ Ự Ừ Ử Ữ Ű Ū Ų Ů Ũ V W Ẃ Ŵ Ẅ Ẁ X Y Ý Ŷ Ÿ Ỵ Ỳ Ỷ Ỹ Z Ź Ž Ż a á ă ắ ặ ằ ẳ ẵ â ấ ậ ầ ẩ ẫ ä ạ à ả ā ą å ã æ b c ć č ç ĉ d ð ď đ e é ě ê ế ệ ề ể ễ ë ė ẹ è ẻ ē ę ẽ f g ğ ĝ h ĥ i ı í î ï ị ì ỉ ij ī į ĩ j ȷ ĵ k l ĺ ƛ ľ ŀ ł m n ń ň ñ o ó ô ố ộ ồ ổ ỗ ö ọ ò ỏ ơ ớ ợ ờ ở ỡ ő ō ø õ œ p þ q r ŕ ř s ś š ş ŝ ß t ŧ ť ţ u ú ŭ û ü ụ ù ủ ư ứ ự ừ ử ữ ű ū ų ů ũ v w ẃ ŵ ẅ ẁ x y ý ŷ ÿ ỵ ỳ ỷ ỹ z ź ž ż ᵢ ˡ ⁿ ʳ ª º А Б В Г Ѓ Д Е Ё Ж З И Й К Ќ Л М Н О П Р С Т У Ф Х Ч Ц Ш Щ Ь Ы Ъ Ѕ Э І Ї Ј Ю Я Ӏ Ӣ Ӯ а б в г ѓ д е ё ж з и й к ќ л м н о п р с т у ф х ч ц ш щ ь ы ъ ѕ э і ј ю я һ ӣ ӯ Α Β Γ Δ Ε Ζ Η Θ Ι Κ Λ Μ Ν Ξ Ο Π Ρ Σ Τ Υ Φ Χ Ψ Ω Ά Έ Ή Ί Ό Ύ Ώ Ϊ Ϋ α β γ δ ε ζ η θ ι κ λ μ ν ξ ο π ρ ς σ τ υ φ χ ψ ω ί ϊ ΐ ύ ϋ ΰ ό ώ ά έ ή ℂ ℍ ℕ ℙ ℚ ℝ ℤ ᵇ ᶜ 0 1 2 3 4 5 6 7 8 9 ⅟ ½ ↉ ⅓ ⅔ ¼ ¾ ⅕ ⅖ ⅗ ⅘ ⅙ ⅚ ⅐ ⅛ ⅜ ⅝ ⅞ ⅑ ⅒ ₀ ₁ ₂ ₃ ₄ ₅ ₆ ₇ ₈ ₉ ⁰ ¹ ² ³ ⁴ ⁵ ⁶ ⁷ ⁸ ⁹ · ; ⟨ ⟩ . , : ; … ! ¡ ? ¿ · • * ‼ # ․ / \ ‥ - – — _ ₍ ₎ ( ) { } [ ] ⌈ ⌊ ⌉ ⌋ ⁽ ⁾ ‚ „ “ ” ‘ ’ ‛ « » ‹ › " ' ƒ ʹ ͵ ★ @ & ¶ § © ® ™ ° ′ ″ | ¦ ℓ † ‡ ¢ ¤ $ € £ ¥ ≐ ≃ ∙ ∕ ∸ ∈ ∎ ₌ ⁼ ≡ ∃ ≳ ≲ ₋ ⁻ ⊎ ≄ ∌ ∉ ≢ ⊄ ⊅ + − × ÷ = ≠ > < ≥ ≤ ± ≈ ~ ¬ ^ ∅ ∞ ∧ ∨ ∩ ∪ ∫ ∆ ∏ ∑ √ ∂ µ ∥ % ‰ ₊ ⁺ ∷ ≟ ⊢ ∘ ⊔ ⊂ ⊆ ∋ ⊃ ⊇ ⊤ ⊣ ∄ ∴ ⊈ ⊉ ⊊ ⊋ ⊕ ∀ ⊥ ⦂ ⊗ ↑ ↗ → ↘ ↓ ↙ ← ↖ ↔ ↕ ↞ ↠ ⇒ ⇐ ⇔ ▁ ▂ ▃ ▄ ▅ ▆ ▇ █ ▀ ▔ ▏ ▎ ▍ ▌ ▋ ▊ ▉ ▐ ▕ ▖ ▗ ▘ ▙ ▚ ▛ ▜ ▝ ▞ ▟ ░ ▒ ▓ ╦ ╗ ╔ ═ ╩ ╝ ╚ ║ ╬ ╣ ╠ ╥ ╖ ╓ ┰ ┒ ┧ ┎ ┟ ╁ ┯ ┑ ┩ ┍ ┡ ╇ ╤ ╕ ╒ ╍ ╏ ╻ ┳ ┓ ┏ ━ ╸ ╾ ┉ ┋ ╺ ┅ ┇ ╹ ┻ ┛ ╿ ┗ ┃ ╋ ┫ ┣ ╅ ┭ ┵ ┽ ┲ ┺ ╊ ╃ ╮ ╭ ╯ ╰ ╌ ╎ ╳ ╲ ╱ ╷ ┬ ┐ ┌ ╴ ╼ ┈ ┊ ╶ ┄ ┆ ╵ ╽ ┴ ┘ └ │ ┼ ┤ ├ ╆ ┮ ┶ ┾ ┱ ┹ ╉ ╄ ─ ╨ ╜ ╙ ╀ ┸ ┦ ┚ ┞ ┖ ╈ ┷ ┪ ┙ ┢ ┕ ╧ ╛ ╘ ╫ ╢ ╟ ╂ ┨ ┠ ┿ ┥ ┝ ╪ ╡ ╞ ♥ ΄ ΅ ̣ ¨ ˙ ´ ˝ ˆ ˇ ˘ ˚ ˜ ¯ ¸ ˛                    

It wasn't immediately apparent that the app is rendering the text as html.

One odd thing, there seems to be an extra space after <br> ; I had to add   to the very start of the string to get the alignment right on the subsequent lines of the ascii font.

after replacing the < > with < > here's the render again

Now, if I might be so bold as to ask how to eliminate the margin between the lines so that the box drawing characters appear connected, so it looks like this:

[kkoreilly]

Great!

To remove the margin between the lines, you can try adding s.Text.LineHeight.Em(1) in a styler on your text widget.

We will definitely improve the documentation on text formatting and the builtin HTML text style handling soon, in addition to increasing control over that. For now, you could try doing s.Text.WhiteSpace = styles.WhiteSpacePreWrap if you want to avoid needing all the   entities. I am not sure if there is a way to disable the HTML formatting yet, but we will add that soon if it is not already there.

Thanks for reporting that <br> spacing issue; we will work on fixing that soon.

[0pcom]

That worked great

and when I set s.Text.WhiteSpace = styles.WhiteSpacePreWrap i no longer needed to put <br> to break the line.
Also I didn't need to add any space at the beginning to align the box drawing characters after that change.

Its my sincere pleasure to test this framework and provide feedback.

Is there any plan for a built in renderer of markdown to html ; or would you recommend any specific libraries for that? I know there are plenty of options when it comes to this, but I'm curious to know what the developers recommend of prefer.

[kkoreilly]

Great! You can see on the HTML page that we support Markdown rendering, in addition to more advanced HTML rendering, through the htmlcore package. If that does not work for you, please let me know. Thank you again for all of your feedback and testing.