Share My Creation B4A My Rolex

Hello everyone,

I'd like to share with the community a piece of code I've developed to create an analog clock in B4A. This clock displays hours, minutes, seconds, and the date of the month.

This project can serve as a foundation for those who want to integrate an analog clock into their applications or simply as an example of using timers and image manipulation in B4A.

Feel free to use, modify, or improve this code according to your needs. Your feedback and suggestions are welcome!

I hope this will be useful to the community. Happy coding, everyone!

Best regards,

 

[svanneste]

congratulations. Your app is beautiful

 

[LucaMs]

Nice.

[Not to be used in apps to be published on GP, it would be advertising for the watch brand]

I had to change a couple of lines of the script, otherwise the day wouldn't look good.

'   LblDate.Top = ImageViewClock.Top + 162dip
'   LblDate.Left = ImageViewClock.Left + 230dip
LblDate.Left = 100%x * .664
LblDate.Top = 100%y * .469
LblDate.Width = 100%x * .117

 

[AnandGupta]

Hi @Grinaute , Thanks sharing such a beautiful and simple code for showing analog clock.
I went through the codes and checked the images. I like how you are just rotating the hour,minute,second images on the center and the images are full size of the clock

Normally we make smaller images for the ticks and then rotate them on the lower image point at the center. At least that is my thinking, if any one do not agree here.

Learnt to think out of box for simple thing like this. Thanks again.

 

[Grinaute]

svanneste, thank you for your comment.

LucaMs, On my device, to get a "pretty" date, I have to write :
LblDate.Left = 100%x * .654 instead of 100%x * .664
LblDate.Top = 100%y * .471 instead of 100%y * .469
on your device. These values therefore need to be adapted slightly.

 

[Grinaute]

Hi @Grinaute , Thanks sharing such a beautiful and simple code for showing analog clock.
I went through the codes and checked the images. I like how you are just rotating the hour,minute,second images on the center and the images are full size of the clock

Normally we make smaller images for the ticks and then rotate them on the lower image point at the center. At least that is my thinking, if any one do not agree here.

Learnt to think out of box for simple thing like this. Thanks again.

Thank you very much for your comment AnandGupta.

 

[personalapps]

Nice.

[Not to be used in apps to be published on GP, it would be advertising for the watch brand]

I had to change a couple of lines of the script, otherwise the day wouldn't look good.

'   LblDate.Top = ImageViewClock.Top + 162dip
'   LblDate.Left = ImageViewClock.Left + 230dip
LblDate.Left = 100%x * .664
LblDate.Top = 100%y * .469
LblDate.Width = 100%x * .117

Isn't there a way to fix label position relative to the background so there is no need to change the calculation?

 

[LucaMs]

Isn't there a way to fix label position relative to the background so there is no need to change the calculation?

Only if you remove (or "comment") the AutoScaleAll in the script.


[In the code I wrote in the script, I would have done better to also set the height of the Label, but mine was just a quick test]

 

[Grinaute]

Isn't there a way to fix label position relative to the background so there is no need to change the calculation?

Try adding:
LblDate.Top = ImageViewClock.Top + (ImageViewClock.Height * 0.44)
LblDate.Left = ImageViewClock.Left + (ImageViewClock.Width * 0.63)

 

[Grinaute]

Zip file in post #1 added v1.1 :
- Needle width at 26dip instead of 20dip for a better rounded shape
- Designer's script modified with :
LblDate.Top = ImageViewClock.Top + (ImageViewClock.Height * 0.44)
LblDate.Left = ImageViewClock.Left + (ImageViewClock.Width * 0.63)