How to "refresh" graphics when it's moving around? - vb.net

Say for example I draw a box on my screen. The box's X and Y coord will change pretty much all the time. When I am drawing the box and all of it's new position, a new box keeps appearing. I want to draw the same box, and as its location is changed, draw that same box on the new location.
Example :
Box1 : X/Y = 0,0
Box1 (new X/Y) = 0,15
I now have 2 box on my screen.
Private Sub Form1_Paint(sender As Object, e As PaintEventArgs) Handles Me.Paint
Dim doo As Integer = 1
While doo = 1
For i As Integer = 0 To MonsterCount
Dim xx As Integer = GetPrivateProfileInt("iPC=" & i, "X-Int:", 0, INI)
Dim yy As Integer = GetPrivateProfileInt("iPC=" & i, "Y-Int:", 0, INI)
Box(i) = New Box(xx, yy)
If Box(i).x > -10 And Box(i).y > -10 And Box(0).x <= 1920 And Box(0).y <= 1080 Then
Dim rect As New Rectangle(Box(i).x, Box(i).y, 120, 80)
e.Graphics.DrawRectangle(Pens.Green, rect)
Invalidate()
End If
Next i
Threading.Thread.Sleep(5)
End While
End Sub

That code is very wrong. You need to handle the Paint event of the control you want to draw on and just do your drawing as it should be at that instant. All the data that describes the drawing should be stored in member variables. Any code that changes what needs to be drawn should be outside the Paint event handler. Once it has made changes that need implementing, it should call Invalidate and specify the smallest area that it reasonably can. The next time the control is painted, the Paint event handler will update the drawing and then the invalidated area will be repainted. You might check this out for an example.
In your specific case, you should declare a member variable to store the data required for the box. If the size remains the same then all you need is a Point, otherwise you should keep a Rectangle. Each time the box needs to move, you should store the new value in your field and then call Invalidate twice. The first time you should specify the old Rectangle and the second time you should specify the new Rectangle. By doing that, you ensure that any area that may have changed will be repainted but the rest of the area, which can't have changed, won't be repainted. It's the actual painting to screen, not the drawing code, that is the slow part so you should try to keep that to a minimum. If you really need the repaint done immediately then you can call Update but, otherwise, the new drawing will be displayed the next time the UI thread is free to do so.

Related

Fill a Rectangular with an inflating Circle without crossing its borders (Ripple)

I have a control surface (my custom control) and a drawed rectangular smaller than the whole surface. Now I need to draw a circle (FillEllipse) within this rectangular and the circle must not overdraw the rectangular borders.
I made a ButtonStrip like this one know from Angular:
https://material.angular.io/components/button-toggle/overview
And want to create such ripples:
https://material.angular.io/components/ripple/examples
It is almost perfect. I would like to make such an animation. The filling progress is not a problem, but the fact, that I dont use kinda "child control buttons" in my ButtonStrip and therefore no "real" borders, I struggle with the not"over"drawing the borders of my clicked button.
And no, I will not use child buttons as controls to put into my strip. I dont want this control in control control. I am drawing the buttons and use the rectangulars as "address" for my events like Hover/Click/Clicked etc.
Here is an example of my ButtonStrip (Month is hovered). Day is clicked.
Every Button (in a List or Dictionary) has its own rectangular which is pre calculated:
Dim InnerWidth As Integer = If(_IOSwitchVisible = True,
(Me.Width - _IOSwitchWidth) \ Buttons.Count,
Me.Width \ Buttons.Count)
If InnerWidth = 0 Then Return
For Each b In Buttons.Values
b.Rect = New Rectangle(CurrLeft, 0, InnerWidth, Me.Height)
VerticalLinePos.Add(CurrLeft)
CurrLeft += InnerWidth
Next
This is only a part of the code.
And here is a snippet how I draw a clicked button (either hovered or not)
'Clicked
For Each btn In Buttons.Values.ToList.Where(Function(x) x.Clicked = True)
If _HoveredElement IsNot Nothing AndAlso _HoveredElement.Rect = btn.Rect Then
'If the button is already clicked
e.Graphics.FillRectangle(New SolidBrush(ClickedHoveredColor), btn.Rect)
Else
'Otherwise draw clicked color
e.Graphics.FillRectangle(New SolidBrush(ClickedColor), btn.Rect)
End If
Next
Does someone got an idea how to fill one of these buttons with a circle which must not overdraw to its neighbour buttons?
Edit: As soon as I (or you) found out how, I will include a loop to inflate the circle to animate a filling progress.
Thanks to Jimi I got it working with his Clip hint:
(The yellow circle is from ScreenToGif)
Private Sub AnimateRipple(G As Graphics, C As Color, R As Rectangle)
Dim ClipRegion As New Region(R)
G.SetClip(ClipRegion, Drawing2D.CombineMode.Replace)
Dim EllipseRect As Rectangle = R
EllipseRect.Width = 1
EllipseRect.Height = 1
EllipseRect.Y = R.Height \ 2
EllipseRect.X += R.Width \ 2
EllipseRect.Inflate(InflateValue, InflateValue)
Dim RippleBrush As SolidBrush = New SolidBrush(C)
G.FillEllipse(RippleBrush, EllipseRect)
G.ResetClip()
RippleBrush.Dispose()
End Sub

Location properties on winforms acting strange

I have a form where I allow the user to generate multiple panels with some various contents in the panels by pressing an "add" button. Depending on what the user does in the panel, the panel grows and shrinks to fit the contents. Because of this change is size, I have created a sub that formats the panels on the form.
Private Sub formatPanels(frm As Form)
Dim count As Integer = 0
Dim startPoint As Point = New Point(12, 80)
Dim endPoint As Point = New Point(0, 0)
Dim maxY As Integer = 0
For Each pnl As Control In frm.Controls
If TypeOf pnl Is Panel Then
ReDim Preserve _arr_Panels(count)
_arr_Panels(count) = pnl
count += 1
pnl.Location = startPoint
startPoint.Y += pnl.Size.Height + 30
End If
Next
End Sub
So as you can see, we loop through every panel and the first always begins at the location (12,80) and then increments with the size of the panel and some spacing.
HERE IS THE ISSUE. This ONLY happens when i am SCROLLED DOWN the form. The panels spacing all of a sudden screws up and decides to put the first panel hundreds of pixels down the form. Is the location property based on what you're looking at? So if I were scrolled down the form location(0,0) would be the top left of the current view? There must be some weird property to location that I am not aware of.
Thanks
This behavior is not related to a panel, but to any control on a form with AutoScroll = True and Anchor including Top. (Note: if Anchor didn't also include Left I had some strange positioning on the first call of the function.
The solution is described here which is to use AutoScrollPosition. If you change your startPoint to this it will adjust for the scroll position.
Dim startPoint As Point = New Point(12, Me.AutoScrollPosition.Y + 80)
And the documentation for AutoScrollPosition states this:
When adding controls programmatically to a form, use the AutoScrollPosition property to position the control either inside or outside of the current viewable scroll area.

Determine if button is inside contour

I have a PictureBox on which a contour is drawn. Let's say this contour is in form of a circle. Now when I click a button a lot of buttons are created over the PictureBox row by row until the PictureBox is full:
For n As Integer = 1 To buttonNumberY
For m As Integer = 1 To buttonNumerX
Dim Btn As New Button
Btn.Width = elementsize
Btn.Height = elementsize
Btn.Flatstyle = Flatstyle:Flat
Btn.FlatAppearance.BorderSize = 1
Btn.FlatAppearance.BorderColor = Color.Gray
Btn.Location = new Point(elementsize*(m-1)+BORDER, maxContourHeight * scaley + BORDER - elementsize * n)
Btn.BackColor = Color.Transparent
Btn.Name = "Btn" & m & n
PictureBox1.Controls.Add(Btn)
Next
Next
As true transparency doesn't exist in WinForms I used some code so that the contour will be visible through the small buttons lying over the PictureBox (thanks for the help with this problem :)).
Now I have to determine whether a button is inside the contour or outside. I already have an idea of how to do this:
In a For Next loop every button should be checked if it has been painted.
If yes, it is partially inside the contour.
If no I have to check whether one of all the buttons under this one (in y direction) is painted.
If none of the buttons below this one is painted then it is not inside the contour.
If only one button below is painted then it is inside the contour and if two buttons are painted then it is outside of the contour again.
The problem I have is the following:
How can I check if a button is painted or not?
All the small buttons are generated through the code. Can I actually write code to check these buttons by referring to their name when they don't even exist yet in the code?
Essentially it sounds like you want to check if a point is within a circle, mathematically speaking this would be the algorithm:
(point.x - center.x) ^ 2 + (point.y - center.y) ^ 2 < radius ^ 2
In terms of your two questions, the button would be painted after you create the control. Probably not immediately, but you can force the control to be repainted dynamically by refreshing the parent.
Since you're setting the Button's name, then you could use the Form.Controls.Find method and set the searchAllChildren parameter to True.

System.Drawing.Pen - lines disappear when Labels are placed on Form

I want to draw TextBoxes/Labels on my form in code and connect them with lines - based on data that I have stored in a datatable ("treedata"). If I use the following code everything works fine:
For i = 0 To treedata.Rows.Count - 1
Dim tb As New TextBox
hor = treedata.Rows(i)(11)
vern = ver + 120 * treedata.Rows(i)(4)
tb.Text = "sometext"
tb.Location = New Point(hor, vern)
Form8.Controls.Add(tb)
posofmodif = treedata.Rows(i)(10)
vero = treedata.Rows(i)(6)
Dim myPen As New System.Drawing.Pen(System.Drawing.Color.Green)
Dim formGraphics As System.Drawing.Graphics
myPen.SetLineCap(LineCap.RoundAnchor, LineCap.ArrowAnchor, DashCap.Flat)
formGraphics = Form8.CreateGraphics()
formGraphics.DrawLine(myPen, Convert.ToSingle(posofmodif), Convert.ToSingle(vero), Convert.ToSingle(hor), Convert.ToSingle(vern))
myPen.Dispose()
formGraphics.Dispose()
Next
However I would like to use labels instead of TextBoxes because it makes no sense to use heavier TextBoxes in this case. But when I simply replace
Dim tb As New TextBox
by
Dim tb As New Label
the labels do appear on the Form as expected but the lines connecting them appear only for a moment and then turn invisible.
I first thought that the problem might be caused by labels being over or below the lines but even when I make sure that no line is crossing any label it happens.
Does anyone have an idea what I could do to avoid this?
This is your problem: Form8.CreateGraphics(). That method is volatile, as it creates a Graphics instance that does not survive the scope in which it's used.
You need to be using the Paint event for whatever control on which you intend to draw. The form, the label...whatever that is. The Paint event provides a Graphics object for you to use, and it gets called whenever the drawing needs to be refreshed.
Because the event fires frequently, you need to be mindful of what you do there. Heavy lifting in a Paint handler can slow an app down considerably.

How to get Winforms Panel to correctly layout many items?

I've got a WinForms Panel control which holds a large number of child controls. Each child is left docked, causing the horizontal width of the contents to grow. The containing Panel has its AutoScroll property set so that you can get to all the contents.
I'm running into a problem when the total width of the contents gets too large. Once you've hit this maximum width, additional content elements are placed on top of existing contents instead of being placed to the right. But, if I resize the Panel after it has done its initial layout, it corrects itself by expanding its logical width and placing each content element in the correct location. How do I get it to layout correctly before the user resizes the window?
Here's a simple example:
Form1.vb
Public Class Form1
Protected Overrides Sub OnLoad(e As EventArgs)
MyBase.OnLoad(e)
For i As Integer = 1 To 200
Dim gb As New GroupBox
gb.Text = "Box " & i.ToString
gb.Width = 250
gb.Dock = DockStyle.Left
Panel1.Controls.Add(gb)
gb.BringToFront()
Next
End Sub
End Class
Form1.Designer.vb
Partial Class Form1
Inherits System.Windows.Forms.Form
Private Sub InitializeComponent()
Me.Panel1 = New System.Windows.Forms.Panel()
Me.SuspendLayout()
'
'Panel1
'
Me.Panel1.AutoScroll = True
Me.Panel1.Dock = System.Windows.Forms.DockStyle.Fill
Me.Panel1.Location = New System.Drawing.Point(0, 0)
Me.Panel1.Name = "Panel1"
Me.Panel1.Size = New System.Drawing.Size(284, 262)
Me.Panel1.TabIndex = 0
'
'Form1
'
Me.AutoScaleDimensions = New System.Drawing.SizeF(6.0!, 13.0!)
Me.AutoScaleMode = System.Windows.Forms.AutoScaleMode.Font
Me.ClientSize = New System.Drawing.Size(284, 262)
Me.Controls.Add(Me.Panel1)
Me.Name = "Form1"
Me.Text = "Form1"
Me.ResumeLayout(False)
End Sub
Friend WithEvents Panel1 As System.Windows.Forms.Panel
End Class
This is what the window looks like when it first comes up, scrolled nearly to the end so you can see the problem area. Notice that Box 183 to 199 are missing because they are placed on top of each other. This is not right.
This is what the window looks like after you manually resize it, scrolled nearly to the end. The panel fixed itself in response to the resize; the total logical width of the panel was automatically extended enough to hold all the contents. This is what I want it to look like when it first comes up.
I've tried manually setting the location of each box, and I've tried calling PerformLayout() and several other functions. Nothing seems to work. So far I haven't found the magic combination to get the good layout. Does anyone know how to fix this?
Edit:
Here's a screenshot that might make the issue more obvious. I adjusted the box widths and the number of boxes to show the problem better. See how the last box overlaps box 656? Every box from 657 to 700 has the same incorrect location. Turning off docking and setting the location myself doesn't help.
Looks like a bug with the scrolling information. If you call PerformLayout when the Panel is scrolled all the way to the right, it correctly places the controls in the proper place. That requires some code in the OnShown method:
Protected Overrides Sub OnLoad(e As EventArgs)
MyBase.OnLoad(e)
Panel1.AutoScroll = True
Panel1.SuspendLayout()
For i As Integer = 1 To 200
Dim gb As New GroupBox
gb.Text = "Box " & i.ToString
gb.Width = 250
gb.Dock = DockStyle.Left
Panel1.Controls.Add(gb)
gb.BringToFront()
Next
Panel1.ResumeLayout(False)
End Sub
Protected Overrides Sub OnShown(e As EventArgs)
MyBase.OnShown(e)
Panel1.AutoScrollPosition = New Point(Panel1.HorizontalScroll.Maximum - _
Panel1.HorizontalScroll.LargeChange, 0)
Panel1.PerformLayout()
Panel1.AutoScrollPosition = Point.Empty
End Sub
Of course, having over 200 container controls on the form is never recommended.
AutoScroll is not AutoPositionMyChildren. From MSDN:
When adding controls programmatically to a form, use the AutoScrollPosition property to position the control either inside or outside of the current viewable scroll area.
If you looped thru the controls, to print their location, you's see at some point (probably around 130) that Location.Y becomes fixed at 32767 probably some default unscrolled max. This is also the point they start stacking because they in fact have the same initial location. Some of the code you have makes up for that but it isnt quite right. Once you scroll it, the panel fixes the coords on the child controls.
First, I would suggest that you set Panel1.AutoScrollMinSize to something like {480, 0} so that the HScroll bar appears at design time; this allows you to calc a good height for the boxes which wont cause a VScroll as you add controls.
Dim gb As GroupBox
' only 150 because problem is when (i * width) > 32k
For i As Integer = 0 To 150
gb = New GroupBox
gb.Name = i.ToString ' added
gb.Text = "Box " & i.ToString
gb.Width = 250
' no docking so set the height
gb.Height = Panel1.Bounds.Height - 30 ' trying to avoid the VSCroll
' set location explicitly
gb.Location = NewCtlLocation(Panel1.Controls.Count,
Panel1.AutoScrollPosition.X)
' Dock and Anchor mess up the AutoScroll
'gb.Dock = DockStyle.Left
Panel1.Controls.Add(gb)
' allow panel to update its scroll positions
Panel1.ScrollControlIntoView(gb)
' not needed; seems to offset something with Dock
' changing ZOrder may not always be desirable
'gb.BringToFront()
' debug illumination
Console.WriteLine("{0} {1} {2}", i.ToString,
Panel1.AutoScrollPosition.X.ToString,
gb.Location.X.ToString)
Next
'Go back to start
Panel1.ScrollControlIntoView(Panel1.Controls("0"))
Location helper so you can tweak gutters or margins (dock replacement):
Friend Function NewCtlLocation(ByVal n As Integer,
ByVal ScrollPosX As Integer) As Point
Const TopMargin As Integer = 5
Const LeftMargin As Integer = 5
Return New Point((n * 250) + ScrollPosX, 0)
End Function
Notes:
I have a vertical scroller which repeatedly adds up to 120 user controls which works well but it does not need/use ScrollControlIntoView and they never stack up like yours do. I suspect maybe because they are smaller. There is also at least a second or two before the next one can be added, which may matter. But, good to know.
It might be possible to use the ControlAdded event of the panel to do something, but it would likely amount to ScrollControlIntoView. Doing it once at the end only doesnt work, so using it as they are added is allowing something to get updated as you go.
With the right fiddling, you might be able to get Dock to work, but I suspect it may be part of the problem such as Height and Left set this way dont update the panel's internal scroll map.
Your boxes actually look narrower than 250 - is autosize on?
Suspend/Resume Layout hurt rather than help - they prevent the control from doing anything about the virtual area being populated. It should happen fast enough that no one will see anything. Results:
Works on My SystemTM