How to display sometext with "...." in the grid column on resizing the custom cell element.?

5 posts, 0 answers
  1. Santosh
    Santosh avatar
    3 posts
    Member since:
    Jan 2012

    Posted 16 Feb 2012 Link to this post

    I have created a custom cell element column in the telerik RAD grid for windows.
    Custom column has two children 1)RadLabelElement 2)RadButtonElement.
    RadLabelElement displays text and RadButtonElement is clickable(to open some popup form)

    For example: My custom column will have something like : helloworld with a button besides it.

    But if i resize the column(decrease the column size), i want to have my "helloworld" text to appear with "hellowor...". But it is not happening. I found that "..." is behind the button element.

    But if make the button element visible false, i can see that "..." on resize of the column(decrease the size of the column).

    Could you please help me how to show "..." text along with the button element when the column is resized?

    Thanks
    Santosh.

     

     

     

     

  2. Svett
    Admin
    Svett avatar
    728 posts

    Posted 21 Feb 2012 Link to this post

    Hi Santosh,

    I am not able to assist you efficiently without sharing a code snippet that demonstrates how you implemented the custom cell. Hence, I can figure out what should be tweaked to accomplish the desired scenario.

    Regards,
    Svett
    the Telerik team
    Sharpen your .NET Ninja skills! Attend Q1 webinar week and get a chance to win a license! Book your seat now >>
  3. Santosh
    Santosh avatar
    3 posts
    Member since:
    Jan 2012

    Posted 23 Feb 2012 Link to this post

    Below is the code which i have used to create custom column.
    i will have a column in the grid containing some text and button besides it. 

    If column width is large enough, it displays the complete text and the button. 

    like "welcome" with button besides it.

    If column width is small then i want to display like the following:
    "welco..." with button besides it. ("..." is displayed as column size is less to hold the complete text.)




     public class LabelCellElement : GridDataCellElement
        {
          
            public LabelCellElement(GridViewColumn column, GridRowElement row)
                : base(column, row)
            {
            }

            private RadLabelElement radLabelElement;
            private RadButtonElement radButtonElement;

            protected override void CreateChildElements()
            {
                base.CreateChildElements();

                radLabelElement = new RadLabelElement();
                radLabelElement.Alignment = ContentAlignment.MiddleLeft;
                this.Children.Add(radLabelElement);
                radButtonElement = new RadButtonElement();
                //radButtonElement.Size = new System.Drawing.Size(10, 5);
                radButtonElement.Text = "click";
                radButtonElement.Margin = new System.Windows.Forms.Padding(20, 1, 3, 1);
                radButtonElement.Click += new EventHandler(radButtonElement_Click);
                this.Children.Add(radButtonElement);
                this.Children[0].Alignment = ContentAlignment.MiddleLeft;
                this.Children[1].Alignment = ContentAlignment.MiddleRight;
            }
            protected override void DisposeManagedResources()
            {
                radButtonElement.Click -= new EventHandler(radButtonElement_Click);
                base.DisposeManagedResources();
            }

            // Click event for radButtonElement
            void radButtonElement_Click(object sender, EventArgs e)
            {
                //some event
            }

            protected override Type ThemeEffectiveType
            {
                get
                {
                    return typeof(GridDataCellElement);
                }
            }
            public override bool IsCompatible(GridViewColumn data, object context)
            {
                return data is LabelColumn && context is GridDataRowElement;
            }
            protected override void SetContentCore(object value)
            {
                if (this.Value != null && this.Value != DBNull.Value)
                {
                    this.radLabelElement.Text = Convert.ToString(this.Value);
                }
            }
            protected override SizeF ArrangeOverride(SizeF finalSize)
            {
                if (this.Children.Count == 2)
                {
                    float progressBarWidth = finalSize.Width - radButtonElement.DesiredSize.Width;

                    RectangleF progressBarRect = new RectangleF(0, 0, progressBarWidth - 1, finalSize.Height);
                    RectangleF buttonRect = new RectangleF(progressBarWidth + 1, 0, radButtonElement.DesiredSize.Width, finalSize.Height);

                    this.Children[0].Arrange(progressBarRect);
                    this.Children[1].Arrange(buttonRect);
                }

                return finalSize;
            }
        }

        public class LabelColumn : GridViewTextBoxColumn
        {
            public LabelColumn(string columnName, string headerText, string fieldName)
                : base(columnName, headerText, fieldName)
            {
            }

            public override Type GetCellType(GridViewRowInfo row)
            {
                if (row is GridViewDataRowInfo)
                {
                    return typeof(LabelCellElement);
                }
                return base.GetCellType(row);
            }

        }

  4. Svett
    Admin
    Svett avatar
    728 posts

    Posted 24 Feb 2012 Link to this post

    Hi Santosh,

    You should change the layout of the LabelCellElement class. You can use the following code snippet to achieve the desired behavior:

    public class LabelCellElement : GridDataCellElement
    {
        private RadLabelElement radLabelElement;
        private RadButtonElement radButtonElement;
     
        public LabelCellElement(GridViewColumn column, GridRowElement row)
            : base(column, row)
        {
        }
     
        protected override Type ThemeEffectiveType
        {
            get
            {
                return typeof(GridDataCellElement);
            }
        }
     
        protected override void CreateChildElements()
        {
            base.CreateChildElements();
     
            this.radLabelElement = new RadLabelElement();
            this.radLabelElement.TextWrap = false;
            this.Children.Add(radLabelElement);
     
            radButtonElement = new RadButtonElement();
            radButtonElement.Text = "click";
            radButtonElement.Click += new EventHandler(radButtonElement_Click);
            this.Children.Add(radButtonElement);
        }
     
        protected override void DisposeManagedResources()
        {
            radButtonElement.Click -= new EventHandler(radButtonElement_Click);
            base.DisposeManagedResources();
        }
     
        public override bool IsCompatible(GridViewColumn data, object context)
        {
            return data is LabelColumn && context is GridDataRowElement;
        }
     
        protected override void SetContentCore(object value)
        {
            if (this.Value != null && this.Value != DBNull.Value)
            {
                this.radLabelElement.Text = Convert.ToString(this.Value);
            }
        }
     
        // Click event for radButtonElement
        void radButtonElement_Click(object sender, EventArgs e)
        {
            //some event
        }
     
        protected override SizeF MeasureOverride(SizeF availableSize)
        {
            if (this.Children.Count == 2)
            {
                this.Children[1].Measure(availableSize);
                availableSize.Width -= this.Children[1].DesiredSize.Width;
                this.Children[0].Measure(availableSize);
     
                float width = this.Children[0].DesiredSize.Width + this.Children[1].DesiredSize.Width;
                float height = Math.Max(this.Children[0].DesiredSize.Height, this.Children[1].DesiredSize.Height);
     
                return TableElement.ViewElement.RowLayout.ArrangeCell(new RectangleF(Point.Empty, availableSize), this).Size;
            }
     
            return base.MeasureOverride(availableSize);
        }
     
        protected override SizeF ArrangeOverride(SizeF finalSize)
        {
            if (this.Children.Count == 2)
            {
                float progressBarWidth = finalSize.Width - radButtonElement.DesiredSize.Width;
                RectangleF progressBarRect = new RectangleF(0, 0, progressBarWidth, finalSize.Height);
                RectangleF buttonRect = new RectangleF(progressBarWidth, 0, radButtonElement.DesiredSize.Width, finalSize.Height);
                this.Children[0].Arrange(progressBarRect);
                this.Children[1].Arrange(buttonRect);
                return finalSize;
            }
     
            return base.ArrangeOverride(finalSize);
        }
    }

    I hope this helps.

    Kind regards,
    Svett
    the Telerik team
    RadControls for WinForms Q1'12 release is now live! Check out what's new or download a free trial >>
  5. Santosh
    Santosh avatar
    3 posts
    Member since:
    Jan 2012

    Posted 02 Mar 2012 Link to this post

    Thank you Svett . It worked for me.
Back to Top