EditControl as a Grid Cell

[Matt Anderson]

Do you have any examples of using the Syncfusion Edit control as a cell in a Syncfusion Grid? I have this working in-part using a custom cell model and cell renderer, but there are some painting issues I''m having with the Edit control that I have not been able to resolve. Specifically, when the Edit control is used to draw a cell''s contents, the top section of the Edit control does not paint properly until the cell gains focus. Then, when the cell loses focus, the top part of the Edit control is again not painted. I would appreciate any thoughts or sample code. I have included a zip file with the sample project. Thanks for your help. Matt EditControlSample_6250.zip

[Administrator]

Here is your sample back with a few changes. To have a cell control that has an active edit state, you normally need to have two controls in the renderer, one to draw the static state, and the other to draw the active state. Consider what happens when you are editing the cell and scroll the grid. Both the editing cell and any other cells that use this control may need to be drawn. You cannot just the same control from the editing cell to do this. This is why you generally have two controls in this situation. In the Grid\Samples\CellTypes folder, the Slider and Calendar cells use this technique. The changes in your code work at adding the second control. (This sample changes is just an initial try, there may be other things that needs to be addressed as well). EditControlSample_4308.zip

[Matt Anderson]

Thank you for the guidance and the updated sample. I had noticed the use of two controls in other samples, but I was unclear about the purpose, so thanks for providing more information.

Also, in the updated sample, there is still an area at the top of the Edit control that is not being drawn correctly for non-focus cells. I know that this is somewhat minor, but, if possible, I would like to get the cell to look as close to the other text cells as possible. Is there a way to addresss this UI issue?

Thanks again,

Matt

[Administrator]

I think there must be a little piece of the EditControl''s clientarea that the EditControl is not paiting with it''s backcolor, and it is showing up in this situation as the Control gray color.

One way to avoid this is to paint this area your self after the call to the base class OnDraw.

base.OnDraw (g, controlRectangle, rowIndex, colIndex, style);
using(SolidBrush br = new SolidBrush(Color.White))
{
	g.FillRectangle(br, controlRectangle.X, controlRectangle.Y , controlRectangle.Width, 3);
}
            

[Matt Anderson]

Thanks Clay. Painting the client area in this way works okay for empty cells, but it will cause the top of "tall" letters in the cell to be over-drawn, if any are present.

Based on some further testing, it appears that the Edit control is drawing the top part of a 3D border in gray when the control is not in focus.

Since this painting problem does not happen when the Edit control is used outside of the Grid with a BorderStyle = None, I''m wondering if there is something else that I should be doing in the renderer to address this.

Once again, I appreciate your help and any further suggestions.

Matt

[Administrator]

I am at a loss here. I tried about every thing I could think of before suggesting drawing over the gray. Everything I tried to adjust for some kind of border just shifted the gray down. It would not cover it. I think it has something to do with how the EditControl is drawing itself in this case.

These problems don''t exist if you use a RichText control in the cell. I assume there is something in teh EditControl that you need that is not in the RichText control?

[Matt Anderson]

I could probably use the RichTextBox control, but I was hoping to take advantage of the syntax color highlighting and intellisense support in the Edit control rather than having to roll my own.

How do you think I should proceed at this point? Should I post a message to the Edit control Forum or otherwise get in touch with the Edit control team?

Thanks,
Matt

[Administrator]

You should submit a Direct Trac support incident, but I am not sure if this is something we can help you with at this point.

[Sue Harris]

I used the sample provided by Clay above as the basis for adding the Edit control to my grid cell types. However, I''ve got a problem (I think it may have been introduced when I upgraded to 3.2.1.0) where I can''t navigate in the edit (ie if you are editing something in an edit cell, the arrow keys move you around the grid, and not the edit cell as expected).

Any suggestions what I can do?

Thanks,
Sue

[Administrator]

You can try overriding the ProcessKeyEventArgs in the renderer, and handle the keys there.

protected override bool ProcessKeyEventArgs(ref Message m)
{
	Keys keyCode = (Keys)((int)m.WParam) & Keys.KeyCode;
	if(m.Msg == 256 && //keydown
		(keyCode == Keys.Down || keyCode == Keys.Up || 
		keyCode == Keys.Left || keyCode == Keys.Right )) 
	{
		switch (keyCode)
		{
			case Keys.Left:
				if(this.activeEditControl.CurrentColumn > 1)
					this.activeEditControl.CurrentColumn -= 1;
				break;
			case Keys.Right:
				if(this.activeEditControl.CurrentColumn <= this.activeEditControl.Text.Length)
					this.activeEditControl.CurrentColumn += 1;
				break;
			case Keys.Up:
				break;
			case Keys.Down:
				break;
		}
		this.activeEditControl.ScrollToViewCaret();
		return true;
	}
	return base.ProcessKeyEventArgs (ref m);
}

[Sue Harris]

Hi, I''m relooking at embedding an EditControl as a grid cell in the 4.1 release (I gave up for awhile after the 3.something version where the EditControl was complete rewritten). I''ve almost got it working but I''ve got a few problems. a ) The example you gave for moving in the cell works, but I couldn''t get the Up and Down keys working when the context choice or prompt was open. b ) The font look different when I''m editing the cell even though I thought I''d set the edit control to use the same font as the cell renderer c ) When I''ve got a context choice/prompt open and I hit Esc to close it, I end up with an Esc character in the editor d ) moving within the grid with the arrow keys don''t work (probably partially because of point a and the fact that my renderer does handle editing/nonediting) e ) often when I''m editing I get an irritating disabled scroll bar in the cell (up/down on the right) (enlarge the window of the sample to see) f ) after editing one of the editcontrol cells, closing the form I get a Save Changes message box Can you please help me sort some of these problems out? I''ve attached my trial application. Thanks, Sue

GridEditCell.zip

[stanleyj]

Hi Sue,

We are looking these issues and will update you with details.

e) The scroll bars are not seen on maximizing the windows. How do you see it?
f) Setting SaveOnClose to false in GridEditControl.cs will avoid Save Changes message box.

Regards,
Stanley

[Sue Harris]

Hi,

I accidentally made point e hard to reproduce in cleaning up, but it appears to be related to the cell height. If you reduce the height of one of the rows and click in the EditControl cell of that row, and then on another row, you should see it (the app does need to be maximized though).

Also, do you have any ideas why there is a fairly noticable delay between the application starting and the grid painting for the first time? I think it has something to do with the EditControl cells but I couldn''t see any slow appearing code.

Thanks,
Sue

[Administrator]

Hi Sue, a) You can handle this in the Renderer.ProcessKeyEventArgs. There is a method in editcontrol that process keys.

 if (m.Msg == 256 && //keydown
	(keyCode == Keys.Down || keyCode == Keys.Up ||
	keyCode == Keys.Left || keyCode == Keys.Right))
	{
          // *** Added to handle ArrowKeys...
               this._activeEditControl.KeyBinder.ProcessKey(keyCode);

b) Please refer this KB on how to set the Font, colors for EditControl. How do I change the font settings of the Formats in the EditControl programmatically ? I have modified your sample accordingly. Please look for 2. Setting font. c) Again this can be handled in the ProcessKeyEventArgs override.

          // *** 3. Handling ''Esc'' key
             if(keyCode == Keys.Escape)
                  return true;

d) This could be possible by knowing the excat poistion of caret and controlling the arrow keys. We will consult Edit team and will get back to you with more details. e) We will consult edit team to see if there are options to disable scrollbar. Here is the modified sample. GridEditCell.zip Thanks, Jay

[Sue Harris]

Hi,

Point a still doesn''t seem to work. After typing the ''('' after a function the context prompt doesn''t respond to the up/down keys (it should scroll through the function descriptions), likewise with the context function list after the ''this.''.

As for point c - I ended up putting that fix in for all key down messages after I discovered the del key also didn''t seem to work. The solution looks perfect - can you think of any keys which shouldn''t be handled like that?

Thanks,
Sue

[Administrator]

Hi Sue,
Since Grid hosts the EditControl inside the cell, it will use the keys like ''Navigation keys'' to move between the cells and will not pass on to the EditControl. So if the EditControl (CurrentCell) is in focus, we need to programmatically do the required functions. I could see StreamEditControl.OnKeyDown process the keys and sends to appropriate controllers. To get this working smoothly, we need public methods to call those.

But one way you could try is, Without processing any keys in EditControlCellRenderer.ProcessKeyEventArgs, if you could set the Grid.WantKeys flag in OnInitialize override and reset it back to true in OnSaveChanges, Grid will not process any of the keys when the cell is in focus.

	protected override void OnInitialize(int rowIndex, int colIndex)
		{
            this.m_handleChanges = false;
            this.Grid.WantKeys = false;

		protected override bool OnSaveChanges()
		{
			if (CurrentCell.IsModified)
			{
				this.ControlText = this.m_changedValue;
				this.ControlValue = this.m_changedValue;
			}
            this.Grid.WantKeys = true;

If this won''t serve your needs, I will discuss with the Edit team to see whether they can expose these methods.

Also can you please open a Direct-Trac incident, it would be easy to track the issue.

Thanks,
Jay