This is a migrated thread and some comments may be shown as answers.

Custom Control - Image Position

2 Answers 115 Views
GridView
This is a migrated thread and some comments may be shown as answers.
devoas
Top achievements
Rank 1
devoas asked on 24 Oct 2011, 03:15 PM
Hi,

I was trying to write a custom column having textbox and an image to be useds as lookup column. I tried  following code and it work perfectly except the image did not appear in center. Please advise.

    void radGridView1_CellEditorInitialized(object sender, Telerik.WinControls.UI.GridViewCellEventArgs e)
    {
        if (e.Column.Name == "Lookup")
        {
            RadImageItem imgElement;
            imgElement = new RadImageItem();
            imgElement.Margin = new Padding(0, 2, 0, 0);
            imgElement.Alignment = ContentAlignment.MiddleCenter;
            imgElement.Image = Properties.Resources.hd_find.ToBitmap();
            //imgElement.MinSize = new Size(20, 5);
            imgElement.Size = new Size(50, 5);
            imgElement.AutoSize = false;
            //imgElement.AutoSizeMode = RadAutoSizeMode.FitToAvailableSize;
 
            this.radGridView1.CurrentCell.Children.Add(imgElement);
 
                if (!tbSubscribed)
                {
                         
                    RadTextBoxEditor tbEditor = this.radGridView1.ActiveEditor as RadTextBoxEditor;
                    if (tbEditor != null)
                    {
 
                    tbSubscribed = true;
                    RadTextBoxEditorElement tbElement = (RadTextBoxEditorElement)tbEditor.EditorElement;
                    tbElement.KeyDown += new KeyEventHandler(tbElement_KeyDown);
                }
            }
        }
    }
 
    void radGridView1_CellEndEdit(object sender, GridViewCellEventArgs e)
    {
        if (e.Column.Name == "Lookup")
        {
            if (this.radGridView1.CurrentCell.Children.Count == 1)
            {
                this.radGridView1.CurrentCell.Children.RemoveAt(0);
            }
        }
    }
    void tbElement_KeyDown(object sender, KeyEventArgs e)
    {
        if (e.KeyCode == Keys.F1)
        {
            ((RadTextBoxEditorElement)sender).Text = "Default text";
        }
 
     
    }
 
    void radGridView1_CreateCell(object sender, Telerik.WinControls.UI.GridViewCreateCellEventArgs e)
    {
        if (e.Row is GridDataRowElement)
        {
            if (e.Column.Name == "Lookup")
            {
                e.CellType = typeof(RadTextBoxExtCellElement);
            }
        }
    }
 
 
 
 
public class RadTextBoxExtCellElement : GridDataCellElement
{
    private int imageWidth = 30;
    private int imagePadding = 2;
 
    public RadTextBoxExtCellElement(GridViewColumn column, GridRowElement row)
        : base(column, row)
    {
    }
 
 
 
    protected override Type ThemeEffectiveType
    {
        get
        {
            return typeof(GridDataCellElement);
        }
    }
 
 
 
    protected override SizeF ArrangeOverride(SizeF finalSize)
    {
        base.ArrangeOverride(finalSize);
        if (this.Children.Count == 2)
        {
            RectangleF rect = GetClientRectangle(finalSize);
            RectangleF rectEdit = new RectangleF(rect.X, rect.Y, rect.Width - (imageWidth + imagePadding), rect.Height);
            RectangleF rectImage = new RectangleF(rectEdit.Right + imagePadding, rect.Y, imageWidth, rect.Y);
            this.Children[0].Arrange(rectEdit);
            this.Children[1].Arrange(rectImage);
        }
 
        return finalSize;
    }

Thanks,
devoas

2 Answers, 1 is accepted

Sort by
0
Emanuel Varga
Top achievements
Rank 1
answered on 26 Oct 2011, 07:43 AM
Hello Devoas,

What do you mean by did not appear in the center? That image is much bigger than the cell, please try to set a thumb of that image to see if that is what you need, like so:
imgElement.Image = Properties.Resources.hd_find.GetThumbnailImage(15, 15, null, IntPtr.Zero);

Or did i misunderstood the problem... If you just need to move it up or down, you should do that in the ArrangeOverride of the cell by taking into consideration also the size of the image inside the child element and creating that rect accordingly.

Hope this helps, if you have any other questions or comments, please let me know,

Best Regards,
Emanuel Varga

Telerik WinForms MVP
0
devoas
Top achievements
Rank 1
answered on 26 Oct 2011, 12:44 PM
Dear Emaneul

Thanks alot for your reply and it is working properly.

I just want to confirm that if I define the size of image and set its autosize mode = filltoavailable size it should shrink automatically or not.
I have also tested stretch Horizontal and stretch Vertical properties but no effect. 

Another thing i noticed that there is no effect on image vertical position or size with following code in ArrangeOverride method

RectangleF rectImage = new RectangleF(rectEdit.Right + imagePadding, rect.Y, imageWidth, rect.Y)

Here I gradually reduce the rectangle height and  finally set rectangle with no height coz start and and end height is same but no change. 

Please advise

Thanks,
devoas.





Tags
GridView
Asked by
devoas
Top achievements
Rank 1
Answers by
Emanuel Varga
Top achievements
Rank 1
devoas
Top achievements
Rank 1
Share this question
or