Recent

Author Topic: Modern UI in Lazarus  (Read 81589 times)

Wargan

  • New member
  • *
  • Posts: 48
    • 'This way' site
Modern UI in Lazarus
« on: April 13, 2017, 03:06:06 pm »
Hello!

Does Lazarus have the ability to create modern user interfaces (for example: Modern UI from Microsoft, Material Design from Google)?

Like this (see attachments):
« Last Edit: April 13, 2017, 03:18:54 pm by Wargan »
Lazarus 1.8RC5+ FPC 3.0.4.
Windows 7 x32, RAM 3 Gb.

Zoran

  • Hero Member
  • *****
  • Posts: 1456
    • http://wiki.lazarus.freepascal.org/User:Zoran
Re: Modern UI in Lazarus
« Reply #1 on: April 13, 2017, 04:12:29 pm »
Not out of the box. The simplest way in creating user interface with Lazarus is using LCL, which then use one of its standard back-ends (called widgetsets), which actually means that control design and behaviour (look and feel) is delegated to standard library found on your system (which would be Win32/64 widgetset on Windows, that is Windows native components, and on Linux it would be either Gtk2 or Qt4).

What you can do is make your own controls instead of what LCL offers. You can also use BGRA controls. Or you can use fpGui instead of LCL -- there should be support for themes in fpGui, but you should ask Graeme for details, ask in fpgui support group -- see http://fpgui.sourceforge.net/support.shtml

mse

  • Sr. Member
  • ****
  • Posts: 286
Re: Modern UI in Lazarus
« Reply #2 on: April 13, 2017, 08:27:30 pm »
Or you can use fpGui instead of LCL
Or MSEide+MSEgui. It has excellent skinning support, see TWidget.Frame, TWidget.Face, TFrameComp, TFaceComp, TSkinController...
http://wiki.freepascal.org/MSEide_&_MSEgui

lainz

  • Hero Member
  • *****
  • Posts: 3179
    • Lainz
Re: Modern UI in Lazarus
« Reply #3 on: April 14, 2017, 01:11:53 am »
I use Electron and (any) html+css combination I can imagine / download. You can do the core in freepascal and -try to- link it (.dll / .exe) against the electron app with JavaScript.

Wargan

  • New member
  • *
  • Posts: 48
    • 'This way' site
Re: Modern UI in Lazarus
« Reply #4 on: April 14, 2017, 07:22:44 am »
Many thanks to everyone who wrote the answer!

I think lainz's answer suggested is the best option for me.
« Last Edit: April 14, 2017, 07:25:42 am by Wargan »
Lazarus 1.8RC5+ FPC 3.0.4.
Windows 7 x32, RAM 3 Gb.

JD

  • Hero Member
  • *****
  • Posts: 1756
Re: Modern UI in Lazarus
« Reply #5 on: April 17, 2017, 06:30:40 pm »
I use Electron and (any) html+css combination I can imagine / download. You can do the core in freepascal and -try to- link it (.dll / .exe) against the electron app with JavaScript.

Do you have a screenshot of the UI of an app you designed this way?

Thanks!
Windows (10, 7) - Lazarus 2.0RC3/FPC 3.2, NewPascal, Delphi

Indy 10.6 series; mORMot; Zeos 7.2.1; SQLite, Firebird, PostgreSQL & MariaDB; VirtualTreeView 5.5.3 R1

Blestan

  • Sr. Member
  • ****
  • Posts: 461
Re: Modern UI in Lazarus
« Reply #6 on: April 17, 2017, 09:25:59 pm »
the batlle of the UIs is over ...
lazarus as an ui is deeply rooted in the late '90 ...
unfortunatly lazarus was targgeted as as delphi alternative ....
if you follow ( as i do ) the evelution of lazarus ( and may be of fpc) most of the changes are motivated by the evolution of delphi ... fpc team wants to keep fpc/lazarus as close as possible to delphi ( even in some moments of the evolution the fpc compiler was driven by the ideas of the embracadero team) ... dont get me wrong ...i im using object pascal  for more than 30 yesrs  and i'm still using object pascal  in its fpc implementation to write real world applications ...  but lazarus and its lcl is deeply related  to the idea of the desktop aps in 1995 / 1999 ... exe's running in corporate intraweb accessing db servers in "secure"  environments with low latency .... developping ui for tabular data easy displayable in "grids" ... easy to understand by accountants and data entry personel... sorry this is the truth... even more .. lazarus is  still in total denial of the firemonkey model of delphi ...
 the "biggest" frog jump is to try to implement some kind of altenative of borland's datasnap model...  the idea of data connection -> table/  SQL ( SQL is great !!!!) query -> datasource -> ui components does not evolved in more than 20 years  (try to connect a DB component to mongo or redis; try to sync over the internet a data  model not involving sql backend over a ssl tunnel)... even the lcl alternatives like fpgui ( great work graeme) mse gui are stalled in 1998 ...
believe me object pascal is better than c or c++ or even go  swift as a compiler language paradim .. the problem is that most of the people involed are mostly purely "academicly" interested in prooving that "pascal is equal to c"... come on .. we a ll know  thah pascal is a capable language ... operating systems and low level drivers are writen in pascal.. (early versions of windows and photoshop are wtiten in pascal)
what we need is to escape from the pure academic aproach ... take for example the json parsing in freepascal ... it's oop .. it's cteating classes and objects but its absolutly inadequate in production envenronments... google the implementation in pascal for a such sipmle thing as JWT (json web tokens) and you will end with the feeling that you are in a colege course for "right" programing ...
... so long story short ( about UI) wait for somebody to port CSS/html5  redering to fpc and you will have modern interfaces in lazarus  ... but in the meantime .... keep calm and write awsome apps backends in pascal and relay to js/html for the frontend. the main probles is that "big"companies like ms or fb  or adobe have trouble past with pascal ... no one of them believes that they can build something "new" in pascal ... php exploded in the 2000 because fb adopted it ... js and go is supported by google even by ms in the past 10 years .. adobe abandoned their flash format i favour of html5 for building ui ... nobody is adopting pascal as a paradigm beacause they hate it from the late 80 and the early 90 ... borland was a small spark to prove than pascal in not "only 80" but can live in the 90 .. as an alternative to dBase .... "delphi" was an extention to paradox to build '"fancy" inputs forms in win32   witch was an alternative to access... delphi means "the oracle of delphi" ... connecting to the oracle DB server ...
« Last Edit: April 17, 2017, 09:40:40 pm by Blestan »
Speak postscript or die!
Translate to pdf and live!

Phil

  • Hero Member
  • *****
  • Posts: 2750
Re: Modern UI in Lazarus
« Reply #7 on: April 17, 2017, 10:45:32 pm »
I use Electron and (any) html+css combination I can imagine / download. You can do the core in freepascal and -try to- link it (.dll / .exe) against the electron app with JavaScript.

Do you have a screenshot of the UI of an app you designed this way?

Thanks!

I'm curious about this suggested approach to UI as well. Electron apps tend to be very big since they include both Chromium browser and Node.js. Visual Studio Code, for example, is about 150MB installed on Windows. Is that the price to pay for a more modern UI?

https://electron.atom.io

lainz

  • Hero Member
  • *****
  • Posts: 3179
    • Lainz
Re: Modern UI in Lazarus
« Reply #8 on: April 17, 2017, 10:53:12 pm »
I use Electron and (any) html+css combination I can imagine / download. You can do the core in freepascal and -try to- link it (.dll / .exe) against the electron app with JavaScript.

Do you have a screenshot of the UI of an app you designed this way?

Thanks!

Not now, since I didn't need pascal for such a simple application. But I have this one attached, using Material Design Lite with little modifications. The source code is on my github page, so you can grab the code for running an external application, changing it a bit the output is redirected to the electron application where you can do anything with it (I can imagine a communication with files, you create a file with the data with electron and pass the filename to the pascal application, then the pascal returns in the command line a JSON that you can use). Another way is using a database with electron and process with fpc when needed. So a command line utility will be the case I can do.

Maybe a dll is harder to do, at least I found only for C++ and C# .dll's tutorials to use them with Electron. You will need a header for data-types between electron and fpc.

Edit: I choose Material Design Lite, you can use Angular Material, Bootstrap or buy a theme somewhere.
« Last Edit: April 17, 2017, 11:05:49 pm by lainz »

lainz

  • Hero Member
  • *****
  • Posts: 3179
    • Lainz
Re: Modern UI in Lazarus
« Reply #9 on: April 17, 2017, 10:58:00 pm »
I use Electron and (any) html+css combination I can imagine / download. You can do the core in freepascal and -try to- link it (.dll / .exe) against the electron app with JavaScript.

Do you have a screenshot of the UI of an app you designed this way?

Thanks!

I'm curious about this suggested approach to UI as well. Electron apps tend to be very big since they include both Chromium browser and Node.js. Visual Studio Code, for example, is about 150MB installed on Windows. Is that the price to pay for a more modern UI?

https://electron.atom.io

Is not a big deal when you compress is with LZMA. It reduces the download to about 40mb. TB hard disks.. well except for SSD, at least I don't have a big one.

Well If I need chrome embedded (that never worked for me with Lazarus) is the same.

Visual Studio code is the best JavaScript editor I ever used.

Noodly

  • Jr. Member
  • **
  • Posts: 70
Re: Modern UI in Lazarus
« Reply #10 on: April 17, 2017, 11:43:37 pm »
... im using object pascal  for more than 30 yesrs ...

Wow, you must have been in at the very beginning since object pascal first appeared via Apple in 1986. I was first exposed via TP 5.5 in 1989 and later was a beta tester for Delphi in 1994.

After getting back in touch with pascal via Lazarus/FPC, I can see that it took the lead on cross-platform pascal desktop development, but is struggling with Android / iOS / Windows 10 mobile. Having said that, it's a volunteer project that's done amazingly well and can't possibly be the open source, write once, run on any mobile, desktop, world leading development environment that some posters here think it should be ---- without even more skilled and dedicated experts prepared to donate their time.
Windows 10 Home, Lazarus 2.02 (svn 60954), FPC 3.04

Blestan

  • Sr. Member
  • ****
  • Posts: 461
Re: Modern UI in Lazarus
« Reply #11 on: April 17, 2017, 11:51:14 pm »
yes i was using cp/m pascal for apple2 and later turbo pascal3.0 ( remerber 3.0 compile to .com not exe...max64kb... do you remember .ovl for 3.0. :))... i am in the pascal realm for 34years exactly ..since1984
Speak postscript or die!
Translate to pdf and live!

lainz

  • Hero Member
  • *****
  • Posts: 3179
    • Lainz
Re: Modern UI in Lazarus
« Reply #12 on: April 17, 2017, 11:57:20 pm »
yes i was using cp/m pascal for apple2 and later turbo pascal3.0 ( remerber 3.0 compile to .com not exe...max64kb... do you remember .ovl for 3.0. :))... i am in the pascal realm for 34years exactly ..since1984

No one more experienced than you. I agree with your first comment. What I can add is that making html/css for lazarus must be really hard. I'm not an expert with graphics but even with BGRABitmap I can't imagine how to replicate every css stuff. Also html and css are nothing without javascript, so all the way of accessing the DOM must be done in pascal, or implement their own javascript. Else any already made js library will not be usefull at all (let's say angular or react). I can't imagine how much people and time and money you need to do such thing, browsers are doing this for decades and still improving.

Something like that was done by microsoft with WPF, Java with JavaFX and AFAIK Qt also has selectors.
« Last Edit: April 18, 2017, 12:02:12 am by lainz »

Noodly

  • Jr. Member
  • **
  • Posts: 70
Re: Modern UI in Lazarus
« Reply #13 on: April 18, 2017, 12:01:40 am »
yes i was using cp/m pascal for apple2 and later turbo pascal3.0 ( remerber 3.0 compile to .com not exe...max64kb... do you remember .ovl for 3.0. :))... i am in the pascal realm for 34years exactly ..since1984

I remember .ovl, I started in 1987 with TP 3.0 CP/M and MSDOS with inherited .ovl code and was fascinated with TSR techniques (Sidekick!)
Windows 10 Home, Lazarus 2.02 (svn 60954), FPC 3.04

Noodly

  • Jr. Member
  • **
  • Posts: 70
Re: Modern UI in Lazarus
« Reply #14 on: April 18, 2017, 12:19:05 am »
... I can't imagine how much people and time and money you need to do such thing, browsers are doing this for decades and still improving ...

A few years ago I met the founder / President of a major Asian software development company (10K+ employees) that produced some serious software including the parallel operations of MS SQL Server on behalf of MS. He said he was betting the whole company on HTLM5 (and HTML6 etc whatever). It's obvious when you think about it - there should be one cross-platform UI and browsers are the prime candidates.
Windows 10 Home, Lazarus 2.02 (svn 60954), FPC 3.04