WPF vertical scrollbar aligns with text and not with textbox width - c#

For an application written in C# using WPF I have the following issue:
I have a textbox with text that is being pulled from a database. The length and format of the text can vary from being a short remark, to a long text of multiple paragraphs. In some edge cases, we get text which consists of many short lines 1. Because space is limited vertically and horizontally, we need to define the dimensions of the textboxes to fit the UI 1. As you can see, in the case where the textbox has to display more than 5 lines, with the lines being very short, we get a situation where the scrollbar doesn't align with the right side of the textbox, but aligns with the text itself.
I have tried to put the textbox inside of a Scrollviewer and tried to fix the issue this way, but this resulted in the scrollbar being outside of the textbox, with the thumb of the scrollbar not showing and the dimensions of the scrollbar itself being completely off.
The final result should be a scrollbar that is always aligned to the right side of the textbox, no matter the length of the text that is being displayed.
Examples of textboxes, top one being an edge case which comes up sometimes
<Label Grid.Row="0"
Content="{StaticResource NominationInfo_OperatorRemarks}"
Style="{StaticResource UnderlineLabel}" />
<TextBox Width="500"
Grid.Row="1"
HorizontalAlignment="Left"
MaxLines="5"
IsReadOnly="True"
Text="{Binding OperatorRemarks, Mode=OneWay}"
TextWrapping="Wrap"
ScrollViewer.VerticalScrollBarVisibility="Auto">
</TextBox>
<Label Grid.Row="2"
Content="{StaticResource NominationInfo_LoadingInstructions}"
Style="{StaticResource UnderlineLabel}" />
<TextBox Grid.Row="3"
MaxLines="5"
IsReadOnly="True"
ScrollViewer.VerticalScrollBarVisibility="Auto"
Text="{Binding OperatorInstructions, Mode=OneWay}"
TextWrapping="Wrap"
Width="500"
HorizontalAlignment="Left" />

I suppose you have confounded HorizontalAlignment and HorizontalContentAlignment.
Putting the following code to the TextBox should do the trick.
HorizontalAlignment="Stretch" HorizontalContentAlignment="Left"

Related

How do I wrap the content of a textbox inside a scrollviewer so that it scrolls when full in WPF?

I have placed a textbox inside a scrollviewer control. The textbox is updated with content from my database, however when the box becomes full, the box resizes to fit more text. I would like the scrollviewers scroll feature to activate at this point, and allow the user to scroll to see more text. I have tried the following:
<ScrollViewer>
<TextBox FontSize="14" TextWrapping="Wrap" ScrollViewer.CanContentScroll="True"/>
</ScrollViewer>
<ScrollViewer>
<TextBox FontSize="14" TextWrapping="Wrap" ScrollViewer.CanContentScroll="True" VerticalScrollBarVisibility="Visible" AcceptsReturn="True"/>
</ScrollViewer>
Any help would be much appreciated, Thanks.
You can use the ScroollViewer attached properties directly on a TextBox. Specify also the maximum height of the TextBox - MaxHeight:
<TextBox ScrollViewer.HorizontalScrollBarVisibility="Disabled"
ScrollViewer.VerticalScrollBarVisibility="Auto"
ScrollViewer.CanContentScroll="True"
FontSize="14" TextWrapping="Wrap" MaxHeight="300" />
No need to insert the TextBox inside the ScrollViewer.
you can implement scrolling functionality on a content control like

WPF TextBox doesn't switch to new line

I have a TextBox, which I want to be multiline and automatically sized to parent:
<TextBox Grid.Row="0" Grid.Column="0"
AcceptsReturn="True"
HorizontalAlignment="Stretch"
IsEnabled="{Binding CanModify}"
Margin="0"
TextWrapping="Wrap"
Text="{Binding Comment, UpdateSourceTrigger=PropertyChanged}"
VerticalScrollBarVisibility="Auto"
VerticalAlignment="Stretch"
/>
Most suggestions to make the TextBlock automatically switch to new line are about adding TextWrapping="Wrap" to it's properties, to prevent it from stretching it's usually AcceptsReturn="True", VerticalScrollBarVisibility="Auto" or manually set width. As you see, the only thing that I haven't yet tried is width, but in my case TextBox should fit to container, which width is unknown (also depends on it's parent). Having properties set as in listing doesn't help: caret never moves to new line and stretches the TextBox and the whole window as well.
What can I do to prevent this TextBox from stretching and to move text to new line automatically?
EDIT: Container is a TabControl. Containing tab:
<TabItem Header="{some binding}">
<Grid>
<Grid.RowDefinitions>
<RowDefinition SharedSizeGroup="TabHeight" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition SharedSizeGroup="TabWidth" />
</Grid.ColumnDefinitions>
<TextBox Grid.Row="0" Grid.Column="0"
AcceptsReturn="True"
HorizontalAlignment="Stretch" VerticalAlignment="Stretch"
IsEnabled="{Binding CanModify}"
Margin="0"
Style="{some style}"
TextWrapping="Wrap"
Text="{Binding Comment, UpdateSourceTrigger=PropertyChanged}"
VerticalScrollBarVisibility="Auto"
/>
</Grid>
</TabItem>
This TabControl lies in a simple Grid without any specific styles of constraints. Alas, I can't share the whole code of styles, applied to TabControl, but I'd highly appreciate any ideas to try.
SharedSizeGroups you see are intended to stretch the whole TabControl to the widest tab, preventing it from resizing on tab switches and shared only with another tab (there are two in this TabControl).

How do I keep a specific xaml element within the window (so it doesn't overflow through the bottom)

I'm trying to make a simple invoicing application as part of an assessment. I have made a interface with a listbox that contains all the items that have been requested. However when I add too many items, the listbox then flows through the bottom of the window and I have to resize the window to fit.
I've tried a dockpanel, and I've assigned the stackpanel to the grid itself. If I set a fixed height it seems to work as expected.
Here is the xaml of the listbox:
<StackPanel Grid.Column="1" Grid.Row="0" ClipToBounds="True">
<ListBox Name="Shirts" HorizontalContentAlignment="Stretch" ScrollViewer.VerticalScrollBarVisibility="Visible" Margin="5" ClipToBounds="True">
<ListBox.ItemTemplate>
<DataTemplate>
<TextBlock>
<Run Text="{Binding ShirtSize}" />
<Run Text="{Binding ShirtStyle}" />
<Run Text="{Binding ShirtColour}" />
</TextBlock>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
<Button Content="Print Invoice" Margin="5" ClipToBounds="True"/>
</StackPanel>
I expected the code to work like this (it's not meant to be of fix height but it works as an example).
How it actually works.
Use a DockPanel instead of a StackPanel and it should work better. StackPanel will grow with its content regardless of its container size. A DockPanel will respect the container size and fill the available space. Put the button first in order with Dock="Bottom" and then the ListBox with Dock="Fill" (the list will arrange itself above the button even though it is declared after it, which is a bit unintuitive)

WPF: Cutting the part of the last letter in textblock when FontStyle is Oblique

I have a simple XAML example:
<Grid>
<Button x:Name="button1" FontSize="28" FontWeight="Bold" FontStyle="Oblique" HorizontalContentAlignment="Center" Margin="296,142,296,249">
<TextBlock Width="Auto" Text="button" Padding="0" VerticalAlignment="Center"/>
</Button>
<Button x:Name="button2" Content="button" FontSize="28" FontWeight="Bold" FontStyle="Oblique" Margin="296,234,282,146" />
</Grid>
If height of any button will changed in design mode (or added and changed property Height in xaml), the part of last letter of text in textblocks will surprisingly cut from right side.
The error is only presents on oblique font style ('italic' or 'normal' looks good). Looks like text blocks have uncorrect calculated borders of width in this case.
It can be fixed by changing Padding property (Padding="0,0,6,0"). But it's not a good practice I think.
Could anyone advice how to show oblique fontstyle text correct?

Character or text limit in ScrollView or TextBlock?

Is there a limit to the amount of data/text that can be stored in a TextBlock/ScrollViewer?
I currently have this:
<ScrollViewer Height="Auto" Margin="0,151,0,0">
<TextBlock x:Name="auditText" Text="TextBlock"
VerticalAlignment="Top" Foreground="White" Height="Auto" Margin="0,10,0,0" Grid.Row="1" Padding="20" TextWrapping="Wrap">
</TextBlock>
</ScrollViewer>
It appears to work but as I get further down the scroll I find this:
As you can see there is more text but it just stops....any ideas?
The reason for this issue is that any element that must be displayed beyond the area which is larger than 2048x2048 pixels would be clipped by the platform.
You need to divide up your text into segments blocks and display.
TextBlock is Cutting Text in Windows Phone

Categories