Realisierung von Slidern in CONZEPT 16

Ein Slider in CONZEPT 16

Irgendwie hat man es schon immer vermisst, das Slider- oder Schieberegler-Control. Seit das EvtMouseMove-Ereignis des Picture-Objektes das Argument aMouseBtn besitzt, kann das Control mit CONZEPT 16-Bordmitteln erstellt werden.

Vorgabe für unsere Programmierung war, das Control flexibel in der Handhabung und im Design zu gestalten. Es besteht im Wesentlichen aus zwei geschachtelten Picture-Objekten. Das erste enthält den Hintergrund mit dem Balken, das zweite ist dem ersten untergeordnet und enthält den eigentlichen Schieberegler. Die Grafiken können frei gestaltet werden. Für den Hintergrund empfiehlt sich die Grafik zu kacheln, so kann die Breite des Controls beliebig verändert werden.
Der Slider muss vor der Verwendung initialisiert werden, dies geschieht mit der Funktion Slider:Create z.B. im EvtInit-Ereignis eines Dialoges.

Sub Create
(
  aObj 		  : handle;	// Deskriptor des Hintergrund-Pictures
  aMin 		  : int;	// Minimaler Wert
  aMax 		  : int;	// Maximaler Wert
  aPos 		  : int;	// Start-Position
  opt aEvtChanged : alpha;	// Prozedur Changed-Ereignis
) : int

Die Funktion liefert den Deskriptor des Slider-Objekts zurück.

An einem Beispieldialog soll die Funktionsweise erläutert werden:

Test-Dialog mit unterschiedlichen Slidern

Alle Elemente innerhalb des Dialogs sind Slider-Objekte. Diese wurden im EvtInit wie folgt erzeugt (von oben nach unten):

Slider:Create($Slider_iOS,     1,  25,   5);
Slider:Create($Slider_OnOff,   0,   1,   1,
              'SliderTest:EvtChangedSliderOnOff');
Slider:Create($Slider,      -300, 300,   0,
              'SliderTest:EvtChangedSlider');
Slider:Create($Slider_Win7,    1,  12,   7,
              'SliderTest:EvtChangedSliderWin7');
Slider:Create($Slider_XP,      1,  12,   4,
              'SliderTest:EvtChangedSliderXP');
Slider:Create($Slider_Scroll,  0, 439,   0,
              'SliderTest:EvtChangedSliderScroll');
Slider:Create($Slider_Unlock,  1,  10,   1);

Optional kann der Funktion Create() eine Funktion übergeben werden, die beim EvtChanged des zu initialisierenden Sliders aufgerufen wird.

OnOff-Control

OnOff-Control

Im EvtChanged dieses Sliders wird der Hintergrund des Sliders getauscht und die anderen Slider auf ReadOnly bzw. Disabled gesetzt.

Sub EvtChangedSliderOnOff
(
  aObj    : handle;  // Slider-Objekt
  aButton : int;     // Verwendete Maustasten
)
local { SliderBar : int; }
{
  SliderBar # aObj->Slider:GetBar();

  if (aObj->Slider:GetPos() > 0) {
    SliderBar->wpCaption # 'slider_bar_on';
    $Slider_Win7->Slider:SetDisabled(False);
    $Slider->Slider:SetDisabled(False);
    $Slider_iOS->Slider:SetReadOnly(False);
  } else {
    $Slider_Win7->Slider:SetDisabled(True);
    $Slider->Slider:SetDisabled(True);
    SliderBar->wpCaption # 'slider_bar_off';
    $Slider_iOS->Slider:SetReadOnly(True);
  }
}

Einfacher Slider

Einfacher Slider

Bei diesem Slider wird die Slider-Position in einem Labels daneben angezeigt. Dies könnte wie folgt aussehen:

Sub EvtChangedSlider
(
  aObj    : handle;  // Slider-Objekt
  aButton : int;     // Verwendete Maustasten
)
{
  $LabelAnz->wpCaption # CnvAI(aObj->Slider:GetPos());
}

WinXP Slider

Oben: Win7 Slider Unten: WinXP Slider

Dieser Slider “zieht” den Win7 Slider mit sich.

$Slider_Win7->Slider:SetPos(aObj->Slider:GetPos());

Scrollbar Slider

Scrollbar Slider

Dieser Slider verschiebt die darüber liegende GroupBox mit dem Befehl:

$GroupboxScroll->wpAreaLeft # - aObj->Slider:GetPos();

Groupbox durch Slider verschoben

Unlock-Slider

Unlock Slider

Dieses sinnfreie Unlock-Control im iPhone-Stil demonstriert die Verwendung der GetMin() und GetMax() Funktionen.

Sub EvtChangedSliderUnlock
(
  aObj    : handle;  // Slider-Objekt
  aButton : int;     // Verwendete Maustasten
)
local { SliderBar : int; }
{
  SliderBar # aObj->Slider:GetBar();

  if (aObj->Slider:GetPos() = aObj->Slider:GetMax()) {
    SliderBar->wpVisible # False
  } else if (aButton <> _WinMouseLeft and
             aObj->Slider:GetPos() <> aObj->Slider:GetMin()) {
    aObj->Slider:SetPos(aObj->Slider:GetMin());
  }
}

Hier eine Übersicht der bereits vorhandenen Funktionen der Prozedur Slider:

Create()
Anlegen und Initialisieren des Objektes

Destroy()
Freigeben des Objektes im Speicher

SetEvtChanged()
EvtChanged-Prozedur nachträglich setzen

SetMin()/GetMin()
Minimal-Wert setzen / lesen

SetMax()/GetMax()
Maximal-Wert setzen / lesen

SetPos()/GetPos()
Aktuelle Position setzen / lesen

SetVisible()/GetVisible()
Sichtbarkeit setzen / lesen

SetDisabled()/GetDisabled()
Disabled setzen / lesen

GetBar()
Deskriptor des Hintergrund-Pictures

GetArrow()
Deskriptor des Schieber-Pictures

Ein Beispiel für die Anwendung in unserer Applikation ist ein einfacher Bild-Bearbeiten-Dialog:

Anwendungsfall für Slider

Wir möchten das Control gerne der CONZEPT 16-Gemeinde zur Verfügung stellen. Am Ende des Artikels kann eine Datenbank mit den benötigten Ressourcen heruntergeladen werden. Enthalten sind die Prozeduren Slider und Hdl, sowie die Grafiken des Test-Dialogs (beginnen alle mit Slider_) und der Test-Dialog selbst. Außerdem liegt die Test-Prozedur als Quelltext vor.

Wer gerne den Quelltext der Slider-Bibliothek hätte, der schreibe hier auch einen Blog-Eintrag, oder kontaktiere mich persönlich (). Wenn Interesse besteht das Control zu erweitern (z.B. vertikale Slider), sind wir gerne bereit den Quelltext zur Verfügung zu stellen.

Viel Spaß beim Spielen mit dem Testdialog!