fjvallarino/monomer

Multiple text fonts and styles within same label

Opened this issue · 5 comments

I want to make a label (or text area) at the bottom of my app that says "This app is created using Monomer. Visit https://github.com/fjvallarino/monomer for more details." How do I underline and italicize just the link part of the text?

I think you could do something like that:

hstack
    [ label "This app is created using Monomer. Visit "
    , externalLink "https://github.com/fjvallarino/monomer" "https://github.com/fjvallarino/monomer"
    , label " for more details."
    ]

Hi! Thanks for suggesting externalLink. I was going to add a dedicated OpenLink Text constructor to my AppEvent data type, but externalLink is definitely nicer to work with. There’s still an issue though.

I tried using an hstack like you suggested, and it worked well in a wide window.
wide_ui

However, when I narrowed the window, the link got clipped as expected.
narrow_ui

How do I achieve something like this?
narrow_ui_intended

(Also, side question, how do you limit the number of visible rows in a selectList container?)

There is label_ "Text" [multiline] which would wrap the text. However we have here three widgets in hstack, so I think it's not possible to configure wrapping in one line.
Probably build different versions for different sizes of the window like that:

if wenv ^. L.windowSize . L.w > 1000 then hstack [] else vstack []

And also you need to supply resizeEvent to startApp config, where you would return [Request RenderOnce], otherwise text will wrap only when app model changes.

As for your question about selectList, I think you need `styleBasic` [sizeReqH $ fixedSize 100]

Thanks for suggesting adding an appResizeEvent to the list of AppConfigs. I must be doing something wrong, though, because after I made different versions of the widget based on window size, and added

appResizeEvent (const AppRender)

to my AppConfig list and

handleEvent wenv ui model AppRender = [Request RenderOnce]

to my event handler, the widget never changed upon resizing the window.

I had to include window size in my app model, which worked but was less than ideal.

I might open a new issue, though, because what I hope to do is to have the widget adapt to its allocated widget size and not to the size of the whole window.

Hi @izuzu-izuzu!

Sorry for the delay. At the time, there is no support for rich labels, although it's something I plan to pursue in the next few months.

The solution you provided using hstacks will work as long as each label does not need to wrap to a different line. There is support for multi-line labels, but each of its lines will be in the same viewport (so a label that starts at x = 500 will not be able to have its second line at x = 200).