GUI Design - kein Standard

[hubblec4]

Hallo Laz-Gemeinde


Ich habe diesmal eine Frage zu der GUI-Oberfläche für eigene Programme.

Normalerweise lege ich jetzt nicht sooo viel Wert auf das aussehen in der GUI.
Jetzt habe ich aber ein Projekt bekommen wo es doch eben bissl schick und schön sein muss.

Ich selbst arbeite an einer Win7 64bit Machine mit der Windows Classic Ansicht(also noch mit dem 4-eicken grauen START-button).

In meinen Progs kann ich zum Beispiel

Code: Alles auswählen

 Statusbar.Color:=clred

angeben und es wird rot.
Wenn ich aber schon Win7 nicht mehr auf Classic-Ansicht stehen habe, verändert sich die Farbe für die Statusbar nicht mehr.
Noch schlimmer sehen meine Progs auf Win8/10 aus. Da werden sogar die Panels und andere Sachen so schlimm und hässlich dargestellt das es einfach nicht mehr schön ist.


ALso die grosse NOOB-Frage lautet:
Wie oder was muss ich tun, damit ich in meinen Progs eine eigene grafische Oberfläsche habe die Windows nicht verändert.

hubble

[wp_xyz]

In den Projekteinstellungen das Häkchen bei "Themen mit Manifest-Datei einschalten" entfernen. Damit erscheint dein Programm auch bei Windows mit aktivierten Themes so wie bei deiner Classic-Oberfläche und du kannst die Farben nach Belieben setzen. (Ist aber nicht jedermann's Sache...)

[hubblec4]

In den Projekteinstellungen das Häkchen bei "Themen mit Manifest-Datei einschalten" entfernen. Damit erscheint dein Programm auch bei Windows mit aktivierten Themes so wie bei deiner Classic-Oberfläche und du kannst die Farben nach Belieben setzen. (Ist aber nicht jedermann's Sache...)

danke für den tipp werde ich testen.

was gibts denn sonst noch für Oberflächenverändernte Komponeten?

Was macht denn dieses Windows Manifest? Könnte ich da auch was eigenes schreiben/verwenden?

[SoE]

Das hier ist für Windows Fans 'ne Möglichkeit 100% echte Non-Standard GUI zu zaubern. Mit einem oder sehr vielen PNG's.
(Zugegeben, in Bezug auf Standard Programme ist das eher mit 'nem Augenzwinkern zu verstehen...grins...)
Wie man das unter Linux macht hab' ich noch nicht herausgefunden...

Code: Alles auswählen

 
Unit uTEST;
 {$mode objfpc}{$H+}
 
Interface
 
 Uses
  Windows, Messages, Classes, SysUtils, FileUtil, Forms, Controls, Graphics, Dialogs,
  ExtCtrls;
 
 Type
  TForm1 = Class(TForm)
   Procedure FormClose(Sender: TObject; Var CloseAction: TCloseAction);
   Procedure FormCreate(Sender: TObject);
    Private
    Public
  End;
 
 Var
  Form1: TForm1;
 
  Blendfunction     : TBlendFunction;
  point_PNGPosition : TPoint;
  size_PNG          : TSize;
  dword_exStyle     : DWORD;
  Bild              : TPicture;
 
  Function UpdateLayeredWindow(hwnd: HWND; hdcDst: HDC; pptDst: PPoint; psize: PSize; hdcSrc: HDC; pptSrc: PPoint; crKey: TColor; pblend: PBlendFunction; dwFlags: DWORD): BOOL; stdcall; external 'user32';
 
Implementation
 {$R *.lfm}
 
Procedure TForm1.FormCreate(Sender: TObject);
 Begin
  Bild := TPicture.Create;
  Bild.LoadFromFile('Bild.png');
  // Funzt genauso mit TImage...
 
  dword_exStyle := GetWindowLongA(Form1.Handle, GWL_EXSTYLE);
   If (dword_exStyle And WS_EX_LAYERED = 0)
   Then SetWindowLong(Form1.Handle, GWL_EXSTYLE, dword_exStyle Or WS_EX_LAYERED Or WS_EX_TOPMOST);
 
  point_PNGPosition := Point(0, 0);
  size_PNG.cx       := Bild.Width;
  size_PNG.cy       := Bild.Height;
 
  Blendfunction.BlendOp             := AC_SRC_OVER;
  Blendfunction.BlendFlags          := 0;
  Blendfunction.SourceConstantAlpha := 255;
  Blendfunction.AlphaFormat         := AC_SRC_ALPHA;
 
  UpdateLayeredWindow(Form1.Handle, 0, Nil, @size_PNG, Bild.Bitmap.Canvas.Handle, @point_PNGPosition, 0, @Blendfunction, ULW_ALPHA);
 End;
 
Procedure TForm1.FormClose(Sender: TObject; var CloseAction: TCloseAction);
 Begin
  FreeAndNil(Bild);
 End;
End.                 
 

Die Windows API erwartet einen premultiplied AlphaKanal damit die Transparenz funktioniert.
Mit GIMP geht das so:

Premultiplied PNG
=================
3 einfache Schritte:
(Auswahl speichern, schwarze Ebene dahinter, Ebenenmaske erstellen)

1. Bild laden
2. Auswahl aus Alpha-Kanal
3. Auswahl speichern (im Kanal)
4. Nichts auswählen
5. Neue 100% schwarze Ebene hinter bzw. unter das Bild legen
6. Rechtsklick auf das Bild - nach unten vereinen
7. Kanal anklicken - Auswahl aus Kanal (gespeicherte Auswahl)
8. Bild Rechtsklick - Ebenenmaske hinzufügen (Auswahl anklicken)
9. Speichern (Exportieren als PNG)

Funzt genauso in Photoshop...
=============================

Und sei es nur mal für einen Splash-Screen... grins...
Wie heißt das noch gleich.. ich glaub' alphablended translucency...
Das Nonplusultra für jede GUI, wenn man Zeit hat und ein Bastlerherz...

[SoE]

Hi,
wie sieht es aus mit Skin-Komponenten wie LazSkin oder gibt es keine Freeware Skin-Komponenten.
Irgendein VCLSkin für Lazarus oder so...

Oder kann man Delphi-Freeware Komponenten, die GR32 benutzen, portieren?
Wie ich gehört habe kann man GR32 auch unter Lazarus einsetzen.

Sowas wie:
SkinnedComponentPackage
SXSkinComponents
...
Keine Ahnung wie viel Arbeit eine Portierung mit sich bringen würde...

[Antrepolit]

(...)
Wenn ich aber schon Win7 nicht mehr auf Classic-Ansicht stehen habe, verändert sich die Farbe für die Statusbar nicht mehr.
Noch schlimmer sehen meine Progs auf Win8/10 aus. Da werden sogar die Panels und andere Sachen so schlimm und hässlich dargestellt das es einfach nicht mehr schön ist.


ALso die grosse NOOB-Frage lautet:
Wie oder was muss ich tun, damit ich in meinen Progs eine eigene grafische Oberfläsche habe die Windows nicht verändert.

hubble

Hallo Hubblec4,

zunächst einmal ist das Aussehen eine subjektive Ansichtssache. Was du schön findest - nämlich diesen altbackenen Kasten-Style - den finden fast alle hässlich. Das siehst du daran, dass spätestens bei Linux-Oberflächen das Grafikbasteln zur leidigsten aller Nebensächlichkeiten geworden ist. Und deshalb sollte man Benutzern keinen Style aufzwingen, sondern den Systemstandard lassen. Denn letztlich bastelt man nur wieder herum. Und spätestens dann, wenn du schwarzen Titeltext erzwingst, und ein anderer schwarze Fensterhintergründe nutzt, dann wird er deine Software sowieso nicht nutzen (können).

Ich persönlich habe meine Meinung zu Selbstbastel-GUIs. Auf der Arbeit muss ich oft ein Tool benutzen, dass einen eigenen "Style" hat. Dieses Scheißtool ist sehr teuer, kann sich jedoch nicht an die Schriftgrößeneinstellungen anpassen. Da mein Ultrabook eine sehr hohe Auflösung hat, sind die Buttons zum darauf klicken so klein, dass man sie kaum trifft. Zu allem Überfluss hat sich kein Entwickler die Mühe gemacht, Shortcuts der Tastatur zu vergeben oder die Tab-Order überhaupt zu ermöglichen. Das ist dann Schrottware. Und wenn du einmal so weit bist, merkst du von ganz alleine, dass niemand mehr deine Software haben möchte.

[hubblec4]

@Antrepolit

Danke für deine Antwort.
Ja Aussehen und wie das der Betrachter dann empfindet ist für jeden verschieden.

Ich möchte auch auf keinen Fall selbst hand anlegen an irgendwelche Styles und gar Pics(ausser BitButtons und im Menü) selbst erstellen udn laden und verwalten... da hast du ja schon gute argumente dafür aufgezeigt.

Also verstehe ich es so, dass mein Programm bei jemandem läuft wo Style"A" aktiviert ist es eben anders aussieht als bei jemandem wo Style"B" aktiviert ist.

Ich hatte in einem anderen Thema schonmal daruaf hingewiesen das in den Dialog Boxen auch keine Icons mehr in den Buttons sind.

Was macht es dann noch für einen Sinn an einer Statusbar oder Panel die Eigenschaft Color anzusprechen wenn es im endefekt keine sichtbare veränderung gibt?

Es muss doch möglich sein trotz dieser Styles und dem Manifest in der GUI Farben zu verwenden.

LG
hubble

[hubblec4]

In den Projekteinstellungen das Häkchen bei "Themen mit Manifest-Datei einschalten" entfernen. Damit erscheint dein Programm auch bei Windows mit aktivierten Themes so wie bei deiner Classic-Oberfläche und du kannst die Farben nach Belieben setzen. (Ist aber nicht jedermann's Sache...)

Hatte ich damals schon wegen den Icons für die Dialog-Buttons gemacht und hatte auch nicht funktioniert.
Alles sieht immer noch so blöd aus

[Warf]

Nun zunächst möchte ich dir davon abraten ein eigenes Design zu machen denn:
1. Es sieht sehr wahrscheinlich nicht gut aus. Die meisten Programmierer haben keinerlei Ahnung von Design. Und ich sehe zu oft wenn Entwickler ihr eigenes Design machen, dass es einfach nur im Bezug auf Farbharmonien und Designaufbau einfach nur scheiße produzieren. Für so etwas gibt es nun mal Designer.
2. Je nach Benutzer passen viele ihren Betriebssystemstil mit Designs an, sodass deine Anwendung dann einfach nicht zum rest passen würde.

Wenn du dennoch dein eigenes Design machen willst gibt es dafür ein Paar Möglichkeiten.
1. Du könntest ein Anderes WidgetSet verwenden wie QT oder GTK, diese sehen erst einmal standardmäßig etwas anders aus als Windows Forms, und bieten teilweise mehr anpassungsmöglichkeiten.
2. Andere GUI Komponenten, z.B. die BGRAControls
3. Eigene GUI Komponenten erstellen. Das ist etwas aufwendig, du kannst sie dir aber so Zeichnen wie du sie gerne hättest. Vor einiger Zeit habe ich mal angefangen eine eigene Komponentenpalette zu entwickeln (hauptsächlich für den Minimalstil ausgelegt), allerdings hatte mir dann die Zeit gefehlt daran weiter zu arbeiten, und bis heute fehlt mir die Motivation es wieder aufzunehmen. Ich kann dir das Package bei Interesse gerne hochladen, es ist allerdings wie gesagt noch nicht ansatzweise vollständig und wahrscheinlich auch noch ein wenig verbuggt

Zu guter letzt noch einen Tipp, wenn du ein eigenes Design für deine Anwendung machen willst nimm dir eine Anwendung bei der dir das Design gefällt und versuche es zu kopieren

[hubblec4]

Hallo Warf

Danke auch für deinen beitrag.

Ich hatte auch eher an so etwas gedacht wie du in punkt 1 erwähnst.
Ein anderes WidgetSet:

Auch da habe ich noch keinerlei erfahrung, wie, wo muss ich da was machen?