C# UserControl Draw outside of TableLayoutPanel cell - winforms

C# .Net 4.5 Winform
On my Form, I have a SplitContainer, and in the right panel, my custom UserControl with a TableLayoutPanel.
As I draw UserControl items in each cell of the TableLayoutPanel, I want to use DrawString to display text on the division of the current cell and the cell above it.
Currently:
The cells' UserControls are docked as 'fill' in each cell of the TableLayoutPanel.
protected override void OnLoad(EventArgs e)
{
base.OnLoad(e);
AutoScroll = false;
AutoSize = false;
Dock = DockStyle.Fill;
Margin = new Padding(0);
}
I offset the draw rectangle to be half it's height higher:
var topOffset = ClientRectangle.Top - (ClientRectangle.Height / 2);
paintRect = new Rectangle(ClientRectangle.X + Padding.Left,
topOffset + Padding.Top,
ClientRectangle.Width - Padding.Left - Padding.Right,
ClientRectangle.Height - Padding.Top - Padding.Bottom);
I create a new clipping region for graphics, and print out the text:
using (Graphics newGraphics = this.CreateGraphics())
{
newGraphics.SetClip(paintRect);
e.Graphics.SetClip(newGraphics);
e.Graphics.DrawString(
"ABCD 1234",
Font,
new SolidBrush(ForeColor),
paintRect, style);
}
The text gets cut off - see image
The cell UserControl that needs to display text (at it's top, halfway sticking into the control, and the TableLayoutPanel cell, above it. I think I need to change the clipping of those cells to not clip the text, but am unsuccessful.
How can I display the text 'outside' or 'on top' of the 'layer' that the TableLayoutPanel cell containing the UserControl is in, from within the UserControl OnPaint?

Related

UserControl with autosized form and flowpanel not resizing the height inside a splitpanel

I'm having some issues trying to adapt my project to use UserControls.
now I have this setup, and the height of my userControl is not auto resizing.
SplitPanel
SplitPanel.panel1
MyUserControl -> autosize true, dock top, achor top left
Form -> autosize true
Button -> dock top
FlowLayout -> dock top, leftToRight, autosize true
some elements: label, dropdown, button
SplitPanel.panel2
other stuffs
Full sized splitPanel
Resized split panel, control not resized
User Control full size
User control resized (flowLayout resized)
So, I found that the Control don't resize itself and I needed to resize myself when the flowPanel resizes:
private void flowLayoutPanel1_Resize(object sender, EventArgs e)
{
var pnl = (FlowLayoutPanel)sender;
pnl.Parent.Size = new Size(pnl.Width, pnl.Height + collapseButtonHeight);
}

How to get a one-to-one match of an Adorner with its adorned element within a ScrollViewer?

wpf
I have a control A, (an inkcanvas), within a Grid within a ScrollViewer. Conrol A is taller then the physical window, so the ScrollViewer correctly adds a vertical scroll bar and the entire control can be viewed by scrolling down. When attaching an Adorner with a control B, (another inkcanvas), to control A, scrolling downward shows the Adorner to be cut off at the bottom of the screen. That is, the Adorner is not completely covering the adorned element and/or is not extended downward when scrolling.
How do I get the Adorner (the control) to completely cover the adorned element and respect the ScrollViewer. (I need a one-to-one match between the pixels of the Adorner control and the adorned element within the ScrollViewer).
TIA
Edit#1: The key line in the Adorner that sets the background of the InkCanvas is
_inkcanvas.Background = CreateGrid();
public InkCanvasTextAdorner(InkCanvas element)
: base(element)
{
_element = element;
_visuals = new VisualCollection(this);
_inkcanvas = new InkCanvas();
_inkcanvas.Background = CreateGrid();
_visuals.Add(_inkcanvas);
AdornerLayer adornerLayer = AdornerLayer.GetAdornerLayer(element);
adornerLayer.Add(this);
}
If an InkCanvas is used (as the above) the Adorner's background is clipped at the bottom. The adorner control, however, does continue to the bottom of the adorned element.
However, if a Canvas is used instead of the InkCanvas, the Adorner's background does extend to the bottom of the adorned element.
What's wrong?
I'm guessing that the difference in the Background property expanding past the physical screen with the Canvas and not the InkCanvas may be because the Canvas inherits from Panel whereas the InkCanvas does not. Based on the finding that the Canvas background does do what I need, I find the below code does accomplish what I want--the canvas allows images from layers beneath it to be seen yet posts a grid of lines overwhich the InkCanvas will accept strokes. All is well :)
public InkCanvasTextAdorner(InkCanvas element)
: base(element)
{
_element = element;
// The VisualCollection has only one visual parent. I.e. InkCanvasTextAdorner is the parent to the VisualCollection.
// By overriding default rendering behavior of the VisualCollection, any kind of control and its children can be placed in the Adorner.
_visuals = new VisualCollection(this);
_inkcanvas = new InkCanvas();
_inkcanvas.Background = Brushes.Transparent;
_canvas = new Canvas();
_canvas.Background = CreateGrid();
_grid = new Grid();
_grid.Children.Add(_canvas);
_grid.Children.Add(_inkcanvas);
// The _grid is a logical child of the VisualCollection of the Adorner. The ArrangeOverride and MeasureOverride will set up the Grid control.
_visuals.Add(_grid); // Adding a single control for display.
// AdornerLayer adornerLayer = AdornerLayer.GetAdornerLayer(element);
AdornerLayer adornerLayer = AdornerLayer.GetAdornerLayer(element);
adornerLayer.Add(this);
}
Which looks like:

take a screenshot of WPF datagrid with scrollviewer

I'm trying to take a screenshot of a datagrid which has to many rows to be displayed. So there is a scrollviewer.
So when I just put the datagrid into the Render Method of RenderTargetBitmap I obviously just get the viewable part of the datagrid.
I read that one can take a screenshot of a content when actually rendering the ItemsPresenter of the ScrollViewer of that control, as the ItemsPresenter would have the "real" Width and Height of the content.
Unfortunatly my ScrollViewer doesnt have any different Height, ActualHeight or RenderSize.Height than the dataGrid.
So I always just get the visible part of the Content.
Anyone know how to do this the right way, that it actually takes the whole content ?
Code:
var scroll = GetTemplateChildByName(dataGridInOut);
if (scroll != null)
{
var item = scroll.Content as ItemsPresenter;
var width = item.RenderSize.Width;
var height = item.RenderSize.Height;
var rtb = new RenderTargetBitmap((int) Math.Round(width), (int)Math.Round(height), 96, 96,
PixelFormats.Pbgra32);
var drawingVisual = new DrawingVisual();
var visualBrush = new VisualBrush(item);
using (var context = drawingVisual.RenderOpen())
{
context.DrawRectangle(visualBrush, null, new Rect(new Point(0,0), new Size(width, height)));
}
rtb.Render(drawingVisual);
Clipboard.SetImage(rtb);
}
Leaf is right. You could instantiate another DataGrid bound to the same source programmatically, put it into a container which gives it infinite space, wait for it to render and then take a screenshot of this. No need to actually show it in the UI.

Auto size ElementHost to its content

I have a small WPF control that has a TextBlock with TextWrapping set to Wrap. I am trying to host this in an existing WinForms application. I have the ElementHost docked to the top of the form, and I would like to size the height of the ElementHost based on the height that the TextBlock require. Is there any way to accomplish this?
The resizing mechanism of WinForms is different from WPF's.
Have you tried setting the AutoSize property of the ElementHost to true?
I found the answer here
this is code from the link above:
public System.Windows.Size GetElementPixelSize(UIElement element)
{
Matrix transformToDevice;
var source = PresentationSource.FromVisual(element);
if (source != null)
transformToDevice = source.CompositionTarget.TransformToDevice;
else
using (var Hwndsource = new HwndSource(new HwndSourceParameters()))
transformToDevice = Hwndsource.CompositionTarget.TransformToDevice;
if (element.DesiredSize == new System.Windows.Size())
element.Measure(new System.Windows.Size(double.PositiveInfinity, double.PositiveInfinity));
return (System.Windows.Size)transformToDevice.Transform((Vector)element.DesiredSize);
}

How do I implement a tab control with vertical tabs in C#?

How do I implement a tab control with vertical tabs in C#?
Create an instance of System.Windows.Forms.TabControl (one of the standard container controls for Windows Forms) and set the Alignment property to Left.
First set in properties the Alignment property to Left.
Second set SizeMode property to Fixe.
Third set ItemSize property to prefered size example width :30 height :120.
After that you need to set the DrawMode property to OwnerDrawFixed.
Next step is define a handler for the DrawItem event of TabControl that renders the text from left to right.
Example
In form Designers.cs file
TabControl.DrawItem += new DrawItemEventHandler(tabControl_DrawItem);
Definition for tabControl_DrawItem method:
private void tabControl_DrawItem(Object sender, System.Windows.Forms.DrawItemEventArgs e)
{
Graphics g = e.Graphics;
Brush _textBrush;
// Get the item from the collection.
TabPage _tabPage = TabControl.TabPages[e.Index];
// Get the real bounds for the tab rectangle.
Rectangle _tabBounds = TabControl.GetTabRect(e.Index);
_textBrush = new System.Drawing.SolidBrush(Color.Black);
// Use our own font.
Font _tabFont = new Font("Arial", (float)12.0, FontStyle.Bold, GraphicsUnit.Pixel);
// Draw string. Center the text.
StringFormat _stringFlags = new StringFormat();
_stringFlags.Alignment = StringAlignment.Center;
_stringFlags.LineAlignment = StringAlignment.Center;
g.DrawString(_tabPage.Text, _tabFont, _textBrush, _tabBounds, new StringFormat(_stringFlags));
}
Effect:Ready horizontal tabcontrol
I was based on https://msdn.microsoft.com/en-us/library/ms404305(v=vs.110).aspx

Resources