Inserting controls

[Joe Buckle]

Good day!

I'm not completely sure how this feature of the RadRichTextBox work
- Support for embedding Silverlight UI elements

 

Would that allow me to design Word-like templates?

Thank you very much.

[Ivailo Karamanolev]

Hello Joe Buckle,

I have responded in your other forum thread, over here.
More information on the InlineUIContainer itself can be found in the help.

Best wishes,
Ivailo
the Telerik team

[Joe Buckle]

Thank you for your response.

How can I update the height of the InlineUIContainer dynamically when a child control increases its height (so the height of the InlineUIContainer would be the same as the height of the stackpanel or the richtextbox)?

<

InlineUIContainer Width="400" Height="25">

 

    <

StackPanel x:Name="stackPanel" Width="400" Height="25">  

 

        <ScrollViewer x:Name="scrollViewer" VerticalScrollBarVisibility="Auto" Padding="0">  

            <RichTextBox x:Name="richTextBox" AcceptsReturn="True" TextWrapping="Wrap" />

        </ScrollViewer>

    </StackPanel>

</InlineUIContainer>

Thanks.

[Iva Toteva]

Hi Joe Buckle,

If you have the following XAML:

<telerik:RadRichTextBox  Name="editor" >
    <telerik:RadDocument>
        <telerik:Section>
            <telerik:Paragraph>
                <telerik:InlineUIContainer Width="400" Height="25">
                    <StackPanel x:Name="stackPanel" Width="400" Height="25">
                        <ScrollViewer x:Name="scrollViewer" VerticalScrollBarVisibility="Auto" Padding="0" SizeChanged="scrollViewer_SizeChanged">
                            <RichTextBox x:Name="richTextBox" AcceptsReturn="True" TextWrapping="Wrap" />
                        </ScrollViewer>
                    </StackPanel>
                </telerik:InlineUIContainer>
            </telerik:Paragraph>
        </telerik:Section>
    </telerik:RadDocument>
</telerik:RadRichTextBox>

You can handle the SizeChanged event of the ScrollViewer and update the height and width of the inline UI container like this:

private void scrollViewer_SizeChanged(object sender, SizeChangedEventArgs e)
{
    foreach (var container in this.editor.Document.EnumerateChildrenOfType<InlineUIContainer>())
    {
        if (container.UiElement.Equals((sender as ScrollViewer).Parent))
        {
            container.Height = e.NewSize.Height;
            container.Width = e.NewSize.Width;
            this.editor.UpdateEditorLayout();
            break;
        }
    }
}

Updating the layout, however, causes the editor to get the focus, which you can prevent like this:

private void scrollViewer_SizeChanged(object sender, SizeChangedEventArgs e)
{
    Dispatcher.BeginInvoke(() =>
    {
        this.editor.IsFocusable = false;
        foreach (var container in this.editor.Document.EnumerateChildrenOfType<InlineUIContainer>())
        {
            if (container.UiElement.Equals((sender as ScrollViewer).Parent))
            {
                container.Height = e.NewSize.Height;
                container.Width = e.NewSize.Width;
                this.editor.UpdateEditorLayout();
                break;
            }
        }
        this.editor.IsFocusable = true;
    });
}

If you have other questions, do not hesitate to contact us again.

Greetings,
Iva
the Telerik team