Class Animation

noclass1980

Active Member
Licensed User
Longtime User
Hi, I've just written my first Class Module . It's only very simple to draw two arrows but I'd like to be able to increase the size by animation. I've tried the InitializeScale approach but it didn't work. Can any one tell me how to do it? In the attached zip there is a commented line (75-78) which changes the size of the arrow instantly but I'd like a smooth animated change. Would it be easier to step through the change in scale with a simple For-Next and timer and redraw the arrow with the increasing scale? There is an error in the Class Sub ArrowScaledAni(ArrowName As DrawArrows) as I don't know how to Dim the variable "A". Any suggestions appreciated. Thanks
 

Attachments

  • DrawArrows.zip
    7.1 KB · Views: 142
Sort by date Sort by votes

noclass1980

Active Member
Licensed User
Longtime User
Erel said:
The Animation library works with views. If you want to use it you should draw the arrow on a panel or ImageView and then use the Animation object to scale the view.
Click to expand...

Thanks for the respose. I managed to add a panel and a canvas and have animated it ok but when I try to draw a line it doesn't appear. I can draw on the Activity canvas ok but not on the panel canvas. Any suggestions?

B4X: 
Sub Globals
   'These global variables will be redeclared each time the activity is created.
   'These variables can only be accessed from this module.
Dim cvs, Pancvs As Canvas
Dim Panel1 As Panel 'ImageView
Dim Arrow1, Arrow2,Arrow3 As DrawArrows

End Sub

Sub Activity_Create(FirstTime As Boolean)
   'Do not forget to load the layout file created with the visual designer. For example:
   'Activity.LoadLayout("Layout1")
Dim Button1 As Button
cvs.Initialize(Activity)
cvs.DrawColor(Colors.Transparent)
Panel1.Initialize("Panel1_Click")
Activity.AddView(Panel1,600,300,300,100)
Pancvs.Initialize(Panel1)

Pancvs.DrawColor(Colors.Gray)
Button1.Initialize("Button1")
Activity.AddView(Button1, 10,10,100,50)
Button1.Enabled=True
Button1.Text="Scale"
arrLength=200dip
arrWidth=20dip
arrHead=2*arrWidth
arrscale=1
OriginalSize=arrscale
x1=300dip
y1=300dip
x2=600dip
y2=400dip
Pancvs.DrawLine(600,300,800,400,Colors.white,10dip) 'this line does not appear
cvs.DrawLine(200,300,800,400,Colors.white,10dip) ' this line appears

Panel1.Invalidate
Direction="Left"
If Direction="Left" Then ArrColour=Colors.Red Else ArrColour=Colors.Green
Arrow1.Initialize(x1,y1,arrscale,arrLength,arrHead, arrWidth,Direction,ArrColour)
CallSub2(Arrow1,"DrawNewArrows",cvs)
Direction="Right"
If Direction="Left" Then ArrColour=Colors.Red Else ArrColour=Colors.Green
Arrow2.Initialize(x2,y2,arrscale,arrLength,arrHead,arrWidth,Direction, ArrColour)
CallSub2(Arrow2,"DrawNewArrows",cvs)
ArrColour=Colors.Blue
Arrow3.Initialize(600dip,300dip,arrscale,arrLength,arrHead, arrWidth,Direction,ArrColour)

CallSub2(Arrow3,"DrawNewArrows",Pancvs)
Activity.Invalidate
End Sub
 
Upvote 0

noclass1980

Active Member
Licensed User
Longtime User
Erel said:
You are missing many 'dip' units. BTW, why do you use CallSub instead of calling the sub directly:
Arrow1.DrawNewArrows ?
Click to expand...

Yes, I realise that the dips are missing, I was just developing a test app where the dip is less important (correct me if I'm wrong in that view. I used the CallSub2 based on examples on the forum so that I could pass the cvs object to sub. The method works as I expect but what I'm missing is how to attach the Pancvs to Panel1 and then draw a line on the Pancvs as shown in the code below. Any suggestions?

B4X: 
Pancvs.DrawLine(600,300,800,400,Colors.white,10dip) 'this line does not appear
cvs.DrawLine(200,300,800,400,Colors.white,10dip) ' this line appears
 
Upvote 0

klaus

Expert
Licensed User
Longtime User
It's normal that your line will not appear.
You add the panel with
Activity.AddView(Panel1,600,300,300,100)
That means that the Panel1.Width is 300 pixels and the Panel1.Height is 100 pixels.
Then you want to draw a line
Pancvs.DrawLine(600,300,800,400,Colors.white,10dip)
The coordinates of the start point are x1 = 600 and y1 = 300
and the end point coordinates are x1 = 800 and y1 = 400
As the coordinates for Pancvs are referenced to the upper left corner of the panel both points are outsides the panel area.
You should use
Pancvs.DrawLine(0,0,200,100,Colors.white,10dip)

Best regards.
 
Upvote 0

noclass1980

Active Member
Licensed User
Longtime User
problem solved


Thank you, I didn't appreciate that the panel had its own co-ordinate system but it makes sense now. Thaks for the help!
 
Upvote 0
You must log in or register to reply here.
Menu
Log in
Register
Cookies are required to use this site. You must accept them to continue using the site. Learn more…