It’s a lot of fun being an Embarcadero Delphi MVP. On behalf of Embarcadero, I get to demonstrate the benefits of what I think is the best application builder software you can choose to use. But I also get invited to speak at other conferences, webinars and events by a wide range of user groups, resellers and tech partners too. I spoke at such an event earlier this week held by tech partner Softacom. I got to choose my topic so I decided to talk a little about how RAD Studio with Delphi can really inject some wow factor into your apps. The replay of the talk is not online yet, but I will update this blog post when it becomes available.
This short 15-minute webinar session is actually a little preview of my upcoming hour-long session on Thursday November 3rd 2022.
Table of Contents
Is there a replay of the “How To Add The Wow Factor To Your Apps” webinar?
Yes, here is the replay of the short webinar. The longer one hour webinar is detailed in another article. I will put the link to it in here when it has finished being processed.
How To Add The Wow Factor To Your Apps – what was it all about?
The session discussed a few free resources which you can use to add some visual beauty to your apps. The slides below list the full session. The main takeaway was how easy it is to create powerful cross platform apps using Delphi which work great and have all the bells and whistles of a modern, good-looking user interface. Apps do not have to be ‘slabs of gray’. The key properties of a modern user interface are motion, color, depth and responsive design.
Where can I see a good example of an app with the wow factor?
The weirdest thing is that on nearly every operating system, whether it is desktop or mobile, the weather apps nearly always have used every single trick and technique in the book. If you think about it though, there is a lot we can learn from a weather app because they are essentially dashboard apps – programs designed to pull in time-sensitive data from the internet and then display it in a variety of ways to make that (often quite diverse) data readily understandable in the most succinct and attractive way possible.
What was my Delphi weather app example like?
I showed a Delphi app built using just FireMonkey and Skia4Delphi. It looks gorgeous – even though I say so myself – and manages to do so with almost nothing other than the standard capabilities of the Delphi RTL and FireMonkey FMX. I did make use of the free Skia4Delphi components and some Lottie animations. I also pulled in some free SVGs to make a plausible graphical display.
What code was required to make the sample app work?
I mainly used the built-in event-driven animation effects of FireMonkey to automatically drive the Opacity value of some controls – and to make things slide pleasingly into place. This is the depth and motion part of good modern UI design.
These all have the effect of making things happen to the parent control when the trigger value’s expression evaluates to true. In the example above, Delphi and FireMonkey FMX change the opacity value from 1 (not transparent) to 0 (totally transparent) when the parent control becomes visible. The animation or conversion takes 2 seconds to run. This translates to the animation appearing to fade away. Simple, when you know how.
Was there any code in the background of the wow app example?
Well, I did have to write a small amount of code to make things happen in a set sequence. I also used a thread to trigger part of the process after a delay of 1 second – just enough time for the user to see the ‘sunrise’ animation after it had completed. The use of a thread means the app stays responsive while we’re waiting for the animations to finish.
Here is the full example code for the example wow app
Note that the full source is available here: https://github.com/checkdigits/wow_app_example
Here’s a partial listing of the relevant bits.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 |
implementation uses System.Threading; {$R *.fmx} {$R *.iPhone47in.fmx IOS} { TForm1 } procedure TForm1.MainPanelEffectFinish(Sender: TObject); begin CurrentWeatherAnimation.Visible := True; end; procedure TForm1.StaticAnimationEffectFinish(Sender: TObject); begin MainPanel.Visible := True; end; procedure TForm1.DoNextAnimation; var aTask: ITask; begin // Keep the UI responsive, while we wait 1 second... // We use a Task thread to do this aTask := TTask.Create( procedure begin Sleep(1000); // We're going to update the UI - so we need to do that synchronized to the main thread... TThread.Synchronize(TThread.Current, procedure begin MainAnimation.Enabled := False; MainAnimationEffect.Start; end); end); aTask.Start; end; procedure TForm1.FormCreate(Sender: TObject); begin // On mobile devices the panel needs to be nearer the edge // We use views manually optimized for our intended device targets to // make sure that it looks GOOD on all targets {$IF DEFINED(IOS) or DEFINED(ANDROID)} FloatAnimation1.StopValue := 7; {$ENDIF} end; procedure TForm1.MainAnimationAnimationFinished(Sender: TObject); begin DoNextAnimation; end; procedure TForm1.MainAnimationEffectFinish(Sender: TObject); begin MainAnimation.Visible := False; StaticAnimation.Visible := True; end; |
Where can I learn more about Delphi, FireMonkey and other app UI design tips?
Register for the webinar or watch it on replay if you’re reading this after Thursday November 3rd, 2022. The upcoming webinar goes into much more depth and shows several example programs which demonstrate a whole load of tips and tricks for making good-looking apps with modern user interfaces.
Where can I find the slides from the “how to add the wow factor to your apps” webinar?
They are below.
Design. Code. Compile. Deploy.
Start Free Trial Upgrade Today
Free Delphi Community Edition Free C++Builder Community Edition
