help please with creating a graphics component
Posted: Sun Jan 01, 2012 11:28 pm
Happy '012 all!
One of the objects I use the most in my VB audio applications is an 'envelope control'. Referring to the below screenie:
1. It consists of 5 nodes joined by line segments, and the default appearance of the component is as shown in 'Filter Cutoff Synth Wave 1'
2. If the user clicks approximately on a node, drags the mouse to another location and releases, the node moves to the point of mouse release and the line segments redraw to the new point. The 'Volume Envelope Sample' and 'Volume Envelope Synth Wave 1' show outcomes of a user having done this
3. The outermost nodes move only along the vertical axis (If the user moves the node as per 2, the new X position is ignored, and the node moves only to the new Y position)
4. No node can move past the position of another node, as shown by 'Frequency Envelope Synth Wave 1'

I am seeking your assistance in creating such a component in PB. Doing so will play a big part in my being able to move across to PB for future audio projects (plus practically teach me about '2D PB user interactive graphics'). For your reference, here is the relevant VB6 source I put together for my current component:
First, put a Picture box on a form: Picture1
Set the following properties:
AutoRedraw = True
ScaleMode = 0-User (not pixel, twip, point, millimeter etc)
Then:

One of the objects I use the most in my VB audio applications is an 'envelope control'. Referring to the below screenie:
1. It consists of 5 nodes joined by line segments, and the default appearance of the component is as shown in 'Filter Cutoff Synth Wave 1'
2. If the user clicks approximately on a node, drags the mouse to another location and releases, the node moves to the point of mouse release and the line segments redraw to the new point. The 'Volume Envelope Sample' and 'Volume Envelope Synth Wave 1' show outcomes of a user having done this
3. The outermost nodes move only along the vertical axis (If the user moves the node as per 2, the new X position is ignored, and the node moves only to the new Y position)
4. No node can move past the position of another node, as shown by 'Frequency Envelope Synth Wave 1'

I am seeking your assistance in creating such a component in PB. Doing so will play a big part in my being able to move across to PB for future audio projects (plus practically teach me about '2D PB user interactive graphics'). For your reference, here is the relevant VB6 source I put together for my current component:
First, put a Picture box on a form: Picture1
Set the following properties:
AutoRedraw = True
ScaleMode = 0-User (not pixel, twip, point, millimeter etc)
Then:
Code: Select all
Dim Drawing1 As Boolean
Dim StartX1 As Integer
Dim StartY1 As Integer
Dim Drawing2 As Boolean
Dim StartX2 As Integer
Dim StartY2 As Integer
Dim Drawing3 As Boolean
Dim StartX3 As Integer
Dim StartY3 As Integer
Dim Drawing4 As Boolean
Dim StartX4 As Integer
Dim StartY4 As Integer
Dim Drawing5 As Boolean
Dim StartX5 As Integer
Dim StartY5 As Integer
Function ADSR(ByVal xUnit As Long, ByVal NumxDvns As Long) As Double
Dim ScaledxUnit As Double
ScaledxUnit = (xUnit * (1000 / NumxDvns))
If ScaledxUnit <= StartX2 Then
ADSR = (StartY1 + ((StartY2 - StartY1) / (StartX2 - StartX1)) * (xUnit * (1000 / NumxDvns) - StartX1)) / 1000
ElseIf ScaledxUnit > StartX2 And ScaledxUnit <= StartX3 Then
ADSR = (StartY2 + ((StartY3 - StartY2) / (StartX3 - StartX2)) * (xUnit * (1000 / NumxDvns) - StartX2)) / 1000
ElseIf ScaledxUnit > StartX3 And ScaledxUnit <= StartX4 Then
ADSR = (StartY3 + ((StartY4 - StartY3) / (StartX4 - StartX3)) * (xUnit * (1000 / NumxDvns) - StartX3)) / 1000
ElseIf ScaledxUnit > StartX4 And ScaledxUnit <= StartX5 Then
ADSR = (StartY4 + ((StartY5 - StartY4) / (StartX5 - StartX4)) * (xUnit * (1000 / NumxDvns) - StartX4)) / 1000
End If
End Function
Private Sub Form_Load()
Picture1.Scale (0, 1000)-(1000, 0)
StartX1 = 0
StartY1 = 500
StartX2 = 250
StartY2 = 500
StartX3 = 500
StartY3 = 500
StartX4 = 750
StartY4 = 500
StartX5 = 1000
StartY5 = 500
End Sub
Private Sub Form_Activate()
Picture1.FillStyle = vbFSSolid
Picture1.FillColor = vbRed
Picture1.Circle (StartX1, StartY1), 20, vbRed
Picture1.Circle (StartX2, StartY2), 20, vbRed
Picture1.Circle (StartX3, StartY3), 20, vbRed
Picture1.Circle (StartX4, StartY4), 20, vbRed
Picture1.Circle (StartX5, StartY5), 20, vbRed
Picture1.Line (StartX2, StartY2)-(StartX1, StartY1), vbRed
Picture1.Line (StartX3, StartY3)-(StartX2, StartY2), vbRed
Picture1.Line (StartX4, StartY4)-(StartX3, StartY3), vbRed
Picture1.Line (StartX5, StartY5)-(StartX4, StartY4), vbRed
End Sub
Private Sub Picture1_MouseDown(Button As Integer, Shift As Integer, X As Single, Y As Single)
If X <= StartX1 + 35 And Y >= StartY1 - 35 And Y <= StartY1 + 35 Then
Drawing1 = True
End If
If X >= StartX2 - 35 And X <= StartX2 + 35 And Y >= StartY2 - 35 And Y <= StartY2 + 35 Then
Drawing2 = True
End If
If X >= StartX3 - 35 And X <= StartX3 + 35 And Y >= StartY3 - 35 And Y <= StartY3 + 35 Then
Drawing3 = True
End If
If X >= StartX4 - 35 And X <= StartX4 + 35 And Y >= StartY4 - 35 And Y <= StartY4 + 35 Then
Drawing4 = True
End If
If X >= StartX5 - 35 And Y >= StartY5 - 35 And Y <= StartY5 + 35 Then
Drawing5 = True
End If
End Sub
Private Sub Picture1_MouseUp(Button As Integer, Shift As Integer, X As Single, Y As Single)
If Drawing1 = True Then
Drawing1 = False
StartX1 = 0
StartY1 = Int(Y)
If StartY1 > 1000 Then
StartY1 = 1000
ElseIf StartY1 < 0 Then
StartY1 = 0
End If
ReDoPici
End If
If Drawing2 = True Then
Drawing2 = False
StartX2 = Int(X)
StartY2 = Int(Y)
If StartX2 > StartX3 Then
StartX2 = StartX3
ElseIf StartX2 < 20 Then
StartX2 = 20
End If
If StartY2 > 1000 Then
StartY2 = 1000
ElseIf StartY2 < 0 Then
StartY2 = 0
End If
ReDoPici
End If
If Drawing3 = True Then
Drawing3 = False
StartX3 = Int(X)
StartY3 = Int(Y)
If StartX3 < StartX2 Then
StartX3 = StartX2
ElseIf StartX3 > StartX4 Then
StartX3 = StartX4
End If
If StartY3 > 1000 Then
StartY3 = 1000
ElseIf StartY3 < 0 Then
StartY3 = 0
End If
ReDoPici
End If
If Drawing4 = True Then
Drawing4 = False
StartX4 = Int(X)
StartY4 = Int(Y)
If StartX4 < StartX3 Then
StartX4 = StartX3
ElseIf StartX4 > 980 Then
StartX4 = 980
End If
If StartY4 > 1000 Then
StartY4 = 1000
ElseIf StartY4 < 0 Then
StartY4 = 0
End If
ReDoPici
End If
If Drawing5 = True Then
Drawing5 = False
StartX5 = 1000
StartY5 = Int(Y)
If StartY5 > 1000 Then
StartY5 = 1000
ElseIf StartY5 < 0 Then
StartY5 = 0
End If
ReDoPici
End If
End Sub
Sub ReDoPici()
Picture1.Cls
Picture1.FillStyle = vbFSSolid
Picture1.FillColor = vbRed
Picture1.Circle (StartX1, StartY1), 20, vbRed
Picture1.Circle (StartX2, StartY2), 20, vbRed
Picture1.Circle (StartX3, StartY3), 20, vbRed
Picture1.Circle (StartX4, StartY4), 20, vbRed
Picture1.Circle (StartX5, StartY5), 20, vbRed
Picture1.Line (StartX2, StartY2)-(StartX1, StartY1), vbRed
Picture1.Line (StartX3, StartY3)-(StartX2, StartY2), vbRed
Picture1.Line (StartX4, StartY4)-(StartX3, StartY3), vbRed
Picture1.Line (StartX5, StartY5)-(StartX4, StartY4), vbRed
End Sub