Scrollbar for RichTextBox WPF

Question

I have created a RichTextBox with a Fixed Width and Height (Size of A4 Sheet). I would like to scroll the text vertically when the data goes outside the height. I am able to achieve the vertical scroll via mouse wheel by setting the VerticalScrollBarVisibility property to Hidden. Until this everything works fine.

If I change the VerticalScrollBarVisibility property to "Visible", it display the vertical scrollbar attached to the RichTextBox. Since, I am using the fixed width for the RichtextBox, the Scrollbar does not appear at the right side of the window. However, I would like to have a separate Scrollbar to the right of my window (just like every browsers). I have added a separate Vertical Scrollbar to the window. Now the question is, how can I link the Scrollbar event to RichTextBox scrolling?.

     <Style x:Key="RichTxtStyle"  TargetType="{x:Type RichTextBox}">
        <Setter Property="VerticalScrollBarVisibility" Value="Hidden"/>
        <Setter Property="HorizontalScrollBarVisibility" Value="Disabled"/>
        <Setter Property="AcceptsReturn"  Value="True"/>            
        <Setter Property="Margin" Value="40,0,40,0"/>
        <Setter Property="Padding" Value="50,50,50,50"/>
        <Setter Property="Width" Value="827"/>
        <Setter Property="MinHeight"  Value="1169"/>
        <Setter Property="BorderThickness" Value="0"/>           
    </Style>

Here is the Scrollbar object

 <ScrollBar x:Name="VerticalScroll"   Grid.Row="1" Grid.Column="1" Orientation="Vertical" ValueChanged="VerticalScroll_ValueChanged"/>

Below is the event, I tried. This is where I am totally lost?.

        private void VerticalScroll_ValueChanged(object sender, RoutedPropertyChangedEventArgs<double> e)
    {
        double offset = e.NewValue;
        RichTxtBx.ScrollToVerticalOffset(offset);
    }

Teneko · Answer 1 · 2021-01-17T23:08:04.023

Correct me if I am wrong, but the approach of @meysam asadi is offering you to wrap RichTextBox by a ScrollViewer. Sometimes this is is not desired because of decreased perfomance. Instead you should simply use:

<Window x:Class="stackvoerflow_65766040.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:stackvoerflow_65766040"
        mc:Ignorable="d"
        Title="MainWindow" Height="450" Width="800">
    <Grid>
        <RichTextBox VerticalScrollBarVisibility="Visible" x:Name="rtbMain">
            
        </RichTextBox>
    </Grid>
</Window>

Then you are able to use the methods ScrollToEnd(), ScrollToVerticalOffset(double offset) and so on of "rtbMain".

To catch the ScollChanged event you use ScrollViewer.ScrollChanged="rtbMain_ScrollChanged" like this:

<Window x:Class="stackvoerflow_65766040.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:stackvoerflow_65766040"
        mc:Ignorable="d"
        Title="MainWindow" Height="450" Width="800">
    <Grid>
        <RichTextBox VerticalScrollBarVisibility="Visible" x:Name="rtbMain"
                     ScrollViewer.ScrollChanged="rtbMain_ScrollChanged">
        </RichTextBox>
    </Grid>
</Window>

Code-behind:

using System.Windows;
using System.Windows.Controls;

namespace stackvoerflow_65766040
{
    /// <summary>
    /// Interaction logic for MainWindow.xaml
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
        }

        private void rtbMain_ScrollChanged(object sender, ScrollChangedEventArgs e)
        {

        }
    }
}

If you you want assign the events of ScrollViewer from RichTextBox in code-behind aswell you should take a brief look at this: WPF accessing scrollviewer of a listview codebehind.

Thanks for the help. The issue here as mentioned before, the ScrollViewer appear at the right hand edge of the richtextbox. The RichTextBox is in the middle of the window. The edge of the window is at the edge of the screen. I do not want a ScrollBar appear at the edge of the richtextbox but at the edge of the window without extending the richtextbox to the edge of the window. — Raghu, Jan 18 '21 at 11:08

score 1 · Answer 2 · answered Jan 17 '21 at 21:31

1

I think this code is useful.

<ScrollViewer VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Disabled">
   <RichTextBox Style="{StaticResource RichTxtStyle}">
               
   </RichTextBox>
</ScrollViewer>

answered Jan 17 '21 at 21:31

Meysam Asadi

6,438
3
7
17

1

Thanks for the response. The issue with this method is that the RichTextBox is loosing its height property. I have no idea why. Also, I do not want the scrollbar at the edge of the richtextbox but at the edge of the window without extending the RichTextBox to the edge of the wondow. – Raghu Jan 18 '21 at 11:11

Scrollbar for RichTextBox WPF

2 Answers2