WPF RichTextBox text from bottom

Question

I'm trying to make a chat window, like IRC, in which the contents are shown from bottom to top, just like any chat window ever created.

This is my xaml, nothing fancy about it

<Window
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:ee="http://schemas.microsoft.com/expression/2010/effects" xmlns:ed="http://schemas.microsoft.com/expression/2010/drawing" x:Class="TestChat.Chat"
    Title="Chat" Height="700" Width="400" WindowStyle="ThreeDBorderWindow" ResizeMode="CanMinimize">

    <Grid>
        <RichTextBox x:Name="txtChat" HorizontalAlignment="Left" Height="644" Margin="0,10,0,0" VerticalAlignment="Top" Width="388" VerticalScrollBarVisibility="Auto">
            <FlowDocument />
        </RichTextBox>
    </Grid>
</Window>

And i have a backgroundworker adding text to it

private void SendWorkerComplete(object s, ProgressChangedEventArgs args)
{
    txtChat.AppendText(args.UserState.ToString());
    txtChat.ScrollToEnd();
}

private void SendWorker_DoWork(object sender, DoWorkEventArgs e)
{
    SendWorker.ReportProgress(0, (string)e.Argument);
}

The VerticalContentAlignment property set to bottom does not render the contents this way, how could this be done? is there a property for it or it has to be done programmatically?

Here is a similar requirement. Not exactly as you have specified, but it may work for you: http://stackoverflow.com/questions/10308475/how-can-i-make-a-richtextbox-scroll-to-the-end-when-i-add-a-new-line — JamieMeyer, Sep 05 '15 at 03:10
That only scrolls to the bottom but if the richtextbox is empty there's no use to reproduce this behaviour, i guess i could add a bunch of empty lines and scrolling to end before appending the output to it to reproduce this, but i was looking for a more elegant way to do it, thanks anyway — FuuRe, Sep 05 '15 at 03:58
I've used approximately 10 different IRC and IM clients both web pages and installed software and I can't think of any of them that showed messages at the bottom **with empty space above**. They all simply added each message as it came in and after the window was filled from the top down it auto scrolled the window so that the latest message was always visible. — StillLearnin, Sep 08 '15 at 01:48
Have you tried this? http://stackoverflow.com/q/6192255/934912 — StillLearnin, Sep 08 '15 at 01:54
@StillLearnin will do in a couple hours, but your comment on your solution made more sense to me, it doesn't answer the question directly but i think is the way to go in my case, thanks a lot. And to answer your previous comment, good old mIRC starts with the text at the bottom — FuuRe, Sep 08 '15 at 02:47
Ha! That's an IRC client that I've looked at but never used. I guess I'm — StillLearnin, Sep 08 '15 at 11:42
Hahahaha, by the way, please edit your answer to add your comment to it so i can accept it, and the only workaround i could find about the other issue was adding empty lines for the cursor to reach the bottom of the rtb. I don't want to answer my own question as your solution lead me to the right way of doing this, so please edit yours with all this. Thanks. — FuuRe, Sep 08 '15 at 16:16

score 0 · Answer 1 · answered Sep 05 '15 at 05:16

0

Why bother with a RichTextBox? Just use a regular TextBox.

<Grid>
    <TextBox x:Name="txtChat" VerticalScrollBarVisibility="Auto" Margin="10" Text="Hello" VerticalContentAlignment="Bottom" />
</Grid>

answered Sep 05 '15 at 05:16

StillLearnin

1,391
15
41

It is a chat, so it needs to have emoticons, different fonts sizes, styles, colors... you get the idea – FuuRe Sep 07 '15 at 01:05
1

@FuuRe Ah! I see. I assumed that you were going with just a plain text interface because if I were doing it, and wanted to handle emoticons fancy styling etc, I definitely wouldn't use a richtextbox. I'd first of all build a message class with all its associated properties (sender, message, etc) and then build a custom xaml control to represent the message object. Each time a message arrives, create a new message object and add it to a collection. Bind a listview to that collection with the list item template being your custom xaml control. – StillLearnin Sep 08 '15 at 01:44

score -1 · Answer 2 · answered Sep 05 '15 at 04:36

you've set margin-left to 545 that goes rich text box out of Window changing your code to something like this shows your control on bottom of window:

<RichTextBox x:Name="txtChat" HorizontalAlignment="Stretch" Height="42" VerticalAlignment="Bottom" Width="auto" VerticalScrollBarVisibility="Auto" Background="Yellow">
        <FlowDocument />
</RichTextBox>

WPF RichTextBox text from bottom

2 Answers2