How to draw moving axis table - c#

I'm trying to draw an axis table (x-y) in WPF from code-behind; and I want to give it drag and drop option which can see more of the axis table.
I had created static axis but I don't know how to create a dynamic one?
Can anybody help me with this stuff ?
Thanks.
for (int i = 10; i < 400; i+=10)
{
Line a = new Line();
a.X1 = 0;
a.Y1 = i;
a.X2 = canGraph.Width;
a.Y2 = a.Y1;
a.Stroke = System.Windows.Media.Brushes.Black;
a.StrokeThickness = 0.5;
canGraph.Children.Add(a);
Line b = new Line();
b.X1 = i;
b.Y1 = 0;
b.X2 = i;
b.Y2 = canGraph.Height;
b.Stroke = System.Windows.Media.Brushes.Black;
b.StrokeThickness = 0.5;
canGraph.Children.Add(b);
if (i % 50 == 0)
{
a.StrokeThickness = 1;
b.StrokeThickness = 1;
}
if (i == 200)
{
a.StrokeThickness = 2;
b.StrokeThickness = 2;
}
}

This should get you started. Add event handler(s) to your main axis and canGraph -
...
if (i == 200)
{
a.StrokeThickness = 2;
b.StrokeThickness = 2;
a.MouseLeftButtonDown += A_MouseLeftButtonDown;
}
}
canGraph.MouseLeftButtonUp += CanGraph_MouseLeftButtonUp;
canGraph.MouseMove += CanGraph_MouseMove;
Add following methods -
Line _selectedAxis = null;
private void CanGraph_MouseMove(object sender, MouseEventArgs e)
{
if (_selectedAxis != null)
{
var line = _selectedAxis;
var pos = e.GetPosition(line);
textBlock.Text = $"({pos.X}, {pos.Y})";
line.Y1 = pos.Y;
line.Y2 = pos.Y;
}
}
private void CanGraph_MouseLeftButtonUp(object sender, MouseButtonEventArgs e)
{
_selectedAxis = null;
}
private void A_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
{
var line = sender as Line;
_selectedAxis = line;
}
Now hold you main horizontal axis and drag it.
You can do the same for vertical axis as well.
For Zooming
Initialize canGraph.RenderTransform with ScaleTransform and subscribe to MouseWheel event. Note RenderTransformOrigin is set to (0.5, 0.5) to zoom from center instead of top left (default) -
canGraph.RenderTransformOrigin = new Point(0.5, 0.5);
canGraph.RenderTransform = new ScaleTransform();
canGraph.MouseWheel += CanGraph_MouseWheel;
And the function -
private void CanGraph_MouseWheel(object sender, MouseWheelEventArgs e)
{
var transform = canGraph.RenderTransform as ScaleTransform;
var factor = transform.ScaleX;
factor += (e.Delta > 0 ? 1 : (factor == 1 ? 0 : -1));
transform.ScaleX = factor;
transform.ScaleY = factor;
}

I'm guessing you have added Line type object to draw axes, then gave it to window content.
Then just add events, like MouseLeftButtonDown event, or MouseMove event.Add appropriate methods.
Change your object positions on MouseMove event, like:
(For a certain line)
private void MouseMoveMethod(object sender, MouseEventArgs e)
{
var obj = sender as Line;
obj.X1 = e.GetPosition(this).X; //Line start x coordinate
obj.Y1 = e.GetPosition(this).Y; //Line start y coordinate
...
}

Related

how to determine the mouse pointer is on tablelayoutpanel cell border c#

I have TableLayoutPanel on windows form. I want mouse pointer cursor style is cross when the pointer on/near the cell border.
Edit I tried with mouse move event. I get the cell positions where the mouse point is moving.But I couldn't use this information and I was stuck. How can achieve that?
Edit: I fixed the problem. It is about size type. The code is working. I'm sharing it for those who have similar demands. Thanx.
bool calcCells = false;
List<float> XCoordinates = new List<float>();
List<float> YCoordinates = new List<float>();
public Form3()
{
InitializeComponent();
// Set the DoubleBuffered property via reflection (if needed)
var flags = BindingFlags.Instance | BindingFlags.NonPublic;
tlp1.GetType().GetProperty("DoubleBuffered", flags).SetValue(tlp1, true);
tlp1.Layout += tlp1_Layout;
tlp1.CellPaint += tlp1_CellPaint;
tlp1.MouseMove += tlp1_MouseMove;
}
// Added the x coordinates of cell borders in a List
private void CreateXCoordinateList()
{
XCoordinates.Clear();
// first and last column sizetype is SizeType.Absoulute.
float tlpWidth = tlp1.Width- tlp1.ColumnStyles[0].Width - tlp1.ColumnStyles[tlp1.ColumnCount-1].Width;
float x = 0;
for (int i = 0; i < tlp1.ColumnCount; i++)
{
if(tlp1.ColumnStyles[i].SizeType==SizeType.Absolute)
x += tlp1.ColumnStyles[i].Width;
else if(tlp1.ColumnStyles[i].SizeType == SizeType.Percent)
{
double k = tlpWidth * tlp1.ColumnStyles[i].Width * 0.01;
x += Convert.ToSingle(k);
}
XCoordinates.Add(x);
}
}
// Added the y coordinates of cell borders in a List
private void CreateYCoordinateList()
{
YCoordinates.Clear();
// first and last row sizetype is SizeType.Absoulute.
float tlpHeight = tlp1.Height - tlp1.RowStyles[0].Height - tlp1.RowStyles[tlp1.RowCount - 1].Height;
float y = 0;
for (int i = 0; i < tlp1.RowCount; i++)
{
if (tlp1.RowStyles[i].SizeType == SizeType.Absolute)
y += tlp1.RowStyles[i].Height;
else if (tlp1.RowStyles[i].SizeType == SizeType.Percent)
{
double k = tlpHeight * tlp1.RowStyles[i].Height*0.01;
y += Convert.ToSingle(k);
}
YCoordinates.Add(y);
}
}
private void tlp1_Layout(object sender, LayoutEventArgs e) => calcCells = true;
private void tlp1_CellPaint(object sender, TableLayoutCellPaintEventArgs e)
{
if (calcCells)
{
CreateXCoordinateList();
CreateYCoordinateList();
if (e.Column == tlp1.ColumnCount - 1 &&
e.Row == tlp1.RowCount - 1)
calcCells = false;
}
}
private void tlp1_MouseMove(object sender, MouseEventArgs e)
{
//Comparing the mouse pointer position with the cellborder coordinates,
//if the difference is less than and equal to 4, change the cursor style.
float x = e.Location.X;
float y = e.Location.Y;
if (MouseNearCellBorderXAxis(e) || MouseNearCellBorderYAxis(e))
tlp1.Cursor = Cursors.Cross;
else
tlp1.Cursor = Cursors.Default;
}
private bool MouseNearCellBorderXAxis(MouseEventArgs e)
{
float x = e.Location.X;
for (int i = 0; i < XCoordinates.Count; i++)
{
float Border = XCoordinates[i];
double difference = Math.Abs(x - Border);
if (difference <= 4)
return true;
}
return false;
}
private bool MouseNearCellBorderYAxis(MouseEventArgs e)
{
float y = e.Location.Y;
for (int i = 0; i < YCoordinates.Count; i++)
{
float Border = YCoordinates[i];
double difference = Math.Abs(y - Border);
if (difference <= 4)
return true;
}
return false;
}
If I get what you're asking, provided you have controls in the cells of the TableLayoutPanel all one would have to do is set the different cursors one time for:
Main form (Arrow)
Table layout panel (Cross)
The controls therein contained (e.g. Hand)
Everything else should happen on its own.
public MainForm()
{
InitializeComponent();
// MainForm has ARROW
this.Cursor = Cursors.Arrow;
// TableLayoutPanel has CROSS
tableLayoutPanel.Cursor = Cursors.Cross;
int key = 0; string text;
for (int column = 0; column < tableLayoutPanel.ColumnCount; column++)
for (int row = 0; row < tableLayoutPanel.RowCount; row++)
{
switch (++key)
{
case 10: text = "*"; break;
case 11: text = "0"; break;
case 12: text = "#"; break;
default: text = $"{key}"; break;
}
tableLayoutPanel.Controls.Add(new Label
{
BackColor = Color.LightGreen,
Anchor = (AnchorStyles)0xF,
Margin = new Padding(10),
Text = text,
TextAlign = ContentAlignment.MiddleCenter,
// Controls in the table have HAND
Cursor = Cursors.Hand,
});
}
}

Line (Crosshair) in WPF not updating when coordinates are updated with mouse move event - C#

I'm trying to create a cross-hair out of two lines on a WPF canvas.
I'm finding that when I initialize the lines they draw correctly.
But when I update the coordinates of the lines using the mouse move event, the lines are not updating.
Why are the lines not updating when the coordinates of the point `currentMousePoint are updated?
public CADControl()
{
InitializeComponent();
}
//(500, 500) added just to test the lines appear which they do.
private Point currentMousePoint = new Point(500,500);
private void CadCanvas_MouseMove(object sender, MouseEventArgs e)
{
currentMousePoint = e.GetPosition(this);
//coordinates appear to update correctly in the console
Console.WriteLine("x: " + currentMousePoint.X + " y: " + currentMousePoint.Y);
InvalidateVisual();
UpdateLayout();
}
private double screenWidth;
private double screenHeight;
private void DrawCursorCrosshair()
{
screenWidth = CadCanvas.ActualWidth;
screenHeight = CadCanvas.ActualHeight;
Line horizontalLine = new Line();
horizontalLine.Stroke = Brushes.White;
horizontalLine.X1 = 0;
horizontalLine.X2 = screenWidth;
horizontalLine.Y1 = currentMousePoint.X;
horizontalLine.Y2 = currentMousePoint.X;
CadCanvas.Children.Add(horizontalLine);
Line verticalLine = new Line();
verticalLine.Stroke = Brushes.White;
verticalLine.X1 = currentMousePoint.X;
verticalLine.X2 = currentMousePoint.X;
verticalLine.Y1 = 0;
verticalLine.Y2 = screenHeight;
CadCanvas.Children.Add(verticalLine);
}
private void CadCanvas_Loaded(object sender, RoutedEventArgs e)
{
DrawCursorCrosshair();
}
You need to store the reference to your lines and update them in the MouseMove event handler:
private Line _v;
private Line _h;
add in DrawCursorCrosshair:
_h = horizontalLine;
_v = verticalLine;
and in CadCanvas_MouseMove (after currentMousePoint is updated):
Canvas.SetLeft(_v, currentMousePoint.X);
Canvas.SetTop(_h, currentMousePoint.Y);
and set a static position to the lines in DrawCursorCrosshair:
verticalLine.X1 = 0;
verticalLine.X2 = 0;
horizontalLine.Y1 = 0;
horizontalLine.Y2 = 0;

How to change parameter continuously in Paint event

I make a program for interactively display the foot pressure.
Bigger pressure is indicated by bigger diameter of the ellipse.
I work on the label's Paint events.
Here is the event handler:
private void labelGrad2_Paint(object sender, PaintEventArgs e)
{
GraphicsPath gp = new GraphicsPath();
int weight_forefoot_left;
weight_forefoot_left = Convert.ToInt32( l_press05 + l_press06 + l_press07); // summing forefoot pressure sensors
size_pressure_forefootLeft = (weight_forefoot_left * 2 ); //2 is based on trial and error for display only
//protection diameter
if (size_pressure_forefootLeft == 0 ){
size_pressure_forefootLeft = 1;
}
if (size_pressure_forefootLeft > 26) {
size_pressure_forefootLeft = 26; //protection diameter display
}
//---variable sizing---------
labelGrad_forefoot_left.Font = new Font("MS UI Gothic", size_pressure_forefootLeft);
int x_forefoot = (pictureBox_CoP.Location.X - (labelGrad_forefoot_left.Size.Width / 2)) + 58; //location of left x corner in pictureBox_CoP
int y_forefoot = (pictureBox_CoP.Location.Y - (labelGrad_forefoot_left.Size.Height / 2)) + 100; //location of left y corner in pictureBox_CoP
labelGrad_forefoot_left.Location = new Point(x_forefoot, y_forefoot);
labelGrad_forefoot_left.BackColor = Color.White;
gp.AddEllipse(labelGrad_forefoot_left.ClientRectangle);
PathGradientBrush pgb = new PathGradientBrush(gp);
pgb.CenterPoint = new PointF(labelGrad_forefoot_left.ClientRectangle.Width / 2,
labelGrad_forefoot_left.ClientRectangle.Height / 2);
pgb.CenterColor = Color.Red;
pgb.SurroundColors = new Color[] { Color.Blue};
pgb.SetBlendTriangularShape(.5f, 1.0f);
pgb.FocusScales = new PointF(0f, 0f);
e.Graphics.FillPath(pgb, gp);
pgb.Dispose();
gp.Dispose();
}
private void timer1_Tick(object sender, EventArgs e)
{
size_pressure_forefootLeft = trackBar1.Value;
textBox4.Text = Convert.ToString( size_pressure_forefootLeft);
this.Invalidate();
this.Update();
}
I need to change variable "size_pressure_forefootLeft" continuously.
I have tried using timer event but timer event do not have PaintEventArgs, there is an error in line e.Graphics.FillPath(pgb, gp).
How to handle this?

how to freeze the chart while updating continuously in c#

I am using chart control in my c# application.Using timer updating values in chart at every 1 seconds.Also i enabled scroll bar for the chart , so the scroll bar is keep on adjusting while the values are adding. Actually my requirement is if i drag the scroll bar and hold at any point it has to freeze at that particular point only.It should not adjust when ever i drag and hold the scroll bar at the particular point.How to do that ? Please refer the code below,
int x1=10, x2=10, y1=10, y2=10; //globally declared
private void button1_Click(object sender, EventArgs e) //chart preparation in button click
{
chart1.Series.Clear();
series1.MarkerStyle = MarkerStyle.Circle;
series1.MarkerColor = Color.BlueViolet;
series1.MarkerSize = 7;
series1.Color = System.Drawing.Color.Green;
series1.IsXValueIndexed = true;
series1.YAxisType = AxisType.Primary;
series1.ChartType = SeriesChartType.Line;
this.chart1.Series.Add(series1);
series2.MarkerStyle = MarkerStyle.Circle;
series2.MarkerColor = Color.Orange;
series2.MarkerSize = 7;
series2.Color = System.Drawing.Color.Purple;
series2.IsXValueIndexed = true;
series2.YAxisType = AxisType.Secondary;
series2.ChartType = SeriesChartType.Line;
this.chart1.Series.Add(series2);
chart1.ChartAreas[0].CursorX.AutoScroll = true;
chart1.ChartAreas[0].CursorY.AutoScroll = true;
chart1.ChartAreas[0].AxisX.ScrollBar.Size = 15;
chart1.ChartAreas[0].AxisX.ScrollBar.ButtonStyle = ScrollBarButtonStyles.All;
chart1.ChartAreas[0].AxisX.ScrollBar.IsPositionedInside = false;
chart1.ChartAreas[0].AxisX.ScrollBar.Enabled = true;
chart1.ChartAreas[0].AxisX.ScaleView.Zoomable = true;
chart1.Series[0].Points.AddXY(x1, y1);
chart1.Series[1].Points.AddXY(x2, y2);
chart1.ChartAreas[0].AxisX.ScaleView.Position = chart1.ChartAreas[0].AxisX.Minimum;// scrollPosition;
chart1.ChartAreas[0].AxisX.ScaleView.Zoom(chart1.ChartAreas[0].AxisX.Maximum - nCheck, chart1.ChartAreas[0].AxisX.Maximum);
x1 += 1;
x2 += 1;
nlength++;
if (nlength == 25)
{
nCheck = 30;
chart1.Update();
}
else if (nlength == 50)
nCheck = 50;
timer1.Start();
}
public void createGraph() //called in timer
{
chart1.Series[0].Points.AddXY(x1, y1);
chart1.Series[1].Points.AddXY(x2, y2);
chart1.ChartAreas[0].AxisX.ScaleView.Position = chart1.ChartAreas[0].AxisX.Minimum;// scrollPosition;
chart1.ChartAreas[0].AxisX.ScaleView.Zoom(chart1.ChartAreas[0].AxisX.Maximum - nCheck, chart1.ChartAreas[0].AxisX.Maximum);
x1 += 1;
x2 += 1;
nlength++;
if (nlength == 25)
{
nCheck = 30;
chart1.Update();
}
else if(nlength == 50)
nCheck = 50;
}
private void chart1_AxisScrollBarClicked(object sender, ScrollBarEventArgs e)
{
chart1.ChartAreas[0].CursorX.AutoScroll = false;
chart1.ChartAreas[0].CursorY.AutoScroll = false; //here i need to update some code i think so ...
}
As long as the minimum and maximum of an axis is not set, it will auto-adjust to data. Here is an example where a start of user selection fixes the range of x-axis to current view and applies the selection as zoom and frees the axis range again when selection is completed.
double SelectionStartX=0, SelectionEndX=0;
Chart.SelectionRangeChanging += (object sender, CursorEventArgs e) =>
{
//Record selection to be applied as zoom in SelectionRangeChanged event
SelectionStartX = e.ChartArea.CursorX.SelectionStart;
SelectionEndX = e.ChartArea.CursorX.SelectionEnd;
//Stop motion - Fix x-axis range to width of view
e.Axis.Maximum = e.Axis.ScaleView.ViewMaximum;
e.Axis.Minimum = e.Axis.ScaleView.ViewMinimum;
};
Chart.SelectionRangeChanged += (object sender, CursorEventArgs e) =>
{
//Reset previous zooming and apply only last user selected range
if (e.Axis.ScaleView.IsZoomed)
{
e.Axis.ScaleView.ZoomReset();
e.Axis.ScaleView.Zoom(SelectionStartX, SelectionEndX);
}
//Continue motion - Make chart adaptive to data range
e.Axis.Minimum = double.NaN;
e.Axis.Maximum = double.NaN;
};

How can i add more than 1 polyline in canvas?

I am using C# WPF to draw 10 polylines on touch screen. Yet, it got an error
"Argument expception was unhandled An unhandled exception of type
'System.ArgumentException' occurred in PresentationCore.dll
Additional information: Specified Visual is already a child of another
Visual or the root of a CompositionTarget."
for the line
canvas.Children.Add(freeline); in private void canvas_TouchDown
when I drew the second line. I could successfully drew one line, but
when I started to draw the second line, it got the mentioned error
public partial class MainWindow : Window
{
//List<Point> list = new List<Point>();
Polyline freeline = new Polyline();
bool isMouseDown = false; //mouse
Color[] colours = new Color[10] {Colors.White, Colors.Yellow,
Colors.Green,Colors.LightBlue, Colors.LightGreen,
Colors.LightCyan, Colors.LightGray, Colors.LightPink,
Colors.Purple, Colors.Red};
// Store the active lines, each of which corresponds to a place
// the user is currently touching down.
Dictionary<int, Line> movingLines = new Dictionary<int, Line>();
Line line = new Line();
int counter = 0;
public MainWindow()
{
InitializeComponent();
}
private void canvas_TouchDown(object sender, TouchEventArgs e)
{
counter = (counter + 1) % 10;
Line line = new Line();
// line.StrokeThickness = e.GetTouchPoint().Size;
// line.Stroke = new SolidColorBrush(colours[counter]);
// Position the line at the touch-down point.
TouchPoint touchPoint = e.GetTouchPoint(canvas);
line.X1 = touchPoint.Position.X;
line.Y1 = touchPoint.Position.Y;
line.X2 = line.X1;
line.Y2 = line.Y1;
movingLines[e.TouchDevice.Id] = line;
// Add the line to the Canvas.
//canvas.Children.Add(line);
// list_store_point_touch(touchPoint.Position.X, touchPoint.Position.Y);
canvas.Children.Add(freeline);
freeline.StrokeThickness = 4;
freeline.Stroke = new SolidColorBrush(colours[counter]);
//e.GetTouchPoint()
//for (int counter = 0; counter < touchPoint.Position.X ; counter++)
//{
// canvas.Children.Add(freeline);
// freeline.StrokeThickness = 4;
// freeline.Stroke = new SolidColorBrush(colours[counter]);
//}
/* for (int i = 0; i < handwritings.Points.Count - 1; i++)
{
drawingContext.DrawLine(new Pen(Brushes.Yellow, 3),
handwritings.Points[i], handwritings.Points[i + 1]);
} */
}
private void canvas_TouchMove(object sender, TouchEventArgs e)
{
// Get the line that corresponds to the current touch-down.
line = movingLines[e.TouchDevice.Id];
// Move it to the new touch-down point.
TouchPoint touchPoint = e.GetTouchPoint(canvas);
line.X2 = touchPoint.Position.X;
line.Y2 = touchPoint.Position.Y;
list_store_point_touch(touchPoint.Position.X, touchPoint.Position.Y);
}
private void canvas_TouchUp(object sender, TouchEventArgs e)
{
movingLines.Remove(e.TouchDevice.Id);
}
private void list_store_point_touch(double X, double Y)
{
Point point = new Point(X,Y);
freeline.Points.Add(point);
}
private void canvas_MouseDown(object sender, MouseButtonEventArgs e)
{
isMouseDown = true;
counter = (counter + 1) % 10;
line = new Line();
line.StrokeThickness = 4;
line.Stroke = new SolidColorBrush(colours[counter]);
// Position the line at the mouse down point.
Point mousePoint = e.GetPosition(canvas);
line.X1 = mousePoint.X;
line.Y1 = mousePoint.Y;
line.X2 = line.X1;
line.Y2 = line.Y1;
//Add the line to the Canvas.
canvas.Children.Add(freeline);
freeline.StrokeThickness = 4;
freeline.Stroke = new SolidColorBrush(colours[counter]);
//canvas.Children.Add(line);
}
Don't reuse the same Polyline instance.
Remove the line:
Polyline freeline = new Polyline();
When you need to draw yet another Polyline, create new one and draw it.
The error is self explanatory you are adding the same freeline more than once to the VisualTree. You need to use a factory method of some kind in order to always get new instances of Polyline before adding to the canvas.Children collection

Categories