Recent

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

Wargan

  • New Member
  • *
  • Posts: 48
    • 'This way' site
Re: Modern UI in Lazarus
« Reply #135 on: May 01, 2017, 08:09:08 am »
UPDATE: Some links on the GUI topic (if interested):

https://habrahabr.ru/post/244281/  russian
https://habrahabr.ru/post/276747/  russian

http://searchwindevelopment.techtarget.com/definition/GUI  english
Lazarus 1.8RC5+ FPC 3.0.4.
Windows 7 x32, RAM 3 Gb.

Abelisto

  • Jr. Member
  • **
  • Posts: 91
Re: Modern UI in Lazarus
« Reply #136 on: May 01, 2017, 09:58:58 am »
There are ten pages already so I beg you pardon for repetition if any.

"Modern UI" is something abstract as for me. There are several UI kinds:

- Command line and TUI for devices without graphics (Midnight Commander, FP IDE and so on)
- Classic desktop. DoubleCommander, LazPaint or Lazarus itself, really cool and handy applications where I can not imagine how to apply the kind of UI suggested in the first posts
- Games UI with rich graphics and effects
- Web UI which actually is an interactive documents where anything could be anywhere and each new site is the some kind of a "Point-and-click" quest
- Mobile UI, designed for extreme conditions like small screens, excessive light, shaking, controlling only by one-two fingers
- "Toys", some crazy mix of the last two-three ones. The modern antiviruses for Windows like Comodo is the good example I think  :)

So what we are discussing, in particular?
OS: Linux Mint + MATE, Compiler: FPC trunk (yes, I am risky!), IDE: Lazarus trunk

x2nie

  • Hero Member
  • *****
  • Posts: 515
  • Impossible=I don't know the way
    • impossible is nothing - www.x2nie.com
Re: Modern UI in Lazarus
« Reply #137 on: May 01, 2017, 10:25:30 am »
... So what we are discussing, in particular?
Nope, it was a bit out of topic (from original poster to tenth page).
I think the summary is: what way we can achieve a good looking GUI, using Lazarus/FeePascal.
And there were some reasonable suggestions right here: 8-)
  • Using Lazarus + LCL + CSS <---- I loveit
  • Using FreePascal + MSEGUI/fpGUI
  • Using Lazarus appliaction as webbrowser of HTML + CSS (Chromium Embeded)
  • Using Lazarus + BGRA library
  • +still counting...
When you were logged in, you can see attachments.
Lazarus Github @ UbuntuCinnamon-v22.04.1 + LinuxMintDebianEdition5

marcov

  • Administrator
  • Hero Member
  • *
  • Posts: 11383
  • FPC developer.
Re: Modern UI in Lazarus
« Reply #138 on: May 01, 2017, 10:36:51 am »
There are ten pages already so I beg you pardon for repetition if any.

"Modern UI" is something abstract as for me. There are several UI kinds:

- Command line and TUI for devices without graphics (Midnight Commander, FP IDE and so on)
- Classic desktop. DoubleCommander, LazPaint or Lazarus itself, really cool and handy applications where I can not imagine how to apply the kind of UI suggested in the first posts
- Games UI with rich graphics and effects
- Web UI which actually is an interactive documents where anything could be anywhere and each new site is the some kind of a "Point-and-click" quest
- Mobile UI, designed for extreme conditions like small screens, excessive light, shaking, controlling only by one-two fingers
- "Toys", some crazy mix of the last two-three ones. The modern antiviruses for Windows like Comodo is the good example I think  :)

So what we are discussing, in particular?

More importantly there are also radically different ways of achieving goals, namely doing so with existing desktop tools (LCL,LCL-customdrawn,fpgui,msegui,TV/FV) which will always be "less weblike" OR

moving to something much closer to a webbrowser. Either by making something new that is closer to the web browser rendering model or instantiating full browsers within your application.

A possible hybrid is QT Quick.  Maybe fpgui and msegui have different rendering models that are adaptable enough.
« Last Edit: May 01, 2017, 10:52:55 am by marcov »

lainz

  • Hero Member
  • *****
  • Posts: 4460
    • https://lainz.github.io/
Re: Modern UI in Lazarus
« Reply #139 on: May 01, 2017, 03:04:24 pm »
So, I see our topic a little bit moving towards the flood (((
The other day I tried to work with the library BGRAControls (great respect lainz). It was cool! Despite the fact that this framework is still a beta version (no offense, lainz), you can start working with it.

After thinking, I thought that the initial option might be something between CSS & LCL;)
For example, so. A certain parent class (let's call it TMUIComponent) for visual components has the property self.Appearance (or something like that). This is a set of TStringList with lines of CSS-code. For example:

Code: Pascal  [Select][+][-]
  1. type TMuiComponent = class() // accurate inheritance should be clarified
  2.   published
  3.     property Appearance: TStringList read FAppearance write SetAppearance;
  4. end;
  5.  
  6. type TMuiForm = class(TMuiComponent)
  7.   //...
  8. end;
  9.  
  10. type TMuiButton = class(TMuiComponent)
  11.   //...
  12. end;
  13.  

Each control, including forms and possibly dialogs, inherits this class.

The main CSS code can be attached to the application as a resource (for example, the styles.css file). In this file, the appearance for controls, forms, etc., as well as their behavior when hovering the mouse, clicking, and other events in the UI can be registered.

An example of how I see styles through CSS.
Styles.css
Code: CSS  [Select][+][-]
  1. TMuiForm
  2. {
  3.         width: 640px;
  4.         height: 480px;
  5.         caption: 'Test caption';
  6.         isVisible: true;
  7.         position: [poDesktopCenter];
  8. }
  9.  

I attached screenshots of the programs made with BRGAControls. One program is mine - (Just for fun;)), one of the demos.

P.s. It would be interesting if smart and quick peoples from big corporations read this topic and are preparing to release a new commercial product, hahaha...

Hi, please I'm not the original author of BGRAControls, thanks first to Dibo, Circular and all the contributors. I'm working in other projects that's the reason I didn't add new components recently to this package.

MISV

  • Hero Member
  • *****
  • Posts: 783
Re: Modern UI in Lazarus
« Reply #140 on: May 22, 2017, 06:25:17 pm »
Do you guys think there could a LCL to BGRAControls conversion? Either runtime (so one does not need to patch forms) or designtime?


lainz

  • Hero Member
  • *****
  • Posts: 4460
    • https://lainz.github.io/
Re: Modern UI in Lazarus
« Reply #141 on: May 25, 2017, 12:27:21 am »
Do you guys think there could a LCL to BGRAControls conversion? Either runtime (so one does not need to patch forms) or designtime?

Not possible.

lainz

  • Hero Member
  • *****
  • Posts: 4460
    • https://lainz.github.io/
Re: Modern UI in Lazarus
« Reply #142 on: May 25, 2017, 03:39:12 am »
I continue the discussion of using Electron for the UI here:
https://forum.lazarus.freepascal.org/index.php?topic=36994.msg247319#msg247319

malcome

  • Jr. Member
  • **
  • Posts: 80
Re: Modern UI in Lazarus
« Reply #143 on: May 26, 2017, 06:40:49 am »
JavaScript is modern, Pascal is not modern?

balazsszekely

  • Guest
Re: Modern UI in Lazarus
« Reply #144 on: May 26, 2017, 07:02:18 am »
Quote
@malcome
JavaScript is modern, Pascal is not modern?
Pascal was published in 1970. It's old as hell :D.
Now seriously, by "modern" they are referring to the GUI not the language itself. You now that win10-ish look: few colors, very ugly icons, etc. I'm old enough to remember the 16 colors era, which slowly but steadily evolved to true colors, transparency etc. Personally I don't like the "Modern UI"(feel free to disagree with me), but I do understand the reason why it become main stream: nowadays you have to run operating systems on devices with low resources, so less color is actually good.

Thaddy

  • Hero Member
  • *****
  • Posts: 14210
  • Probably until I exterminate Putin.
Re: Modern UI in Lazarus
« Reply #145 on: May 26, 2017, 07:12:11 am »
Quote
@malcome
JavaScript is modern, Pascal is not modern?
Pascal was published in 1970. It's old as hell :D.
Now seriously, by "modern" they are referring to the GUI not the language itself. You now that win10-ish look: few colors, very ugly icons, etc. I'm old enough to remember the 16 colors era, which slowly but steadily evolved to true colors, transparency etc. Personally I don't like the "Modern UI"(feel free to disagree with me), but I do understand the reason why it become main stream: nowadays you have to run operating systems on devices with low resources, so less color is actually good.
Those devices have probably more resources than our first PC's. You were lucky to have CGA (16 colors,but restricted to 160X100 pixels I believe) I started with a Hercules card (1 color since black isn't a color + tricks...)
Specialize a type, not a var.

balazsszekely

  • Guest
Re: Modern UI in Lazarus
« Reply #146 on: May 26, 2017, 07:23:20 am »
Quote
@Thaddy
Those devices have probably more resources than our first PC's. You were lucky to have CGA (16 colors,but restricted to 160X100 pixels I believe) I started with a Hercules card (1 color since black isn't a color + tricks...)
True. The most annoying thing was the low quality monitor though. After 1-2 hours of programming your eyes/head "exploded".

Abelisto

  • Jr. Member
  • **
  • Posts: 91
Re: Modern UI in Lazarus
« Reply #147 on: May 26, 2017, 12:16:54 pm »
Quote
@Thaddy
Those devices have probably more resources than our first PC's. You were lucky to have CGA (16 colors,but restricted to 160X100 pixels I believe) I started with a Hercules card (1 color since black isn't a color + tricks...)
True. The most annoying thing was the low quality monitor though. After 1-2 hours of programming your eyes/head "exploded".

My first home PC was with CGA/Hercules card/monitor (I don't remember how it was switched, by mode command probably). And Hercules was excellent, no any tiredness of eyes.

About the topic, there is one sad life story... There was a cute desktop application, pgAdminIII, built on wxWidgets library (something like LCL/VCL for C++) and it works well on any popular OSes. But once some developers makes decision to move it to "modern technologies". They worked hard for a long time and rewrote it from scratch on Python+JS+CSS+HTML+Webkit. And for now, pgAminIV, is ambiguously huge, slow, uncomfortable and glitch. IMHO trying to make desktop applications on the WEB technologies is the wrong way.

Actually, there is yet another application, FreeDownloadManager, where UI was switched to Chromium embedded, with ambiguous resources usage, slow, poor UI (but, yes, modern), and after that I just dropped to use it (remember please, it is my IMHO :o) )

And there were some reasonable suggestions right here: 8-)
  • Using Lazarus + LCL + CSS <---- I loveit
  • ...

Somewhere it is already done on the OS (desktop environment) level: https://developer.gnome.org/gtk3/stable/chap-css-overview.html (or just search for "gtk css")
(Yes, I know about Linux place on the desktops market, it is really sad...)
« Last Edit: May 26, 2017, 01:53:02 pm by Abelisto »
OS: Linux Mint + MATE, Compiler: FPC trunk (yes, I am risky!), IDE: Lazarus trunk

lainz

  • Hero Member
  • *****
  • Posts: 4460
    • https://lainz.github.io/
Re: Modern UI in Lazarus
« Reply #148 on: May 26, 2017, 03:27:23 pm »
Quote
@malcome
JavaScript is modern, Pascal is not modern?
Pascal was published in 1970. It's old as hell :D.
Now seriously, by "modern" they are referring to the GUI not the language itself. You now that win10-ish look: few colors, very ugly icons, etc. I'm old enough to remember the 16 colors era, which slowly but steadily evolved to true colors, transparency etc. Personally I don't like the "Modern UI"(feel free to disagree with me), but I do understand the reason why it become main stream: nowadays you have to run operating systems on devices with low resources, so less color is actually good.

Even Material Design Lite runs slowly on my Android device when full of animated controls. On the other hand there are modern video games with nothing lite, but GB of download and need of the newest graphics cards, also for the UI.

I'm not that old, I can remember the Win95 at 640x480 256 colors, but nothing older. Even that icons was not aimed to be flat, these was 3d like, but 16x16 pixels or 32x32.

The ugly icons is because vector icons can be scaled at any resolution, like fonts. And of course are easier to create.

Currently I use a software made with Electron that's Gitkraken and of course my own software.

When Modern UI get's replaced with something else... and so on.

laggyluk

  • Jr. Member
  • **
  • Posts: 69
Re: Modern UI in Lazarus
« Reply #149 on: May 31, 2017, 11:45:51 am »
... So what we are discussing, in particular?
Nope, it was a bit out of topic (from original poster to tenth page).
I think the summary is: what way we can achieve a good looking GUI, using Lazarus/FeePascal.
And it looks like there's no 'easy' way :P
What I understand by modern UI, apart from the looks is:
  • ability to nest one element in another without much restriction to their type (i.e place panel in label)
  • elements have pivot and anchors and can adjust when parent is being resized (and I mean every element not some)
  • scale, rotate elements
  • dynamic font size as a bonus
  • easily build your own components by stacking together bunch of primitive ones (which requires all of the above)
I've been using Unity and UE4 for couple of years and funny thing, they are game engines not desktop program 'designers' like Lazarus. And yet it's quite easy to create GUI for desktop app in them that is way closer to my vision than anything I can make in Lazarus  :(
So yeah, my idea of modern UI is ability to build what I think would work best for given scenario, not what I'm allowed to build within tight design constrains.

A comment about the praised OpenGL:
OpenGL for widgetset drawing is a nightmare to work with. There are uncountable different versions with different extensions, limitations and bugs.
+1
After working with OpenGL for the last few months I definitely feel that pain.
I might be wrong but you don't need to use much of fancy stuff to draw unlit gui elements?

 

TinyPortal © 2005-2018