New line display in TextView error on 0.25

Bug Reports
1

Seems there is an issue with trying to set a multiline value on a TextView, in 0.25.

file
QWwd8XA7HtHl-image-1472726357369.png487×801

2

Hi, could you provide a minimal test case we can use to reproduce the issue?

3

Yo, Jake! How about this one :slight_smile:

<App>
	<ClientPanel>
		<TextView>
			I don't like
multiple lines
		</TextView>
	</ClientPanel>
</App>
4

I don’t think this repro case shows the actual problem. Since UX is an XML variant, whitespace characters like newlines will be ignored in UX. This isn’t really something we can avoid.

I’m guessing the text you’re having a problem with in your app comes from JS? Could you try a simple case where you display some multiline text from JS and see if the problem still occurs?

5

You need to set TextWrapping="Wrap" for the text to actually wrap :slight_smile:

6

Indeed, that is my use case. I have a text area component I am using, which receives the value via an object property, in order to establish 2 way binding.
Let me paste the code here;
You use this like <Kps.TextArea Value="{string_observable}" /> and should get the value back in that var.
I have wrapping enabled but it still happens.

<Panel Padding="4" ux:Class="Kps.TextArea" Height="57" FontSize="14" ClipToBounds="true">

    <object ux:Property="Value" />
    <string ux:Property="PlaceholderText" />
    <float ux:Property="FontSize" />

    <JavaScript>
    var value = this.Value.map(function(v) { return v; }).inner(),
        me = this;

    var change = value.map(function(v) {
        if (me.Value.value && me.Value.value.value != v) {
            me.Value.value.value = v;
        }
    });
    
    module.exports = {
        value: value,
        _change: change
    };
    </JavaScript>

    <Rectangle Layer="Background" CornerRadius="4" Color="LightBgColor">
        <Stroke Color="BorderColor" Width="1" />
    </Rectangle>

    <TextView Font="LatoRegular" 
              TextColor="TextColor" 
              FontSize="{Property this.FontSize}" 
              TextWrapping="Wrap" 
              CaretColor="LinkColor" 
              Height="{Property this.Height}"
              PlaceholderText="{Property this.PlaceholderText}"
              PlaceholderColor="DimmedTextColor" 
              Value="{value}" />
</Panel>
7

It displays properly until it refreshes the value from the observable. Also, after that, command + a (select all) stops working on the control.

8

I can confirm that it doesn’t display properly, but cmd+a is working fine on my end. In either case, I’ll make a ticket on this internally!