Develop Reference

UWP: Wrapping text at textbox doesn't work

I trying to wrap text at textBox but there are no success..
<Grid Margin="0,0,0,0" BorderThickness="1" BorderBrush="Gray">
<ScrollViewer VerticalScrollBarVisibility="Visible" HorizontalScrollBarVisibility="Auto" >
<TextBox x:Name="Details" IsReadOnly="True" HorizontalAlignment="Left" TextWrapping="Wrap" VerticalAlignment="Stretch" BorderThickness="0" Height="500" />
</ScrollViewer>
</Grid>
If I have long line without \n I have long string with horizontal scrollbar. But how I understand TextWrapping="Wrap" should cut this string.
I saw this answer but this is not suitable for me because I can have different width of this textBox.
Also I tried to use AcceptsReturn="True" with no success.
I glad to hear any ideas on how to make it works.

I'm not sure if this is what you are looking for, but i'm wondering why you don'disable horizontal Scrolling.
<ScrollViewer Grid.Column="2" VerticalScrollBarVisibility="Visible" HorizontalScrollBarVisibility="Disabled">
<TextBlock Text="TextusLongusTextusLongusTextusLongusTextusLongusTextusLongusTextusLongusTextusLongus" TextWrapping="Wrap" VerticalAlignment="Stretch"/>
</ScrollViewer>

You don't define any sort of width restriction. Which means that your TextBox can theoratically expand infinitely in width.
Try to either set its width in your XAML code or its maxwidth.
You can also forget about the ScrollViewer. It's already a part of the TextBox and you could just add the elements that you set in your ScrollViewer as an element of the TextBox.
Justt add it like ScrollViewer.VerticalScrollBarVisibility="Visible"

how to give height of a parent to child in UWP

I have a stack panel and it has one grid and I'd like the grid to have same height as stack panel.
I tried playing with VerticalAlignment stretch or height 100% nothing works
I tried setting the values programatically OnNavigatedTo but it doesn't have the effect
Any suggestions to resolve this are welcome
Please find the code below
<StackPanel Grid.Row="0" Grid.RowSpan="4" Background="#CFFF" Visibility="Visible" Orientation="Vertical" Name="ProgressOverlay">
<Grid Name="Overlaygrid"">
<StackPanel VerticalAlignment="Center" Grid.Row="0">
<ProgressBar
IsIndeterminate="True"
IsEnabled="True" Foreground="Black"/>
<TextBlock Visibility="Visible" Foreground="Black" FontSize="25” T HorizontalAlignment="Center" Text="Loading"/>
</StackPanel>
</Grid>
</StackPanel>

A StackPanel takes by default the size needed by its content and shrinks to the size required, while a container control like Grid stretches to the full size available (e.g full page).
If you want to keep the outer StackPanel, you will have to set VerticalAlignment="Stretch" on the StackPanel, not on the Grid.
But since the Grid is the only single content item in your outer StackPanel, you can remove it and move the properties Grid.RowSpan="4" Background="#CFFF" Visibility="Visible" to the Grid. Always try to keep your XAML structure as simple as possible.

'Live' Slider value into label

I've made an app that allowes me to control a Microsoft NXT 2.0 Mindstorms robot and I've recently added a slider that I want to use to set the current engine speed instead of having a fixed value, so I need help.
Here I have the XAML of the label and slider that I want to use:
<Slider x:Name="Speed" HorizontalAlignment="Left" Margin="40,58,0,0" VerticalAlignment="Top" Width="30" Orientation="Vertical" Height="187" Maximum="90" Minimum="-90" SmallChange="1" LargeChange="10" IsSnapToTickEnabled="True" TickFrequency="5" TickPlacement="BottomRight" AutoToolTipPlacement="BottomRight" MouseUp="Speed_MouseUp" BorderBrush="#00000000" Background="#00000000" Foreground="#FF858585">
<Label x:Name="Current_Speed" Content="Currently: " HorizontalAlignment="Right" Margin="0,0,478,257" Width="60" Height="29" VerticalAlignment="Bottom" Foreground="Black" />
I want Current_Speed to write Currently: {SliderValue} I want it to write the current value of the slider instantly as I move my slider up or down like you can do with the ToolTip option.
Any ideas?
(Bear in mind, I'm not very skilled, so detailed solutions would be much appreciated)
Thank you in advance :)

It's relatively easy. The "trick" is that you need to use two different Label objects, which you can aggregate together using a StackPanel container.
For the second Label object, just set the Label's Content attribute like this:
Content="{Binding ElementName=Speed, Path=Value}"
The whole thing will look something like this:
<Slider x:Name="Speed"
HorizontalAlignment="Left" VerticalAlignment="Top"
Margin="40,58,0,0"
Width="30" Height="187"
Orientation="Vertical"
Maximum="90" Minimum="-90"
SmallChange="1" LargeChange="10"
IsSnapToTickEnabled="True" TickFrequency="5" TickPlacement="BottomRight"
AutoToolTipPlacement="BottomRight"
MouseUp="Speed_MouseUp"
BorderBrush="#00000000" Background="#00000000" Foreground="#FF858585" />
<StackPanel Orientation="Horizontal" Margin="0,0,0,257" Height="29">
<Label x:Name="Current_Speed_Text"
Content="Currently: "
HorizontalAlignment="Right" VerticalAlignment="Bottom"
Foreground="Black" />
<Label x:Name="Current_Speed"
Content="{Binding ElementName=Speed, Path=Value}"
HorizontalAlignment="Right" VerticalAlignment="Bottom"
Foreground="Black" />
</StackPanel>
Note: I have rearranged the layout a bit to ensure the UI elements are properly visible, and have reformatted the XAML itself to aid in readability.
I will also suggest that you use some other mechanism for controlling layout than setting the Margin values. The Margin attribute is very good for ensuring adequate space between elements, but it's not very good at accommodating flexible layout of elements, as it usually requires hand-modifying the margin values as other element characteristics change (e.g. font size, number of characters in the text, etc.).
Likewise, you should use Width and Height sparingly. They have similar problems.
In other words, if you apply the above suggestion to your XAML and it doesn't seem to work, it's because the Label is currently being laid out in such a way that the extra "speed value" text can't be seen.

XAML WP8 and making a 'TextBlock' scroll down

Alright, so I have a XAML page with a TextBlock in a Windows Phone 8 application. My dilemma is this:
I pragmatically add more content (formatted lines with Inlines.Add(new Run...) to the TextBlock. The text block is currently filled from bottom to up because of the ScrollViewer in the sense that a line appears in the bottom after another. I would also be fine with them starting to appear from the top as long as the TextBlock would continue to scroll down (actually this might look better) once it is full. My TextBlock is inside a ScrollViewer as below:
<Popup x:Name="send_message_xaml" Grid.Row="1" VerticalOffset="0" Width="750" Height="auto">
<StackPanel Orientation="Vertical" Margin="0,0" Width="auto" Height="auto">
<ScrollViewer Height="345" HorizontalAlignment="Left" Margin="0,0,0,0" Name="scrollViewer1" VerticalAlignment="Bottom" Width="420" VerticalScrollBarVisibility="Auto">
<TextBlock x:Name="message_log" Margin="40,50,0,0" TextWrapping="Wrap" Width="420" VerticalAlignment="Top" FontSize="22"/>
</ScrollViewer>
<TextBox x:Name="message_to_send" InputScope="Chat" Width="480" KeyDown="message_to_send_KeyDown" Margin="15,0"/>
</StackPanel>
</Popup>
How can I get the textblock to scroll so that the newest appended message is always at the bottom? I found a bunch of these threads but none seem to solve my problem so far. Do I need to add some code somewhere with the appending?

You need to update the VerticalOffset based on the ScrollableHeight. When you add new inlines to the TextBlock, its height is going to change and that will notify the parent ScrollViewer. So, after you add new items to the inlines, run the Measure method and update the VerticalOffset.
Here is an example.

Is there a way to size a border to its contents? (Winnrt Xaml)

I have a border around a textblock to create a nice background with rounded corners. But no matter what I do the border width is always the size of its parent. I want to limit it to the size of its contents.
I tried binding the width to the actual width of it's contents, but that didn't work, with any of the binding modes.
<Border x:Name="TagPreviewBorder" CornerRadius="5"
Width="{Binding ElementName=TagPreviewTextBlock, Path=ActualWidth, Mode=TwoWay}">
<TextBlock x:Name="TagPreviewTextBlock"/>
</Border>

An easy workarround would be to forget Border in your xaml and
use a TextBox instead of TextBlock like this:
<TextBox Text="Your Text Here"
IsReadOnly="True" Background="Transparent" BorderBrush="Red"
BorderThickness="3" HorizontalAlignment="Left"/>
UPDATE:
I checked again and seems that you have forgotten to set the Border's HorizontalAlignment
This also works:
<Border CornerRadius="5" HorizontalAlignment="Left" BorderThickness="10">
<TextBlock Text="My Text Here"></TextBlock>
</Border>