I have been doing a TextBlock inside a ScrollViewer but I cant seem to scroll down the ScrollViewer when the text inside the TextBlock is full. Below are my codes:
<ScrollViewer Canvas.Left="157" Canvas.Top="292" Name="scrollViewer1" Width="362"Height="76">
<TextBlock Canvas.Left="157" Canvas.Top="292" Height="76" Name="totalIngredient" Text="" Width="362" Background="#E6F8F2F2" FlowDirection="LeftToRight"/>
</ScrollViewer>
Your TextBlock should fill the ScrollViewer completely, so set margin/width/height etc on the ScrollViewer instead. Also set horizontal scrollbar visibility to disabled, set vertical scrollbar visibility to auto (or whatever you want) and make the TextBlock wrap by setting TextWrapping to "Wrap":
<ScrollViewer Canvas.Left="157" Canvas.Top="292" Width="362" Height="76" HorizontalScrollBarVisibility="Disabled" VerticalScrollBarVisibility="Auto" >
<TextBlock Name="totalIngredient" Background="#E6F8F2F2" FlowDirection="LeftToRight" TextWrapping="Wrap" />
</ScrollViewer>
Try this code
<ScrollViewer HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto" Height="76" Width="362">
<TextBlock Name="totalIngredient" Text="" Background="#E6F8F2F2" TextWrapping="Wrap">
</TextBlock>
</ScrollViewer>
Related
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"
This textbox never lets me scroll. I am fairly certain it's because it is vertically expanding to "show" all the text. However, it is expanding past (and underneath) the bottom of the grid row it's in, so the text is not being displayed - yet the scroll bars are disabled (because it thinks there is no reason to show them).
The result is I see the top of the text in the file, and it gets cut off when it reaches the bottom of the grid cell it's in.
What do I need to do to tell the control: "Expand to the width and height of the grid cell you're in, and show the vertical scroll bar when the text won't fit in that space"?
<StackPanel Grid.Column="1" Grid.Row="1">
<ScrollViewer CanContentScroll="True" VerticalScrollBarVisibility="Visible">
<TextBlock x:Name="longText" Foreground="White" FontFamily="Times New Roman" FontSize="24" TextWrapping="Wrap" />
</ScrollViewer>
</StackPanel>
If you change it to this it will work.
<ScrollViewer Grid.Column="1" Grid.Row="1" VerticalScrollBarVisibility="Auto">
<StackPanel>
<TextBlock x:Name="longText" Foreground="White" FontFamily="Times New Roman" FontSize="24" TextWrapping="Wrap" />
</StackPanel>
</ScrollViewer>
But in same time you have to make sure that your grids height is set to * or a fixed size:
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/> //Or whatever size you want
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<ScrollViewer Grid.Column="1" Grid.Row="1" VerticalScrollBarVisibility="Auto">
<StackPanel>
<TextBlock x:Name="longText" Foreground="White" FontFamily="Times New Roman" FontSize="24" TextWrapping="Wrap" />
</StackPanel>
</ScrollViewer>
</Grid>
Btw, your StackPanel is redundant unless you have more controls inside it.
EDIT:
Well... First of all like mm8 and user2837961 explained a Scrollviewer doesn't make sense inside a StackPanel, because StackPanel can get expanded infinite. ScrollViewer only works when the object inside it are bigger than the size if it self. By giving your Grid row the size of *, you assign the remaining space of the grid for that row, means that items belonging to that row gets a fixed size. And if your Textbox is bigger than the ScrollViewer size the ScrollBarVisibility will be triggered.
Why do you need a StackPanel? I suggest you remove it and place the Grid.Column and Grid.Row in the ScrollViewer:
<ScrollViewer Grid.Column="1" Grid.Row="1" CanContentScroll="True" VerticalScrollBarVisibility="Visible">
<TextBlock x:Name="longText" Foreground="White" FontFamily="Times New Roman" FontSize="24" TextWrapping="Wrap" />
</ScrollViewer>
Putting ScrollViewers inside StackPanels is a bad idea. This is because a StackPanel measures its children with infinite horizontal space if its Orientation property is set to Horizontal and infinite vertical space if it is set to Vertical. Please refer to my answer here for more information about this:
Horizontal scroll for stackpanel doesn't work
This basically means that the ScrollViewer element has an infinite height here and thus no vertical scrollbar is displayed.
So, as suggested by #user2837961, you should simply get rid of the StackPanel:
<ScrollViewer Grid.Column="1" Grid.Row="1" VerticalScrollBarVisibility="Visible">
<TextBlock x:Name="longText" Foreground="White" FontFamily="Times New Roman" FontSize="24" TextWrapping="Wrap" />
</ScrollViewer>
Also make sure that there is no other StackPanel further up the visual tree.
The text in my TextBlock is bound to an element in my code. However, when I first open my window, the Textblock is completely empty. As I add text, I need the ScrollViewer to allow me to scroll down the text, or automatically scroll down as more text is added. Using the MVVM, so no code behind would be ideal.
<StackPanel Grid.Column="0" Grid.Row="1" Margin="0 10">
<Label Style="{StaticResource LabelStyle}">Output</Label>
<ScrollViewer VerticalScrollBarVisibility="Visible" Height="100">
<TextBlock ScrollViewer.CanContentScroll="True" Height="100" VerticalAlignment="Stretch" TextWrapping="Wrap" Text="{Binding Path=ProcessingOutput}"/>
</ScrollViewer>
</StackPanel>
How can I make this happen? Is there a way to update the ScrollViewer so that it sees more text is beyond what I can see in the TextBlock and allows the user to scroll down, or allows me to set an autoscroll feature that scrolls down automatically as text is added via binding?
Thanks in advance!
scrollbar will work if you remove Height="100" from TextBlock
to make it scroll when Text changes other answers suggest to use ScrollViwer.ScrollToBottom() method, e.g. like this:
<ScrollViewer Name="scroll"
VerticalScrollBarVisibility="Visible"
Height="100">
<TextBlock ScrollViewer.CanContentScroll="True"
VerticalAlignment="Stretch"
TextWrapping="Wrap"
Text="{Binding Path=ProcessingOutput, NotifyOnTargetUpdated=True}"
TargetUpdated="Txt_OnTargetUpdated">
</TextBlock>
</ScrollViewer>
private void Txt_OnTargetUpdated(object sender, DataTransferEventArgs e)
{
scroll.ScrollToBottom();
}
I'm trying to scroll items in stackpanel added programmatically, but it's not working:
<ScrollViewer HorizontalScrollMode="Enabled" >
<StackPanel x:Name="options" Orientation="Horizontal" Width="760" HorizontalAlignment="Left" Margin="1,0,0,0">
</StackPanel>
</ScrollViewer>
is there any error?
You also need to specify the horizontal visibility of the ScrollViewer. Set it to any value other than Disabled (the default) and it will work:
<ScrollViewer HorizontalScrollMode="Enabled" HorizontalScrollBarVisibility="Auto">
In my ListBox I show different content including text. Text can be long or short. It scrolls by ScrollViewer. Code:
<ScrollViewer MaxHeight="300" VerticalAlignment="Top" Grid.Column="1" Grid.Row="1" >
<TextBlock Style="{StaticResource TextsTextBlock}" Text="{Binding Texts}" Grid.Column="1" Grid.Row="1" />
</ScrollViewer>
and it's also working if text is short, and height of this text do not reach MaxHeight of ScrollViewer. I want to make ScrollViewer works only when text is long and it's height greater than ScrollViewer's MaxHeight, else - it doesn't have to work.
Tried border
<Border BorderBrush="Aqua" BorderThickness="2" MaxHeight="300" VerticalAlignment="Top" Grid.Column="1" Grid.Row="1">
<ScrollViewer VerticalAlignment="Top" VerticalScrollBarVisibility="Auto" >
<TextBlock Style="{StaticResource TextsTextBlock}" Text="{Binding Texts}" Grid.Column="1" Grid.Row="1" />
</ScrollViewer>
</Border>
but it's still scrolls in this border.
Set the VerticalScrollBarVisibility property to Auto.
The default value is Visible which means that the scroll bar is always shown.
By contrast the HorizontalScrollBarVisibility property has a default value of Hidden.
Try removing some of the Grid. properties from the inner controls
<Border BorderBrush="Aqua" BorderThickness="2" MaxHeight="300" VerticalAlignment="Top" Grid.Column="1" Grid.Row="1">
<ScrollViewer VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Disabled" >
<TextBlock Text="text" TextWrapping="Wrap"/>
</ScrollViewer>
</Border>
this works fine with one line of text
If I copy paste your code it works fine