TextView wont wrap text in Local Preview

General
1

Hi, I was working with a Project and noticed that TextView wont wrap on Local Preview.

I spent around 2 hours figuring out why and noticed that it would wrap in Fuse Preview App (iOS)

Is this normal? Is there a fixaround for Local Preview?

<DockPanel Padding="10" Width="100%" BoxSizing="FillAspect" Aspect="1" Background="#">					
<pbg1 />

						 
<TextView MaxLength="85" TextAlignment="Center" Alignment="VerticalCenter" IsReadOnly="false" Opacity="0.8" CaretColor="White" 
Font="font8" FontSize="24" TextColor="White" TextWrapping="Wrap">
{contenido}
</TextView>
						
						
<Text Font="font8" FontSize="14" Alignment="BottomRight" TextColor="White" TextAlignment="Right" TextWrapping="Wrap">{Scuenta} 
</Text>
						 
</DockPanel>

`

2

Hey!

From your code, it is hard to tell where is the problem.

Can you provide complete minimal reproduction code, that we could copy-paste and try?

3

Hi, I get exactly the same issue with TextInput:

<App ux:Name="parentEditPage">
		<TextInput Width="200" Height="200" TextWrapping="Wrap" Background="#A1A1A1"/>
</App>

It doesn’t wrap on iOS Preview, but wrap on Fuse Simulator.

4

@Thomas Ribreau

TextInput are purposed for Single Line, quoted from Documentation:

"- Multi-line text editor.

  • TextView provides features for editing and viewing large amounts of text."

Which is why I dont understand why it isn’t wrapping when in Local Preview

5

You are right except that TextInput Inherits from TextInputControl that manages TextWrapping.

6

Arturs wrote:

Hey!

From your code, it is hard to tell where is the problem.

Can you provide complete minimal reproduction code, that we could copy-paste and try?

Not minimal, but complete.

  <App Background="#fff">
<JavaScript>
	var Observable = require("FuseJS/Observable");
    var opacity = Observable(false);
    var seccion = Observable("1");
    var Scuenta = Observable("");
    var storage = require("FuseJS/Storage");
    var contenido  = Observable("¡Dile al mundo lo que piensas!");
    var enLimite = Observable(false);
    var tvOpacity = Observable("0.6");
    var limiteColor = Observable("#fff");

    function isFocusedTV(){
    	if(contenido.value == "¡Dile al mundo lo que piensas!"){
			contenido.value = "";	
			tvOpacity.value = "1";
		}
    }

    function releaseFocusTV(){
    	enLimite.value = true; 
    }

    contenido.onValueChanged(module, function(x) {
			

			if(contenido.value != "¡Dile al mundo lo que piensas!"){
    		Scuenta.value = contenido.value.length + " / 85";
    		}else{
    		Scuenta.value = "0 / 85";	
    		}
    		
    		if(contenido.value.length == 85){
    			enLimite.value = true;
    			limiteColor.value = "#dddddd";
    		}else{
    			enLimite.value = false;
    			limiteColor.value = "#fff";
    		}

    		var val = contenido.value; 
		    var newval = val.replace(/\n{2,}/g, '\n');
		    
		    if(val != newval) {
		        contenido.value = newval;
		    }

		    var textArea = contenido.value;
    		var arrayOfLines = textArea.split("\n");
    		var enters = (textArea.match(/\n{1,}/g)||[]).length;
    		//console.log(enters);
    		for(var i = 0; i < arrayOfLines.length; i++){
        		if(arrayOfLines[i].length <= 7){
        			if(enters > 0){
        			textArea = textArea.replace(/\n$/, "")
        			contenido.value = textArea;
        			releaseFocusTV();
        			}
        		}
    		}

    });

    function changeOpacity() {
        opacity.value = true;
    }

    function set1(){
    	seccion.value = "1";
    }


    function set2(){
    	seccion.value = "2";
    }


    function set3(){
    	seccion.value = "3";
    }


    function set4(){
    	seccion.value = "4";
    }


    function set5(){
    	seccion.value = "5";
    }


    setTimeout(changeOpacity, 500);
    module.exports = { 
    	opacity: opacity,
    	seccion: seccion,
    	nav1: function() { router.goto("Page1"); },
    	nav2: function() { router.goto("Page2"); },
    	nav3: function() { router.goto("Page3"); },
    	Pnav1: function() { router.push("Page1"); },
    	Pnav2: function() { router.push("Page2"); },
    	Pnav3: function() { router.push("Page3"); },
    	set1: set1,
    	set2: set2, 
    	set3: set3, 
    	set4: set4, 
    	set5: set5,
    	contenido: contenido,
    	Scuenta: Scuenta,
    	enLimite: enLimite,
    	isFocusedTV: isFocusedTV,
    	tvOpacity: tvOpacity,
    	releaseFocusTV: releaseFocusTV,
    	limiteColor: limiteColor
    };
</JavaScript>
<Font File="Fonts/font1.ttf" ux:Global="font1" />
<Font File="Fonts/font2.ttf" ux:Global="font2" />
<Font File="Fonts/font3.ttf" ux:Global="font3" />
<Font File="Fonts/font4.ttf" ux:Global="font4" />
<Font File="Fonts/font5.ttf" ux:Global="font5" />
<Font File="Fonts/font6.ttf" ux:Global="font6" />
<Font File="Fonts/font7.ttf" ux:Global="font7" />
<Font File="Fonts/font8.ttf" ux:Global="font8" />

<iOS.StatusBarConfig Style="Light" Animation="Slide" IsVisible="True" />

<Router ux:Name="router" />
<Navigator ux:Name="PgControl" DefaultPath="Page1" Transition="Standard">
<JavaScript File="MainView.js" />
	<Page ux:Name="Page1" Background="#000">
		
		<Image ux:Name="bgMain2" Opacity="0.1" File="Assets/bg3.png" Layer="Background" StretchMode="UniformToFill">
			<Blur ux:Name="blur2" Radius="30" />
		</Image>

		<Image ux:Name="bgMain" Opacity="0" File="Assets/bg3.png" Layer="Background" StretchMode="UniformToFill">
			<Blur ux:Name="blur1" Radius="5" />
		</Image>
		
		<WhileString Value="{accessToken}" Equals="" CaseSensitive="false"> 
			<WhileFalse Value="{showWebView}">
				<iOS.StatusBarConfig Style="Light" Animation="Slide" IsVisible="True" />
				<DockPanel>
					<StatusBarBackground Dock="Top"/>
					<Rectangle Opacity="0" Alignment="TopCenter" ux:Name="logoRect" Margin="0,80,0,0" Width="75%">
						<Image File="Assets/logo10.png" />
					</Rectangle>

					<Rectangle Opacity="0" Alignment="TopCenter" ux:Name="animal" Margin="0,1,0,0" Width="50%">
						<Image File="Assets/fullzorro.png" /> 
					</Rectangle>
					
					<Rectangle Opacity="0" Padding="25" Alignment="VerticalCenter" ux:Name="sloganRect" Width="100%" LayoutRole="Standard">
						<Text Font="font2" FontSize="14" Margin="0,0,0,180" TextWrapping="Wrap" TextAlignment="Center" Alignment="BottomCenter" Color="White">
							Libre expresión, sin filtros. 
						</Text>
					</Rectangle>
					
					<Rectangle CornerRadius="6" Clicked="{login}" Color="#1264b3" Opacity="0" Padding="0" Margin="0,0,0,300" Alignment="BottomCenter" ux:Name="loginRect" Width="75%" Height="50" LayoutRole="Standard">
						<Text Font="font8" FontSize="13" TextWrapping="Wrap" TextAlignment="Center" Alignment="VerticalCenter" Color="White">
							INICIAR SESIÓN CON FACEBOOK 
						</Text>
						<WhilePressed>
							<Change Target="loginRect.Opacity" Value="1"/>
						</WhilePressed>
					</Rectangle>

					<Rectangle CornerRadius="6" Color="#fff" Opacity="0" Padding="0" Margin="50,0,0,250" Alignment="BottomLeft" ux:Name="divRect" Width="30%" Height="1" LayoutRole="Standard">
					</Rectangle>
	 
					<Rectangle CornerRadius="6" Color="#fff" Opacity="0" Padding="0" Margin="0,0,0,258" Alignment="BottomCenter" ux:Name="orRect" Width="25%" Height="0" LayoutRole="Standard">
						<Text Font="font8" FontSize="13" TextWrapping="Wrap" TextAlignment="Center" Alignment="VerticalCenter" Color="White">
							Ó 
						</Text>
					</Rectangle>

					<Rectangle CornerRadius="6" Color="#fff" Opacity="0" Padding="0" Margin="0,0,50,250" Alignment="BottomRight" ux:Name="div2Rect" Width="30%" Height="1" LayoutRole="Standard">
					</Rectangle>

					<Rectangle CornerRadius="6" Clicked="{logout}" Opacity="0" Padding="0" Margin="0,0,0,160" Alignment="BottomCenter" ux:Name="otroRect" Width="75%" Height="50" LayoutRole="Standard">
						<Stroke Width="2" Color="#fff"/>
						<Text Font="font8" FontSize="13" ux:Name="otroText" TextWrapping="Wrap" TextAlignment="Center" Alignment="VerticalCenter" Color="White">
							VISITA EL SITIO WEB
						</Text>
						<WhilePressed>
							<Change Target="otroRect.Color" Value="#fff" />
							<Change Target="otroText.Color" Value="#000" />
						</WhilePressed>
					</Rectangle>
					<Rectangle Opacity="0" Padding="0" Margin="0,0,0,60" Alignment="BottomCenter" ux:Name="politicaRect" Width="75%" LayoutRole="Standard">
						<Text Font="font8" FontSize="10" TextWrapping="Wrap" TextAlignment="Center" Alignment="VerticalCenter" Color="White">
							Al hacer uso de Scandal indicas que estas de acuerdo con nuestra Política de Privacidad
						</Text>
					</Rectangle>
					<WhileTrue Value="{huboCancel}" Bypass="Never">
	        			<Rectangle ux:Name="errBar1" Y="5%" Opacity="0" Padding="5" Alignment="Bottom" Width="100%" Height="5%" Color="#D32F2F">
	        				<Text Font="font8" FontSize="12" TextWrapping="Wrap" TextAlignment="Center" Alignment="VerticalCenter" Color="White">
	        					Hubo un error al iniciar sesión. Inténtalo de nuevo.
	        				</Text>
	        			</Rectangle>
	        			<Change Target="errBar1.Opacity" Value="1.5" Duration="1" Delay="0" />
	        			<Change Target="errBar1.Y" Value="0%" Duration="0.5" Delay="0" />
	        			<!--<Callback Handler="{resetCancel}" />-->
	        		</WhileTrue>
				</DockPanel>
				<WhileTrue Value="{opacity}">
	            	<Change Target="logoRect.Opacity" Value="0.9" Duration="0.5" Delay="0" DelayBack="0" Easing="BackIn" />
	            	<!-- <Change Target="animal.Opacity" Value="0.5" Duration="1" Delay="0" DelayBack="0" Easing="BackIn" /> -->

	            	<Change Target="sloganRect.Opacity" Value="1" Duration="0.5" Delay="0" DelayBack="0" Easing="BackIn" /> 

	            	<Change Target="loginRect.Opacity" Value="0.8" Duration="0.5" Delay="0" DelayBack="0" Easing="BackIn" />
	            	
	            	<Change Target="divRect.Opacity" Value="1" Duration="0.5" Delay="0" DelayBack="0" Easing="BackIn" />
	            	<Change Target="orRect.Opacity" Value="1" Duration="0.5" Delay="0" DelayBack="0" Easing="BackIn" />
	            	<Change Target="div2Rect.Opacity" Value="1" Duration="0.5" Delay="0" DelayBack="0" Easing="BackIn" />

	            	<Change Target="otroRect.Opacity" Value="0.8" Duration="0.5" Delay="0" DelayBack="0" Easing="BackIn" />
	            	
	            	<Change Target="bgMain2.Opacity" Value="0" Duration="0.5" Delay="0" DelayBack="0" Easing="BackIn" />
	            	<Change Target="bgMain.Opacity" Value="0.4" Duration="0.5" Delay="0" DelayBack="0" Easing="BackIn" />
	            	
	            	<Change Target="blur1.Radius" Value="30" Duration="0.5" Delay="0" DelayBack="0" Easing="BackIn" /> 
	        		<Change Target="blur2.Radius" Value="30" Duration="0.5" Delay="0" DelayBack="0" Easing="BackIn" />

	        		<Change Target="politicaRect.Opacity" Value="1" Duration="0.5" Delay="0" DelayBack="0" Easing="BackIn" />

	        		<Timeline ux:Name="timeline"  PlayMode="Wrap" >
				        <Change Target="animal.Opacity">
				            <Keyframe Value="0.2" Time="0.0"/>
				            <Keyframe Value="0.5" Time="1.0"/>
				            <Keyframe Value="0.5" Time="1.5"/>
				            <Keyframe Value="0.2" Time="2.0"/>
				        </Change>
				    </Timeline>
	        	</WhileTrue>
	        </WhileFalse>

	        <WhileTrue Value="{showWebView}">
	        	<iOS.StatusBarConfig Style="Light" Animation="Slide" IsVisible="False" />
	        	<DockPanel>
		        	<NativeViewHost ux:Name="nvh" Background="#ddd">
			        		<Rectangle  Alignment="Top" Padding="5" Height="40" Color="#0006">
					            <Text TextColor="White" TextAlignment="Center">Iniciar Sesión</Text>
					            <Rectangle ux:Name="wbOffBtn" Opacity="1" CornerRadius="4" Color="#0070ea" ZOffset="99999" Alignment="CenterRight" Width="20%" Height="27">
					            	<Text FontSize="14" TextColor="#fff" Margin="0,0,0,0" TextAlignment="Center">Cancelar</Text>
					            	<Clicked>
						           		<Callback Handler="{wbOff}" />
						        	</Clicked>
						        	<WhilePressed>
						        		<Change wbOffBtn.Opacity="0.4" />
						        	</WhilePressed>
					            </Rectangle>
					        </Rectangle>
							<WebView ux:Name="webView" Url="{url}" Margin="0,40,0,0">
								<PageLoaded>
									<EvaluateJS Handler="{pageLoaded}">
										return { url : document.location.href };
									</EvaluateJS>
								</PageLoaded>
							</WebView> 
							<AddingAnimation>
								<Change nvh.Opacity="0" Duration="0.3" />
							</AddingAnimation>
					</NativeViewHost>
				</DockPanel>
	        </WhileTrue>
		</WhileString>
		<WhileString Value="{accessToken}" Equals="" Invert="true" CaseSensitive="false" Bypass="Never"> 
			<WhileString Value="{myName}" Equals="" Invert="true" CaseSensitive="false" Bypass="Never">
				<Callback Handler="{nav2}" />
			</WhileString>
		</WhileString>
	</Page>

	<Page ux:Name="Page2" Background="#fff" Transition="Standard" >
		<Image ux:Class="pbg1" File="Assets/pbg1.png" Layer="Background" />
		<Image ux:Class="pbg2" File="Assets/pbg2.png" Layer="Background" />
		<Image ux:Class="pbg3" File="Assets/pbg3.png" Layer="Background" />
		<Image ux:Class="pbg4" File="Assets/pbg4.png" Layer="Background" />
		<Image ux:Class="pbg5" File="Assets/pbg5.png" Layer="Background" />

		<Image ux:Class="pbg6" File="Assets/pbg6.png" Layer="Background" />
		<Image ux:Class="pbg7" File="Assets/pbg7.png" Layer="Background" />
		<Image ux:Class="pbg8" File="Assets/pbg8.png" Layer="Background" />
		<Image ux:Class="pbg9" File="Assets/pbg9.png" Layer="Background" />
		<Image ux:Class="pbg10" File="Assets/pbg10.png" Layer="Background" />

		<Image ux:Class="pbg11" File="Assets/pbg11.png" Layer="Background" />
		<Image ux:Class="pbg12" File="Assets/pbg12.png" Layer="Background" />
		<Image ux:Class="pbg13" File="Assets/pbg13.png" Layer="Background" />
		<Image ux:Class="pbg14" File="Assets/pbg14.png" Layer="Background" />
		<Image ux:Class="pbg15" File="Assets/pbg15.png" Layer="Background" />

		<WhilePageActive Bypass="Never">
			<iOS.StatusBarConfig Style="Dark" Animation="Slide" IsVisible="True" />
		</WhilePageActive>

		<!-- <StackPanel>
			<StatusBarBackground Dock="Top"/>
			<Text TextColor="Black" Value="{myName}"></Text> 
			<Image>
				<HttpImageSource ux:Name="ProfilePic" Url="{myPicture}" />
			</Image> 
			<Rectangle Width="50" Height="50" Color="Blue" Clicked="{logout}">
				<Clicked>
					<Callback Handler="{nav1}" />
				</Clicked>
				<Text>Logout</Text>
			</Rectangle>
		</StackPanel> -->
		<EdgeNavigator>
				
			<DockPanel Alignment="Bottom" ux:Name="sidebar" Edge="Left" Width="100%" Margin="0,0,45,0">
				
				<StatusBarBackground Dock="Top"/>
				<Shadow ux:Name="shadow" Angle="180" Distance="8" Size="16" Color="#0000" />
				
				<ActivatingAnimation>
					<Change shadow.Color="#0004" />
					<Change sidebarFade.Opacity="1" />
				</ActivatingAnimation>
				

				<ScrollView Background="#fff" Margin="0,0,0,0" AllowedScrollDirections="Vertical">
					<StackPanel>
						<Rectangle Width="100%" Height="190">
							<LinearGradient StartPoint="0,0" EndPoint="0,1">
							        <GradientStop Offset="0" Color="#0f0c29" />
							        <GradientStop Offset="1" Color="#302b63" />
							        <GradientStop Offset="2" Color="#24243e" />
							</LinearGradient>
							<DockPanel>
								<Circle Alignment="VerticalCenter" Margin="0,0,0,40" Width="100" Height="100">
									<ImageFill> 
										<HttpImageSource Url="{myPicture}"  />
									</ImageFill>
								</Circle>

								<Rectangle Alignment="BottomCenter" Margin="0,0,0,35">
									<Text FontSize="16" TextAlignment="Center" TextColor="White" TextWrapping="Wrap" Font="font6" Value="{myName}" />
								</Rectangle>

								<Rectangle Alignment="BottomCenter" Margin="0,0,0,20">
									<Text FontSize="11" TextAlignment="Center" TextColor="White" TextWrapping="Wrap" Font="font6">
										IDENTIDAD OCULTA
									</Text>
								</Rectangle>

							</DockPanel>
						</Rectangle>

						<Rectangle Width="100%" Height="1" Color="#cccccc"></Rectangle>	

						<Rectangle Width="100%" Height="40" Background="#e8e8e8">
							<Text Font="font8" FontSize="13" TextColor="#7a7a7a" Alignment="VerticalCenter" TextAlignment="Left" Margin="10,0,0,0">EXPRESIONES</Text>
						</Rectangle>					

						<Rectangle Width="100%" Height="1" Color="#cccccc"></Rectangle>	

						<Rectangle ux:Name="amigosBtn" Width="100%" Height="40">

							<WhileString Value="{seccion}" Equals="1">
								<Rectangle Width="5" Height="40" Color="#009688" Alignment="CenterRight" />
							</WhileString>
							<Clicked>
								<Callback Handler="{set1}" />
								<NavigateToggle Target="sidebar" />
							</Clicked>
							<WhilePressed>
								<Change amigosBtn.Background="#e5e5e5" />
							</WhilePressed>
							<Text Alignment="VerticalCenter" FontSize="14" Font="font6" TextColor="#7a7a7a" Margin="10,0,0,0" TextAlignment="Left">Amigos</Text>
						</Rectangle>

						<Rectangle Width="100%" Height="1" Color="#cccccc"></Rectangle>	

						<Rectangle ux:Name="tendenciaBtn" Width="100%" Height="40">

							<WhileString Value="{seccion}" Equals="2">
								<Rectangle Width="5" Height="40" Color="#FF9800" Alignment="CenterRight" />
							</WhileString>
							<Clicked>
								<Callback Handler="{set2}" />
								<NavigateToggle Target="sidebar" />
							</Clicked>
							<WhilePressed>
								<Change tendenciaBtn.Background="#e5e5e5" />
							</WhilePressed>
							<Text Alignment="VerticalCenter" FontSize="14" Font="font6" TextColor="#7a7a7a" Margin="10,0,0,0" TextAlignment="Left">Tendencia</Text>
						</Rectangle>

						<Rectangle Width="100%" Height="1" Color="#cccccc"></Rectangle>
							
							<Rectangle Width="100%" Height="40" Background="#e8e8e8">
								<Text Font="font8" FontSize="13" TextColor="#7a7a7a" Alignment="VerticalCenter" TextAlignment="Left" Margin="10,0,0,0">MENSAJES</Text>
							</Rectangle>	
						
						<Rectangle Width="100%" Height="1" Color="#cccccc"></Rectangle>	

							<Rectangle ux:Name="msjBtn" Width="100%" Height="40">
								
								<WhileString Value="{seccion}" Equals="3">
									<Rectangle Width="5" Height="40" Color="#536DFE" Alignment="CenterRight" />
								</WhileString>
								<Clicked>
									<Callback Handler="{set3}" />
									<NavigateToggle Target="sidebar" />
								</Clicked>
								<WhilePressed>
									<Change msjBtn.Background="#e5e5e5" />
								</WhilePressed>
								<Text Alignment="VerticalCenter" FontSize="14" Font="font6" TextColor="#7a7a7a" Margin="10,0,0,0" TextAlignment="Left">Buzón Personal</Text>
							</Rectangle>
						
						<Rectangle Width="100%" Height="1" Color="#cccccc"></Rectangle>	

						<Rectangle Width="100%" Height="40" Background="#e8e8e8">
							<Text Font="font8" FontSize="13" TextColor="#7a7a7a" Alignment="VerticalCenter" TextAlignment="Left" Margin="10,0,0,0">MI CUENTA</Text>
						</Rectangle>	

						<Rectangle Width="100%" Height="1" Color="#cccccc"></Rectangle>	

						<Rectangle ux:Name="expBtn" Width="100%" Height="40">

							<WhileString Value="{seccion}" Equals="4">
									<Rectangle Width="5" Height="40" Color="#D32F2F" Alignment="CenterRight" />
							</WhileString>
							<Clicked>
								<Callback Handler="{set4}" />
								<NavigateToggle Target="sidebar" />
							</Clicked>
							<WhilePressed>
								<Change expBtn.Background="#e5e5e5" />
							</WhilePressed>
							<Text Alignment="VerticalCenter" FontSize="14" Font="font6" TextColor="#7a7a7a" Margin="10,0,0,0" TextAlignment="Left">Expresiones</Text>
						</Rectangle>	

						<Rectangle Width="100%" Height="1" Color="#cccccc"></Rectangle>	

						<Rectangle ux:Name="configBtn" Width="100%" Height="40">
							<WhileString Value="{seccion}" Equals="5">
									<Rectangle Width="5" Height="40" Color="#616161" Alignment="CenterRight" />
							</WhileString>
							<Clicked>
								<Callback Handler="{set5}" />
								<NavigateToggle Target="sidebar" />
							</Clicked>
							<WhilePressed>
								<Change configBtn.Background="#e5e5e5" />
							</WhilePressed>
							<Text Alignment="VerticalCenter" FontSize="14" Font="font6" TextColor="#7a7a7a" Margin="10,0,0,0" TextAlignment="Left">Configuración</Text>
						</Rectangle>			

						<Rectangle Width="100%" Height="1" Color="#cccccc"></Rectangle>	



						<Rectangle ux:Name="logoutBtn" Background="#fff" Width="100%" Height="40">
							<Clicked>
								<Callback Handler="{logout}" />
								<Callback Handler="{nav1}" />
							</Clicked>
							<WhilePressed>
								<Change logoutBtn.Background="#e5e5e5" />
							</WhilePressed>
							<Text Alignment="VerticalCenter" FontSize="14" Font="font6" TextColor="#f44336" Margin="0,0,10,0" TextAlignment="Right">Cerrar Sesión</Text>
						</Rectangle>	

						<Rectangle Width="100%" Height="1" Color="#cccccc"></Rectangle>	
						
					</StackPanel>
				</ScrollView>
			</DockPanel>
			
			<DockPanel Color="#fff">
				<StatusBarBackground Dock="Top"/>
				<Rectangle ux:Name="sidebarFade" Layer="Overlay" Color="#0005" Opacity="0" HitTestMode="None" />
				<StackPanel Dock="Top" Color="#fff">
					<Shadow Size="3" Distance="1" />
					<Panel Height="56">
						<Hamburger Alignment="Left">
							<Clicked>
								<NavigateToggle Target="sidebar" />
							</Clicked>
						</Hamburger>
						<Image Opacity="0.7" Color="#b1b1b1" Alignment="VerticalCenter" File="Assets/logo.png" Height="30" />
						<Cross Alignment="Right">
							<Clicked>
								<Callback Handler="{set4}" />
							</Clicked>
						</Cross>
					</Panel>
				</StackPanel>

				<!-- CONTENIDO -->
				<ScrollView AllowedScrollDirections="Vertical">
				<!-- EMPIEZA EL EACH -->
				<StackPanel Orientation="Vertical">
				<WhileString Value="{seccion}" Equals="1">
					<DockPanel Padding="10" Width="100%" BoxSizing="FillAspect" Aspect="1" Background="#fff">
					<Image ux:Name="pbg1" File="Assets/pbg1.png" Layer="Background" />
						<Text Font="font8" FontSize="26" Alignment="VerticalCenter" TextColor="White" TextAlignment="Center" TextWrapping="Wrap">
						<DropShadow Size="1" Distance="1" Spread="0.1" Color="#818181" Angle="90" />
							Apparently trhough the eyes of aa fodasur year old, I look 58. Iss'm 2s.dsadasdas2121ddd
						</Text> 
						<Text Font="font4" TextColor="White" Alignment="BottomLeft">Hermosillo</Text>
						<Text Font="font4" TextColor="White" Alignment="BottomRight" Margin="0,0,105,0">999</Text>
						<Image Alignment="BottomRight" File="Assets/comment.png" Height="25" Margin="0,0,70,0" />
						<Text Font="font4" TextColor="White" Alignment="BottomRight" Margin="0,0,30,0">999</Text>
						<Image Alignment="BottomRight" File="Assets/like.png" Height="25" />
					</DockPanel>

					<!-- <DockPanel Padding="10" Width="100%" BoxSizing="FillAspect" Aspect="1" Background="#fff">
					<Image ux:Name="pbg2" File="Assets/pbg2.png" Layer="Background" />	
						<Text Font="font8" FontSize="24" Alignment="VerticalCenter" TextColor="White" TextAlignment="Center" TextWrapping="Wrap">
						<DropShadow Size="1" Distance="1" Spread="0.1" Color="#818181" Angle="90" />
							Apparently trhough the eyes of aa fodasur year old, I look 58. Iss'm 2s.
						</Text> 
					</DockPanel>

					<DockPanel Padding="10" Width="100%" BoxSizing="FillAspect" Aspect="1" Background="#fff">
					<Image ux:Name="pbg3" File="Assets/pbg3.png" Layer="Background" />	
						<Text Font="font8" FontSize="24" Alignment="VerticalCenter" TextColor="White" TextAlignment="Center" TextWrapping="Wrap">
						<DropShadow Size="1" Distance="1" Spread="0.1" Color="#818181" Angle="90" />
							Apparently trhough the eyes of aa fodasur year old, I look 58. Iss'm 2s.
						</Text> 
					</DockPanel>

					<DockPanel Padding="10" Width="100%" BoxSizing="FillAspect" Aspect="1" Background="#fff">
					<Image ux:Name="pbg4" File="Assets/pbg4.png" Layer="Background" />	
						<Text Font="font8" FontSize="24" Alignment="VerticalCenter" TextColor="White" TextAlignment="Center" TextWrapping="Wrap">
						<DropShadow Size="1" Distance="1" Spread="0.1" Color="#818181" Angle="90" />
							Apparently trhough the eyes of aa fodasur year old, I look 58. Iss'm 2s.
						</Text> 
					</DockPanel>

					<DockPanel Padding="10" Width="100%" BoxSizing="FillAspect" Aspect="1" Background="#fff">
					<Image ux:Name="pbg5" File="Assets/pbg5.png" Layer="Background" />	
						<Text Font="font8" FontSize="24" Alignment="VerticalCenter" TextColor="White" TextAlignment="Center" TextWrapping="Wrap">
						<DropShadow Size="1" Distance="1" Spread="0.1" Color="#818181" Angle="90" />
							Apparently trhough the eyes of aa fodasur year old, I look 58. Iss'm 2s.
						</Text> 
					</DockPanel>

					<DockPanel Padding="10" Width="100%" BoxSizing="FillAspect" Aspect="1" Background="#fff">
					<Image ux:Name="pbg6" File="Assets/pbg6.png" Layer="Background" />	
						<Text Font="font8" FontSize="24" Alignment="VerticalCenter" TextColor="White" TextAlignment="Center" TextWrapping="Wrap">
						<DropShadow Size="1" Distance="1" Spread="0.1" Color="#818181" Angle="90" />
							Apparently trhough the eyes of aa fodasur year old, I look 58. Iss'm 2s.
						</Text> 
					</DockPanel>

					<DockPanel Padding="10" Width="100%" BoxSizing="FillAspect" Aspect="1" Background="#fff">
					<Image ux:Name="pbg7" File="Assets/pbg7.png" Layer="Background" />	
						<Text Font="font8" FontSize="24" Alignment="VerticalCenter" TextColor="White" TextAlignment="Center" TextWrapping="Wrap">
						<DropShadow Size="1" Distance="1" Spread="0.1" Color="#818181" Angle="90" />
							Apparently trhough the eyes of aa fodasur year old, I look 58. Iss'm 2s.
						</Text> 
					</DockPanel>

					<DockPanel Padding="10" Width="100%" BoxSizing="FillAspect" Aspect="1" Background="#fff">
					<Image ux:Name="pbg8" File="Assets/pbg8.png" Layer="Background" />	
						<Text Font="font8" FontSize="24" Alignment="VerticalCenter" TextColor="White" TextAlignment="Center" TextWrapping="Wrap">
						<DropShadow Size="1" Distance="1" Spread="0.1" Color="#818181" Angle="90" />
							Apparently trhough the eyes of aa fodasur year old, I look 58. Iss'm 2s.
						</Text> 
					</DockPanel>

					<DockPanel Padding="10" Width="100%" BoxSizing="FillAspect" Aspect="1" Background="#fff">
					<Image ux:Name="pbg9" File="Assets/pbg9.png" Layer="Background" />	
						<Text Font="font8" FontSize="24" Alignment="VerticalCenter" TextColor="White" TextAlignment="Center" TextWrapping="Wrap">
						<DropShadow Size="1" Distance="1" Spread="0.1" Color="#818181" Angle="90" />
							Apparently trhough the eyes of aa fodasur year old, I look 58. Iss'm 2s.
						</Text> 
					</DockPanel>

					<DockPanel Padding="10" Width="100%" BoxSizing="FillAspect" Aspect="1" Background="#fff">
					<Image ux:Name="pbg10" File="Assets/pbg10.png" Layer="Background" />	
						<Text Font="font8" FontSize="24" Alignment="VerticalCenter" TextColor="White" TextAlignment="Center" TextWrapping="Wrap">
							<DropShadow Size="1" Distance="1" Spread="0.1" Color="#818181" Angle="90" />
							Apparently trhough the eyes of aa fodasur year old, I look 58. Iss'm 2s.
						</Text> 
					</DockPanel>

					<DockPanel Padding="10" Width="100%" BoxSizing="FillAspect" Aspect="1" Background="#fff">
					<Image ux:Name="pbg11" File="Assets/pbg11.png" Layer="Background" />	
						<Text Font="font8" FontSize="24" Alignment="VerticalCenter" TextColor="White" TextAlignment="Center" TextWrapping="Wrap">
						<DropShadow Size="1" Distance="1" Spread="0.1" Color="#818181" Angle="90" />
							Apparently trhough the eyes of aa fodasur year old, I look 58. Iss'm 2s.
						</Text> 
					</DockPanel>

					<DockPanel Padding="10" Width="100%" BoxSizing="FillAspect" Aspect="1" Background="#fff">
					<Image ux:Name="pbg12" File="Assets/pbg12.png" Layer="Background" />	
						<Text Font="font8" FontSize="24" Alignment="VerticalCenter" TextColor="White" TextAlignment="Center" TextWrapping="Wrap">
						<DropShadow Size="1" Distance="1" Spread="0.1" Color="#818181" Angle="90" />
							Apparently trhough the eyes of aa fodasur year old, I look 58. Iss'm 2s.
						</Text> 
					</DockPanel>

					<DockPanel Padding="10" Width="100%" BoxSizing="FillAspect" Aspect="1" Background="#fff">
					<Image ux:Name="pbg13" File="Assets/pbg13.png" Layer="Background" />	
						<Text Font="font8" FontSize="24" Alignment="VerticalCenter" TextColor="White" TextAlignment="Center" TextWrapping="Wrap">
						<DropShadow Size="1" Distance="1" Spread="0.1" Color="#818181" Angle="90" />
							Apparently trhough the eyes of aa fodasur year old, I look 58. Iss'm 2s.
						</Text> 
					</DockPanel>

					<DockPanel Padding="10" Width="100%" BoxSizing="FillAspect" Aspect="1" Background="#fff">
					<Image ux:Name="pbg14" File="Assets/pbg14.png" Layer="Background" />	
						<Text Font="font8" FontSize="24" Alignment="VerticalCenter" TextColor="White" TextAlignment="Center" TextWrapping="Wrap">
						<DropShadow Size="1" Distance="1" Spread="0.1" Color="#818181" Angle="90" />
							Apparently trhough the eyes of aa fodasur year old, I look 58. Iss'm 2s.
						</Text> 
					</DockPanel>

					<DockPanel Padding="10" Width="100%" BoxSizing="FillAspect" Aspect="1" Background="#fff">
					<Image ux:Name="pbg15" File="Assets/pbg15.png" Layer="Background" />	
						<Text Font="font8" FontSize="24" Alignment="VerticalCenter" TextColor="White" TextAlignment="Center" TextWrapping="Wrap">
						<DropShadow Size="1" Distance="1" Spread="0.1" Color="#818181" Angle="90" />
							Apparently trhough the eyes of aa fodasur year old, I look 58. Iss'm 2s.
						</Text> 
					</DockPanel> -->
				</WhileString> 	

				
				<WhileString Value="{seccion}" Equals="4">
					<DockPanel Padding="10" Width="100%" BoxSizing="FillAspect" Aspect="1" Background="#fff">
						
						<pbg1 />


						<TextView Opacity="{tvOpacity}" Gained="{isFocusedTV}" MaxLength="85" CaretColor="White" Font="font8" FontSize="26" Alignment="VerticalCenter" TextColor="White" TextAlignment="Center" TextWrapping="Wrap">
						
						<WhileTrue Value="{enLimite}">
							<ReleaseFocus/>
						</WhileTrue>
						<DropShadow Size="1" Distance="1" Spread="0.1" Color="#818181" Angle="90" />
							{contenido}
						</TextView> 
						

						
						<Text Font="font8" FontSize="14" Alignment="BottomRight" TextColor="{limiteColor}" TextAlignment="Right" TextWrapping="Wrap">{Scuenta}</Text>
						 
					</DockPanel>
				</WhileString>

				</StackPanel>	

				<!-- TERMINA EL EACH -->
				</ScrollView>

				<!-- END CONTENIDO -->

			</DockPanel>

		</EdgeNavigator>
	</Page>

</Navigator>
7

Hey!

Thank you for code, but I can not run it because it uses images and fonts. For your wrapping problem, I would suggest trying without your custom fonts. Maybe one of the fonts is rendering incorrectly.