YouTube - Thorsten Geppert

wxWidgets-Tutorial 012: wxSizer verschachteln

24. März 202528. Februar 2025 Thorsten Geppert Schreib einen Kommentar

In diesem Video zeige ich, wie einfach es ist, wxSizer zu verschachteln.

Um komplexe GUIs zu entwickeln, ist es unabdingbar, dass man Sizer ineinander verschachteln kann. Damit lassen sich einfach und übersichtlich Formulare entwickeln, die dem Benutzer einen hohen Mehrwert bringen.

Sizer (Layoutmanager): wxSizer verschachteln

Hier ein Screenshot unseres Programms:

Hier der Quelltext:

#include <wx/wx.h>

class MyApp : public wxApp {

	public:
		bool OnInit();

};

class MyFrame : public wxFrame {

	public:
		MyFrame();

};

IMPLEMENT_APP(MyApp)

bool MyApp::OnInit() {
	auto *myFrame = new MyFrame;
	myFrame->Show();

	SetTopWindow(myFrame);

	return true;
}

MyFrame::MyFrame() : wxFrame(nullptr, wxID_ANY, _("Sizer in Sizers")) {
	auto *mainPanel = new wxPanel(this);

	auto *mainBoxSizer = new wxBoxSizer(wxHORIZONTAL);

	auto *flexGridSizer = new wxFlexGridSizer(2, 5, 5);

	flexGridSizer->AddGrowableCol(1);
	flexGridSizer->AddGrowableRow(4);

	flexGridSizer->Add(new wxStaticText(mainPanel, wxID_ANY, _("Firstname:")), 0, wxALIGN_CENTER_VERTICAL | wxALIGN_RIGHT);
	flexGridSizer->Add(new wxTextCtrl(mainPanel, wxID_ANY), 0, wxEXPAND);

	flexGridSizer->Add(new wxStaticText(mainPanel, wxID_ANY, _("Lastname:")), 0, wxALIGN_CENTER_VERTICAL | wxALIGN_RIGHT);
	flexGridSizer->Add(new wxTextCtrl(mainPanel, wxID_ANY), 0, wxEXPAND);

	flexGridSizer->Add(new wxStaticText(mainPanel, wxID_ANY, _("Zipcode/City:")), 0, wxALIGN_CENTER_VERTICAL | wxALIGN_RIGHT);

	auto *addressSizer = new wxBoxSizer(wxHORIZONTAL);
	addressSizer->Add(new wxTextCtrl(mainPanel, wxID_ANY));
	addressSizer->AddSpacer(5);
	addressSizer->Add(new wxTextCtrl(mainPanel, wxID_ANY), 1);

	flexGridSizer->Add(addressSizer, 0, wxEXPAND);

	flexGridSizer->Add(new wxStaticText(mainPanel, wxID_ANY, _("Age:")), 0, wxALIGN_CENTER_VERTICAL | wxALIGN_RIGHT);
	flexGridSizer->Add(new wxTextCtrl(mainPanel, wxID_ANY));

	flexGridSizer->Add(new wxStaticText(mainPanel, wxID_ANY, _("Informations:")));
	flexGridSizer->Add(new wxTextCtrl(mainPanel, wxID_ANY), 0, wxEXPAND);

	mainBoxSizer->Add(flexGridSizer, 1, wxEXPAND | wxALL, 15);

	mainPanel->SetSizer(mainBoxSizer);
	mainBoxSizer->SetSizeHints(this);
}

Hier geht es zum Video.

wxWidgets-Tutorial 011 – wxFlexGridSizer

17. März 202528. Februar 2025 Thorsten Geppert Schreib einen Kommentar

In diesem Video zeige ich die Verwendung von wxFlexGridSizer.

Im Gegensatz zum wxBoxSizer, der Elemente nur horizontal oder vertikal ausrichten kann, dient der wxFlexGridSizer wie eine Tabelle, in der bestimmt werden kann, welche Spalten und Zeilen sich ausdehen durfen und in dem man einfach Formulare zusammensetzen kann.

Hier ein Screenshot unseres Programms:

Hier der Quelltext:

#include <wx/wx.h>

class MyApp : public wxApp {

	public:
		bool OnInit();

};

class MyFrame : public wxFrame {

	public:
		MyFrame();

};

IMPLEMENT_APP(MyApp)

bool MyApp::OnInit() {
	auto *myFrame = new MyFrame;
	myFrame->Show();

	SetTopWindow(myFrame);

	return true;
}

MyFrame::MyFrame() : wxFrame(nullptr, wxID_ANY, _("wxFlexGridSizer")) {
	auto *mainPanel = new wxPanel(this);

	auto *flexGridSizer = new wxFlexGridSizer(2, 5, 5);

	flexGridSizer->AddGrowableCol(1);
	flexGridSizer->AddGrowableRow(3);

	flexGridSizer->Add(new wxStaticText(mainPanel, wxID_ANY, _("Firstname:")), 0, wxALIGN_CENTER_VERTICAL | wxALIGN_RIGHT);
	flexGridSizer->Add(new wxTextCtrl(mainPanel, wxID_ANY), 0, wxEXPAND);

	flexGridSizer->Add(new wxStaticText(mainPanel, wxID_ANY, _("Lastname:")), 0, wxALIGN_CENTER_VERTICAL | wxALIGN_RIGHT);
	flexGridSizer->Add(new wxTextCtrl(mainPanel, wxID_ANY), 0, wxEXPAND);

	flexGridSizer->Add(new wxStaticText(mainPanel, wxID_ANY, _("Age:")), 0, wxALIGN_CENTER_VERTICAL | wxALIGN_RIGHT);
	flexGridSizer->Add(new wxTextCtrl(mainPanel, wxID_ANY));

	flexGridSizer->Add(new wxStaticText(mainPanel, wxID_ANY, _("Informations:")));
	flexGridSizer->Add(new wxTextCtrl(mainPanel, wxID_ANY), 0, wxEXPAND);

	mainPanel->SetSizer(flexGridSizer);
	flexGridSizer->SetSizeHints(this);
}

Hier geht es zum Video.

wxWidgets-Tutorial 010 – wxBoxSizer

10. März 202528. Februar 2025 Thorsten Geppert Schreib einen Kommentar

In diesem Video beginnen wir mit Sizern, im Speziellen mit wxBoxSizer.

Layoutmanager sind essentiell bei der Programmierung von grafischen Benutzeroberflächen. Gab es zu Beginn der grafischen Benutzeroberflächen teils nur die Möglichkeit, Elemente absolut positioniert zu platzieren, bieten Layoutmanager, bei wxWidgets Sizer genannt, die Möglichkeit, die Ausrichtung und Anordnung dynamisch zu gestalten.

Der wxBoxSizer kann Elemente horizontal oder vertikal anordnen, proportional vergrößern und verkleiner, ausrichten und vieles mehr.

Hier ein Screenshot unseres Programms:

Hier der Quelltext:

#include <wx/wx.h>

class MyApp : public wxApp {

	public:
		bool OnInit();

};

class MyFrame : public wxFrame {

	public:
		MyFrame();

};

IMPLEMENT_APP(MyApp)

bool MyApp::OnInit() {
	auto *myFrame = new MyFrame;
	myFrame->Show();

	SetTopWindow(myFrame);

	return true;
}

MyFrame::MyFrame() : wxFrame(nullptr, wxID_ANY, _("wxBoxSizer")) {
	auto *mainPanel = new wxPanel(this);
	auto *mainBoxSizer = new wxBoxSizer(wxHORIZONTAL); // wxVERTICAL

	mainBoxSizer->Add(new wxTextCtrl(mainPanel, wxID_ANY, _("Eingabefeld 1")), 1, wxEXPAND | wxLEFT | wxTOP | wxBOTTOM, 5);
	mainBoxSizer->Add(new wxTextCtrl(mainPanel, wxID_ANY, _("Eingabefeld 2")), 2, wxEXPAND | wxALL, 5);
	mainBoxSizer->AddStretchSpacer();
	mainBoxSizer->Add(new wxTextCtrl(mainPanel, wxID_ANY, _("Eingabefeld 3")), 1, wxEXPAND | wxRIGHT | wxTOP | wxBOTTOM, 5);


	auto *tmp = new wxTextCtrl(mainPanel, wxID_ANY, _("Eingabefeld 0"));
	mainBoxSizer->Insert(0, tmp, 1, wxEXPAND | wxRIGHT | wxTOP | wxBOTTOM, 5);
	mainBoxSizer->InsertSpacer(0, 50);

	mainBoxSizer->Detach(1);
	tmp->Destroy();


	mainPanel->SetSizer(mainBoxSizer);
	mainBoxSizer->SetSizeHints(this);

	std::cout << "Element count: " << mainBoxSizer->GetItemCount() << std::endl;
	std::cout << "Position: " << mainBoxSizer->GetPosition().x << "x" << mainBoxSizer->GetPosition().y << std::endl;
	std::cout << "Size: " << mainBoxSizer->GetSize().GetWidth() << "x" << mainBoxSizer->GetSize().GetHeight() << std::endl;
}

Hier geht es zum Video.

Qt-Tutorial 042: QStatusBar

3. März 202528. Februar 2025 Thorsten Geppert Schreib einen Kommentar

In diesem Video zeige ich, wie man mit der Statusbar (QStatusBar) umgehen kann.

Viele Fenster des benutzten Fenstermanagers haben am unteren Rand eine Leiste, die manchmal einfach nur da ist, manchmal Informationen anzeigt, manchmal aber auch Interaktionen anbietet. Dieses Video zeigt, wie man Informationen dauerhaft oder für eine gewisse Zeit anzeigt oder Widgets hinzufügt.

Hier ein Bild unseres Programms:

Screenshot von unserem Beispielprogramm mit QStatusBar

Hier geht es zum Video.

FreeBSD-Grundkurs 033: MySQL für aufbauende Videos installieren

27. Dezember 202422. Dezember 2024 Thorsten Geppert Schreib einen Kommentar

https://youtu.be/o7JoKRrQDkQIch möchte bald ein paar Videos machen, für die wir ein DMBS benötigen. In diesem Video zeige ich, wie man eine einfache (unsichere und für Produktivumgebungen nicht zu verwendende!) MySQL-Datenbank unter FreeBSD (14.2) installieren kann.

FreeBSD-Grundkurs: MySQL für spätere Videos installieren

Die Vorgehensweise

# pkg install mysql90-server
/etc/rc.conf bearbeiten
- mysql_enable=“YES“
- mysql_dbdir=“/server/database/mysql“
Verzeichnis erstellen
- # mkdir -p /server/database/mysql
- # chown -R mysql:mysql /server/database/mysql
MySQL starten
- service mysql-server start
Datenbank anlegen
- mysqladmin create youtube
Benutzer und Berechtigungen erstellen
- # mysql mysql
- > CREATE USER ‚youtube’@’%‘ IDENTIFIED BY ‚youtube‘;
- > GRANT ALL PRIVILEGES ON * . * TO ‚youtube’@’%‘;
- > FLUSH PRIVILEGES;

Hier geht es zum Video.

FreeBSD-Grundkurs 032: PostgreSQL für aufbauende Videos installieren

23. Dezember 202422. Dezember 2024 Thorsten Geppert Schreib einen Kommentar

Ich möchte bald ein paar Videos machen, für die wir ein DMBS benötigen. In diesem Video zeige ich, wie man eine einfache (unsichere und für Produktivumgebungen nicht zu verwendende!) PostgreSQL-Datenbank (17) unter FreeBSD (14.2) installieren kann.

FreeBSD-Grundkurs: PostgreSQL für spätere Videos installieren

Die Vorgehensweise

pkg install postgresql17-server
/etc/rc.conf bearbeiten
- postgresql_enable=“YES“
- postgresql_data=“/server/database/postgres“
- postgresql_flags=“-w -s -m fast“
- postgresql_initdb_flags=“–encoding=utf-8 –lc-collate=C“
Datenbankverzeichnis erstellen
- # mkdir -p /server/database/postgres
- # chown -R postgres:postgres /server/database/postgres
PostgreSQL initialisieren
- # service postgresql initdb
Konfigurationen bearbeiten
- /server/database/postgres/pg_hba.conf
- /server/database/postgres/postgresql.conf
Datenbankbenutzer erstellen
- # createuser -s -P youtube
Datenbank erstellen
- # createdb -O youtube -E unicode

Hier geht es zum Video.

Redmine 5.1 auf FreeBSD

15. November 202415. November 2024 Thorsten Geppert Schreib einen Kommentar

Obwohl es bereits Redmine 6.0.1 zum jetzigen Zeitpunkt gibt, haben wir unter FreeBSD bisher leider „nur“ Version 5.1 zur Verfügung. Allerdings gab es auch eine ganze Weile lang keine lauffähige Redmine-Version für FreeBSD in den Packages und Ports.

Ich habe Version 5.1 testweise in einer VM installiert und es funktionierte problemlos. Letztlich kann man nach dieser Anleitung vorgehen:

Redmine-Reihe 1 von 3: Redmine 4 installieren (auf FreeBSD 13)

Ich freue mich darüber, dass es funktioniert und wir Redmine weiterhin unter FreeBSD nutzen können und hoffe, dass es bald auch eine aktuellere Version gibt.

wxWidgets-Tutorial 009 – Das Gründgerüst: wxApp

1. Oktober 20241. Oktober 2024 Thorsten Geppert Schreib einen Kommentar

In diesem Video zeige ich das Grundgerüst einer wxWidgets-Anwendung. Wir implementieren unsere eigene wxApp und schreiben die main-Funktion einmal via wx-Makro und einmal händisch.

Das Gründgerüst: wxApp — Das Grundgerüst: wxApp

Viel Spaß beim Implementieren.

Hier geht es zum Video.

Bald neue Videos

24. September 202423. September 2024 Thorsten Geppert Schreib einen Kommentar

Viele haben mir geschrieben, dass ich doch weitere Videos bzw. Tutorials machen soll. Das freut mich sehr.

Zur Zeit nimmt mich die neue Arbeitstelle und meine Familie gut ein, ich habe aber schon die nächsten Videos geplant (Themen: wxWidgets, Qt und auch FreeBSD) und freue mich, sie bald machen und veröffentlichen zu können. Es dauert allerdings noch ein paar Tage. Aber: Es wird mit den Tutorials weiter gehen.

Wenn ihr Vorschläge für bestimmte Themen habt, gerne her damit.

KooKooK (Update 4): Die Authentifizierung im Einzelnen

5. Januar 20236. Januar 2023 Thorsten Geppert Schreib einen Kommentar

Vielleicht interessiert es den ein oder anderen, wie ich die Authentifizierung durchführe. Mich würde unbedingt Eure Meinungen interessieren.

Ziel war es, dass man nicht Benutzername und Kennwort über die Leitung zum Server zur Verifizierung überträgt, da ich das für unsicher halte. Ich habe es erst einmal so gelöst:

Client verbindet sich zum Server
TLS-Handshake
Server sendet Welcome-Message an Client. Die Welcome-Message besteht aus der Versionsnummer des Servers sowie einer UUID, getrennt mit einem Doppelpunkt (1.0.1:8234-234-234-234)
Der Client trennt die empfangene Versionsnummer von der UUID anhand des Doppelpunkts
Der Benutzer hat am Client den Benutzernamen und das Kennwort eingegeben
1. Das Kennwort wird mit MD5 gehasht
2. Benutzername, UUID und gehashtes Kennwort wird als Bytearray zusammengefasst und mit Keccak_512 gehasht
3. Daraus entsteht dann das Bytearray, was zum Server geschickt werden soll
Das gehashte Bytearray mit vorangestelltem Benutzername@ wird zum Server geschickt (ausgedachtes Beispiel: thorsten@ljdf08asdflu0dsa98foklj234ASDF)
Der Server hat jetzt den unverschlüsselten Benutzernamen, der eindeutig in der Datenbank ist und zieht das Kennwort, fügt auch alles zusammen und hasht dann das Bytearray
Der Server vergleicht, ob das empfangene Bytearray gleich dem selbst generiertem Bytearray ist. Ja = Der Benutzer ist eingeloggt, Nein = Der Benutzer ist nicht eingeloggt

Anmerkungen: In der Implementierung werden weitere Fehler behandelt und zurückgeliefert. Beispielsweise, ob der Benutzer überhaupt vorhanden ist, ob der Hash gebildet wurde, usw. Was noch fehlt ist, ob der Benutzer auch (in der Datenbank) auf aktiv steht.

Ihr könnt das in folgenden Dateien nachvollziehen:

Mitunter sollte man weitergehen und zum Beispiel auch den Benutzernamen nicht im Klartext senden?