How to insert non-printing chars (&nbsp; <wbr>)?

advanced-prototyping

#1

The use of the non-breaking space char in web is wide spread and very useful.
For example, names like “Red Cross” should not wrap in texts but stay in one line.

In Axure I have not been able to insert these into text. What I have tried:

  • Keyboard combination keys like [Ctrl] + [Space], [AltGr] + [Space], [Alt] + [Shift] + [Space] or [Alt] + [0] + [1] + [6] + [0] do nothing or convert to basic space chars.
  • Printable characters can often be copied from programs like MS-Word (e.g. Ø, ®, etc.). Even a tab character works. This method unfortunately does not work for the non-breaking space or word-break.
  • Even in “set Text” action i cannot replace a char for ‘\xa0’ (the hex notation of a non-breaking space).

Do I miss anything or is it not possible to insert non-breaking spaces?

The same goes for word break chars. And there are other non-printing chars (e.g. narrow non-breaking space) that would be useful but the ones mentioned here are a good starting point.

See:


#2

Hi LUX57,

Hmm, the mentioned spacing characters (e.g. &nbsp and ) should be recognized in a Set Text action for dynamically set text. I included a couple tests in this RP using the OnLoad event:

Spacing.rp (64.3 KB)

It sounds like there’s a still an issue in your project file, though. Would you mind attaching a sample file for our team to review? Thanks!


#3

Hi Alex,
Thanks for your reply and spacing.rp!
The setText works fine indeed.

It would be convenient to be able to add it while editing text and not having to use scripting.
I could not find a way to do this( is there a way to do this??).
So tried to make a general function that would allow me to type special chars instead of the actual chars.
[[this.text.replace('◌','&nbsp;').replace('⁞','<wbr>')]]
Than it fails for me.

So then i typed my text like this:
Red#&nbsp;#Cross is a non#&shy;#profit organisation.
(this looks terrible, but its is a try…)
With replacement code:
[[this.text.replace('#&','&').replace(';#',';')]]
Also fails (although initially it seemed to work, i don’t know why).

Arrgghh…


#4

Hi LUX57,

Hmm, you should be able to insert non-breaking spaces while editing text. Would you be able to post an .rp file of where you’re running into this issue? The .replace( , ) method with an OnLoad seems to be working on my end as well. Also, please let me know the version of Axure RP you’re running (e.g. 8.1.0.3366), as well as the browser you’re using to view your prototypes. Ty!


#5

Hi all,

Examples in Spacing.rp don’t work with my Axure 8.1.0.3381:

It seems you (LUX57) had an issue when trying to copy non-breaking spaces from programs like MS-Word.

Actually, I tried to copy from MS-Word and from OpenOffice Writer too and it worked for me.

So, in case it can help someone, here is how I did it (on PC-Windows 10):