Line spacing not working in Rad rich text box

9 posts, 0 answers
  1. Kiran
    Kiran avatar
    1 posts
    Member since:
    May 2013

    Posted 22 May 2013 Link to this post

    Hi,
    I m using Rad rich text box control in one of my Silverlight project.
    <TelerikControls:RadRichTextBox Grid.Row="5" Grid.ColumnSpan="2" x:Name="BodyTextBox" Background="White" Height="300" VerticalScrollBarVisibility="Visible" TabIndex="6" Margin="4,7,0,0" FontSize="12" IsSpellCheckingEnabled="False" AcceptsTab="False" />

    In code on load event I have assigned 
    BodyTextBox.Document.LineSpacingType = LineSpacingType.Exact;
    BodyTextBox.Document.LineSpacing = 0.5;

    if I try to test then its not working as on ENTER it is taking space.
    Please let me know
  2. Deyan
    Admin
    Deyan avatar
    143 posts

    Posted 24 May 2013 Link to this post

    Hello Kiran,

    LineSpacing property controls the spacing between lines in a paragraph. Pressing the Enter key, though, will insert additional paragraph, and the spacing between paragraphs is controlled with Paragraph.SpacingBefore and SpacingAfter properties. You can set the default spacing for all newly added paragraphs using RadDocument.ParagraphDefaultSpacingAfter and ParagraphDefaultSpacingBefore properties.

    If you need to set line spacing as well, note the difference between LineSpacingType.Exact and LineSpacingType.Auto:

    • LineSpacingType.Exact takes LineSpacing value as absolute value, so you have to know the font size in order to choose the appropriate LineSpacing value. For example with LineSpacing value 12 and font-size 12 this will fit the lines within a paragraph without spaces.
    • LineSpacingType.Auto calculates automatically the needed value, which is easier for use. Setting LineSpacing value to 0.5 in this case will make half-row space between the lines in a paragraph.

    You may read more about the different formatting options in this help article.

    Regards,
    Deyan
    the Telerik team

     Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

  3. Ramalingam
    Ramalingam avatar
    21 posts
    Member since:
    Apr 2014

    Posted 22 Dec 2014 in reply to Deyan Link to this post

    Hi Deyan,
    Could you please help us on this issue :
    If we hit Enter key, the new line is created with more space. Please suggest a way to create a next line with less space. We tried following code , however it's not working

     richTextEditor.Document.LineSpacingType = LineSpacingType.Exact;
     richTextEditor.DocumentInheritsDefaultStyleSettings = true;

     richTextEditor.Document.LineSpacing = 0;
     richTextEditor.Document.ParagraphDefaultSpacingAfter = 0;
     richTextEditor.Document.ParagraphDefaultSpacingBefore = 0;

    Please refer to the following attachments
    "Current behavior - Next line with more space.png"
    "Expected behavior - Next line with less space.png"

    I have also posted this question last week :

    http://www.telerik.com/account/support-tickets/view-ticket.aspx?threadid=890478

    Thanks,
    Obuliraj Ramalingam
  4. Ramalingam
    Ramalingam avatar
    21 posts
    Member since:
    Apr 2014

    Posted 22 Dec 2014 in reply to Ramalingam Link to this post

    I think in previous post, we need to set false for "DocumentInheritsDefaultStyleSettings"

    richTextEditor.DocumentInheritsDefaultStyleSettings = false;
  5. Deyan
    Admin
    Deyan avatar
    143 posts

    Posted 22 Dec 2014 Link to this post

    Hello Obuliraj Ramalingam,

    Thank you for contacting us.

    In order to achieve the effect shown in "expected-behavior---next-line-with-less-space.png" you may use the following code snippet:
    richTextEditor.Document.LineSpacingType = LineSpacingType.AtLeast;
    richTextEditor.Document.LineSpacing = 0;
    richTextEditor.Document.ParagraphDefaultSpacingAfter = 0;
    richTextEditor.Document.ParagraphDefaultSpacingBefore = 0;

    I hope this is helpful.

    Regards,
    Deyan
    the Telerik team
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
  6. Ramalingam
    Ramalingam avatar
    21 posts
    Member since:
    Apr 2014

    Posted 24 Dec 2014 in reply to Deyan Link to this post

    Hi,
    Thanks a lot for solution. It's working now.

    Thanks,
    Obuliraj Ramalingam
  7. Marcin Grabowski
    Marcin Grabowski avatar
    22 posts
    Member since:
    Nov 2009

    Posted 12 Dec 2016 Link to this post

    Hi,

    I have similar problem. When we bind RadRichTextBox with ViewModel (via HtmlDataProvider), the values of of Paragraph Before/After spacing is set to Auto and 5 pt. I try set it in SetupDocument event, but it`s not work. Any idea why? (I attach a file RichTextBoxParagraph.png)

    In ctr i set:

    #region Display Settings
     
                if (AgentPanelBusiness.Instance.EmailDisplaySettings != null && AgentPanelBusiness.Instance.EmailDisplaySettings.Count > 0)
                {
                    rtbMessageText.DocumentInheritsDefaultStyleSettings = true;
     
                    #region Font style, weight
     
                    DisplaySetting fontWeightSetting = AgentPanelBusiness.Instance.EmailDisplaySettings.FirstOrDefault(s => s.Name == "FontWeight");
                    if (fontWeightSetting != null)
                    {
                        switch (fontWeightSetting.Value)
                        {
                            case "Bold":
                                btnBold.IsChecked = true;
                                rtbMessageText.FontWeight = FontWeights.Bold;
                                break;
     
                            case "Normal":
                                btnBold.IsChecked = false;
                                rtbMessageText.FontWeight = FontWeights.Normal;
                                break;
                        }
                    }
     
                    DisplaySetting fontStyleSetting = AgentPanelBusiness.Instance.EmailDisplaySettings.FirstOrDefault(s => s.Name == "FontStyle");
                    if (fontStyleSetting != null)
                    {
                        switch (fontStyleSetting.Value)
                        {
                            case "Italic":
                                btnItalic.IsChecked = true;
                                rtbMessageText.FontStyle = FontStyles.Italic;
                                break;
     
                            case "Normal":
                                btnItalic.IsChecked = false;
                                rtbMessageText.FontStyle = FontStyles.Normal;
                                break;
                        }
                    }
     
                    #endregion Font style, weight
     
                    #region Font family
     
                    DisplaySetting fontFamilySetting = AgentPanelBusiness.Instance.EmailDisplaySettings.FirstOrDefault(s => s.Name == "FontFamily");
                    if (fontFamilySetting != null)
                    {
                        int fontFamilySelectedIndex = -1;
                        var fontItem = from Telerik.Windows.Documents.Layout.FontFamilyInfo fItem in cbFontFamily.Items select fItem;
                        if (fontItem != null)
                        {
                            foreach (var item in fontItem)
                            {
                                fontFamilySelectedIndex++;
                                if (item.DisplayName == fontFamilySetting.Value)
                                {
                                    cbFontFamily.SelectedItem = item;
                                    cbFontFamily.SelectedIndex = fontFamilySelectedIndex;
                                    rtbMessageText.FontFamily = new System.Windows.Media.FontFamily(fontFamilySetting.Value);
                                    break;
                                }
                            }
                        }
                    }
     
                    #endregion Font family
     
                    #region Font size
     
                    DisplaySetting fontSizeSetting = AgentPanelBusiness.Instance.EmailDisplaySettings.FirstOrDefault(s => s.Name == "FontSize");
                    if (fontSizeSetting != null)
                    {
                        int newFontSize;
                        if (int.TryParse(fontSizeSetting.Value, out newFontSize))
                        {
                            int fontSize;
                            int fontSizeSelectedIndex = -1;
                            var lItem = from RadComboBoxItem item in cbFontSize.Items select item;
                            if (lItem != null)
                            {
                                foreach (var item in lItem)
                                {
                                    fontSizeSelectedIndex++;
                                    if (int.TryParse(item.Content.ToString().Trim(), out fontSize))
                                    {
                                        if (fontSize == newFontSize)
                                        {
                                            cbFontSize.SelectedIndex = fontSizeSelectedIndex;
                                            double fSize;
                                            if (double.TryParse(item.Tag.ToString().Replace(".", ","), out fSize))
                                            {
                                                rtbMessageText.FontSize = fSize;
                                            }
                                            break;
                                        }
                                    }
                                }
                            }
                        }
                    }
     
                    #endregion Font size
     
                    DisplaySetting lineSpacingSetting = AgentPanelBusiness.Instance.EmailDisplaySettings.FirstOrDefault(s => s.Name == "LineSpacing");
                    if (lineSpacingSetting != null)
                    {
                        int lineSpacing;
                        if (int.TryParse(lineSpacingSetting.Value, out lineSpacing))
                        {
                            rtbMessageText.Document.LineSpacing = lineSpacing;
                            rtbMessageText.Document.Style.ParagraphProperties.LineSpacing = lineSpacing;
                            rtbMessageText.Document.Style.ParagraphProperties.LineSpacingType = LineSpacingType.AtLeast;
                        }
                    }
     
                    DisplaySetting spacingBeforeSetting = AgentPanelBusiness.Instance.EmailDisplaySettings.FirstOrDefault(s => s.Name == "SpacingBefore");
                    if (spacingBeforeSetting != null)
                    {
                        int spacingBefore;
                        if (int.TryParse(spacingBeforeSetting.Value, out spacingBefore))
                        {
                            rtbMessageText.Document.ParagraphDefaultSpacingBefore = spacingBefore;
                            rtbMessageText.Document.Style.ParagraphProperties.SpacingBefore = spacingBefore;
                            rtbMessageText.Document.Style.ParagraphProperties.AutomaticSpacingBefore = false;
                        }
                    }
     
                    DisplaySetting spacingAfterSetting = AgentPanelBusiness.Instance.EmailDisplaySettings.FirstOrDefault(s => s.Name == "SpacingAfter");
                    if (spacingAfterSetting != null)
                    {
                        int spacingAfter;
                        if (int.TryParse(spacingAfterSetting.Value, out spacingAfter))
                        {
                            rtbMessageText.Document.ParagraphDefaultSpacingAfter = spacingAfter;
                            rtbMessageText.Document.Style.ParagraphProperties.SpacingAfter = spacingAfter;
                            rtbMessageText.Document.Style.ParagraphProperties.AutomaticSpacingAfter = false;
                        }
                    }
                }
     
                #endregion Display Settings
     
                rtbMessageText.Commands.ToggleBoldCommand.ToggleStateChanged += (s, e) => { btnBold.IsChecked = e.NewValue; };
                rtbMessageText.Commands.ToggleItalicCommand.ToggleStateChanged += (s, e) => { btnItalic.IsChecked = e.NewValue; };
                rtbMessageText.Commands.ToggleUnderlineCommand.ToggleStateChanged += (s, e) => { btnUnderline.IsChecked = e.NewValue; };
                rtbMessageText.Commands.ToggleStrikethroughCommand.ToggleStateChanged += (s, e) => { btnStrikethrough.IsChecked = e.NewValue; };
                rtbMessageText.Commands.ChangeFontFamilyCommand.FontFamilyChanged += ChangeFontFamilyCommand_FontFamilyChanged;
                rtbMessageText.Commands.ChangeFontSizeCommand.FontSizeChanged += ChangeFontSizeCommand_FontSizeChanged;
                rtbMessageText.Commands.ToggleBulletsCommand.ToggleStateChanged += (s, e) => { btnToggleBullets.IsChecked = e.NewValue; };
                rtbMessageText.Commands.ToggleNumberedCommand.ToggleStateChanged += (s, e) => { btnToggleNumbered.IsChecked = e.NewValue; };
                rtbMessageText.Commands.ChangeTextAlignmentCommand.TextAlignmentChanged += ChangeTextAlignmentCommand_TextAlignmentChanged;
                DataContextChanged += SendEmailControl_DataContextChanged;

     

    SetupDocument event:

    LineSpacing is set to 0,

    SpacingBefore is set to 0,

    SpacingAfter is set to 0.

    e.Document.Style.ParagraphProperties.AutomaticSpacingAfter = false;
    e.Document.Style.ParagraphProperties.AutomaticSpacingBefore = false;
    e.Document.LineSpacingType = LineSpacingType.AtLeast;
     
    DisplaySetting lineSpacingSetting = AgentPanelBusiness.Instance.EmailDisplaySettings.FirstOrDefault(s => s.Name == "LineSpacing");
    if (lineSpacingSetting != null)
    {
        int lineSpacing;
        if (int.TryParse(lineSpacingSetting.Value, out lineSpacing))
        {
            e.Document.Style.ParagraphProperties.LineSpacing = lineSpacing;
            e.Document.LineSpacing = lineSpacing;
        }
    }
     
    DisplaySetting spacingBeforeSetting = AgentPanelBusiness.Instance.EmailDisplaySettings.FirstOrDefault(s => s.Name == "SpacingBefore");
    if (spacingBeforeSetting != null)
    {
        int spacingBefore;
        if (int.TryParse(spacingBeforeSetting.Value, out spacingBefore))
        {
            e.Document.Style.ParagraphProperties.SpacingBefore = spacingBefore;
            e.Document.ParagraphDefaultSpacingBefore = spacingBefore;
        }
    }
     
    DisplaySetting spacingAfterSetting = AgentPanelBusiness.Instance.EmailDisplaySettings.FirstOrDefault(s => s.Name == "SpacingAfter");
    if (spacingAfterSetting != null)
    {
        int spacingAfter;
        if (int.TryParse(spacingAfterSetting.Value, out spacingAfter))
        {
            e.Document.Style.ParagraphProperties.SpacingAfter = spacingAfter;
            e.Document.ParagraphDefaultSpacingAfter = spacingAfter;
        }
    }
     
    DisplaySetting leftIndentSetting = AgentPanelBusiness.Instance.EmailDisplaySettings.FirstOrDefault(s => s.Name == "LeftIndent");
    if (leftIndentSetting != null)
    {
        int leftIndent;
        if (int.TryParse(leftIndentSetting.Value, out leftIndent))
        {
            e.Document.Style.ParagraphProperties.LeftIndent = leftIndent;
        }
    }
     
    DisplaySetting rightIndentSetting = AgentPanelBusiness.Instance.EmailDisplaySettings.FirstOrDefault(s => s.Name == "RightIndent");
    if (rightIndentSetting != null)
    {
        int rightIndent;
        if (int.TryParse(rightIndentSetting.Value, out rightIndent))
        {
            e.Document.Style.ParagraphProperties.RightIndent = rightIndent;
        }
    }
     
    DisplaySetting textAligmentSetting = AgentPanelBusiness.Instance.EmailDisplaySettings.FirstOrDefault(s => s.Name == "TextAlignment");
    if (textAligmentSetting != null)
    {
        switch (textAligmentSetting.Value)
        {
            case "Left":
                e.Document.Style.ParagraphProperties.TextAlignment = Telerik.Windows.Documents.Layout.RadTextAlignment.Left;
                this.btnLeftText.IsChecked = true;
                break;
     
            case "Right":
                e.Document.Style.ParagraphProperties.TextAlignment = Telerik.Windows.Documents.Layout.RadTextAlignment.Right;
                this.btnRightText.IsChecked = true;
                break;
     
            case "Center":
                e.Document.Style.ParagraphProperties.TextAlignment = Telerik.Windows.Documents.Layout.RadTextAlignment.Center;
                this.btnCenterText.IsChecked = true;
                break;
     
            case "Justify":
                e.Document.Style.ParagraphProperties.TextAlignment = Telerik.Windows.Documents.Layout.RadTextAlignment.Justify;
                this.btnJustifyText.IsChecked = true;
                break;
        }
    }
     
    DisplaySetting fontColorSetting = AgentPanelBusiness.Instance.EmailDisplaySettings.FirstOrDefault(s => s.Name == "FontColor");
    if (fontColorSetting != null)
    {
        string hex = fontColorSetting.Value.Replace("#", "");
        byte a = 255;
        byte r = 255;
        byte g = 255;
        byte b = 255;
        int start = 0;
        if (hex.Length == 8)
        {
            a = byte.Parse(hex.Substring(0, 2), System.Globalization.NumberStyles.HexNumber);
            start = 2;
        }
        r = byte.Parse(hex.Substring(start, 2), System.Globalization.NumberStyles.HexNumber);
        g = byte.Parse(hex.Substring(start + 2, 2), System.Globalization.NumberStyles.HexNumber);
        b = byte.Parse(hex.Substring(start + 4, 2), System.Globalization.NumberStyles.HexNumber);
        e.Document.Style.SpanProperties.ForeColor = System.Windows.Media.Color.FromArgb(a, r, g, b);
    }

     

    Code for RadRichTextBox in XAML:

    <telerikHtmlProvider:HtmlDataProvider Name="htmlDataProvider" Html="{Binding MessageText, Mode=TwoWay}"
            RichTextBox="{Binding ElementName=rtbMessageText}" SetupDocument="htmlDataProvider_SetupDocument" >
        <telerikHtmlProvider:HtmlDataProvider.FormatProvider>
            <telerikHtmlProvider:HtmlFormatProvider>
                <telerikHtmlProvider:HtmlFormatProvider.ExportSettings>
                    <telerikHtmlMain:HtmlExportSettings DocumentExportLevel="Document" ImageExportMode="ImageExportingEvent" ImageExporting="HtmlExportSettings_ImageExporting" />
                </telerikHtmlProvider:HtmlFormatProvider.ExportSettings>
            </telerikHtmlProvider:HtmlFormatProvider>
        </telerikHtmlProvider:HtmlDataProvider.FormatProvider>
    </telerikHtmlProvider:HtmlDataProvider>
     
    <telerik:RadRichTextBox IsEnabled="{Binding IsNotBusy}" x:Name="rtbMessageText" Margin="4,2,4,4" AcceptsReturn="True" BorderThickness="0" MouseOverBorderThickness="0"
                    Grid.Row="1" ScrollViewer.HorizontalScrollBarVisibility="Auto"
                    VerticalScrollBarVisibility="Auto" IsSelectionMiniToolBarEnabled="False" Height="500"
                    IsSpellCheckingEnabled="{Binding EmailSpellCheckerEnabled}" PreviewEditorKeyDown="rtbMessageText_PreviewEditorKeyDown" />
  8. Mihail
    Admin
    Mihail avatar
    196 posts

    Posted 15 Dec 2016 Link to this post

    Hello Marcin,

    The reason why the paragraphs have auto spacing before and after is because they are imported from HTML format with the style "NormalWeb". All HTML paragraphs are imported with that style. In other words, you will need to modify the NormalWeb style in order to remove the unneeded spacing when importing from HTML. Here is an example of how this could be done: 
    StyleDefinition normalWebStyle = this.radRichTextBox.Document.StyleRepository.GetValueOrNull(RadDocumentDefaultStyles.NormalWebStyleName, true);
    normalWebStyle.ParagraphProperties.AutomaticSpacingBefore = false;
    normalWebStyle.ParagraphProperties.SpacingBefore = 0;
     
    normalWebStyle.ParagraphProperties.AutomaticSpacingAfter = false;
    normalWebStyle.ParagraphProperties.SpacingAfter = 0;

    I hope this information answers your question.

    Regards,
    Mihail
    Telerik by Progress
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  9. Marcin Grabowski
    Marcin Grabowski avatar
    22 posts
    Member since:
    Nov 2009

    Posted 16 Dec 2016 in reply to Mihail Link to this post

    Thank You Mihail, it works now.

    Best Regards,

    Grzegorz

Back to Top