Vista Style Builder: Allgemein

Aus Deskmodder Wiki
Version vom 31. August 2010, 17:16 Uhr von Moinmoin (Diskussion | Beiträge) (Die Seite wurde neu angelegt: „''' VistaStyleBuilder = WindowsStyleBuilder''' Der VistaStyleBuilder ist zu Anfang sehr schwierig zu bedienen. Man muss sich erst einmal rein arbeiten. Deshalb …“)
(Unterschied) ← Nächstältere Version | Aktuelle Version (Unterschied) | Nächstjüngere Version → (Unterschied)
Wechseln zu: Navigation, Suche

VistaStyleBuilder = WindowsStyleBuilder

Der VistaStyleBuilder ist zu Anfang sehr schwierig zu bedienen.

Man muss sich erst einmal rein arbeiten. Deshalb hier eine kleine Starthilfe.


test
Pfad im VSB (WSB) Bild
text bild


test
Pfad im VSB (WSB) Bild
text bild

Abstände - Margins

Abstände
Pfad im VSB (WSB) Bild
Inhalts-Abstände:

Inhalts-Abstände werden durch die .msstyle angezeigt.

Manche lassen sich ausrichten, manche nicht. bei denen, die sich anpassen lassen, wird die Position der Icons, Buttons und anderer Elemente definiert.

Die Anpassung von Inhalts-Abständen, wie das rechtsbündige Ausrichten von Icons unten in der Taskbar kann erreicht werden, indem man zu folgendem Pfad navigiert:

  • - Taskbar & SystemTray > Taskband > Basic > Taskband > BackGroundBottom > ContentMargins : Margins-

Setze diesen Wert auf 50 und teste die Einstellung. Dies sollte die Icons in der Taskbar um 50px nach rechts bewegen.

(0=alles wird links ausgerichtet).
Dies ist nur eine Einführung.Es werden im Laufe der Zeit stets mehr ermittelt. Die meisten funktionieren erfahrungsgemäß in "StartMenu". Allerdings greift hier das Prinzip von Versuch und Irrtum.

Größen-Skalierung:

7, 7, 7, 7 = Links, Rechts, Oben, Unten

Diese Abstände legen fest, wie Grafiken gestreckt werden. SizingType : Enum - Stretch

Hat man zum Beispiel eine Taskband-Grafik, die 200px lang und 40px hoch ist,

so bedeuten die Abstände oben, dass jeweils die ersten 7px (oben, unten, rechts, links) statisch behandelt werden,

der Rest wird gestreckt.


Im unten verlinkten Bild stellt der rote Bereich einen 5px-Rahmen dar.

Somit sollte " SizingMargins: 7, 7, 7, 7" den roten Bereich in seiner ursprünglichen Form belassen und dieses nicht verzerren, wenn das Bild horizontal oder vertikal gestreckt wurde. Lediglich der blaue Bereich wird gestreckt.

Hierbei gibt es zahlreiche Möglichkeiten, dies auszuprobieren, wenn es darum geht, " SizeMargins" anzuwenden. Dies soll jedoch lediglich eine Einführung sein.

Einige Bereich werden im Vergleich zu anderen unterschiedlich reagieren, wenn "SizeMargin"-Werte definiert werden.

Jedoch müssen diese meist angepasst werden, wenn die originale Theme-Grafik durch eine größere, detailgetreuere Grafik ersetzt werden soll.

Hinweis: Die Größen-Angabe für "SizeMargins" sollte niemals die Dimensionen der Grafik überschreiten. Dies führt in den meisten Fällen dazu, dass die Grafik nicht angezeigt wird.

Klickt man auf " SizingType : Enum - Stretch ", so erscheint ein Drop-Down-Menü mit den Optionen: TrueSize-Stretch oder Tile.

Wählt man " truesize the image" so wird die Grafik nicht verzerrt.

Diese Methode sollte nur verwendet werden, wenn die Grafik auch wirklich nicht gestreckt werden muss, um einen Bereich zu füllen.

Man sollte sich auch vergewissern, dass manche Bilder in bestimmten Bereichen verwendet werden. Manche müssen gestreckt werden, andere bleiben statisch.

Die Option " Kacheln" ("Tile") macht folgendes (wie der Name bereits sagt): Es kachelt einen Bereich mit einer Grafik mit der Originalgröße der Grafik.

Der beste Weg Größen-Skalierungen (Size-Margins) zu verstehen ist, zu schauen, wie diese in dem gewünschten Design angewendet werden.

Hat man ein Design und ein entsprechend bearbeitetes Bild, so kann man dessen Dimensionen vergleichen und die Größe auf das Standard-Aero-Design skalieren.

Margins.jpg

Hinzufügen von Eigenschaften

Hinzufügen von Eigenschaften
Pfad im VSB (WSB) Bild
Beispielsweise, wenn man eine Textfarbe zu den Fenster-Tabs hinzufügen will
  • 1-Navigiere zu: Lists, Menus & Tabs > Tab (Klick "Tab")
  • 2-Wähle den "Add Property"-Button.
  • 3-Vom linken Dropdown-Menü unter "Type" im neuen Eigenschafts-Fensterwählt man "color".
  • 4-Vom rechten Dropdown-Menü unter "Property" im neuen Eigenschafts-Fensterwählt man "TextColor"

Mit "OK" bestätigen. Die neue "Textcolor : Color"Eigenschaft sollte nun im VSB-Eigenschaftsfenster angelegt sein.

  • 5-Klickt man auf die Farbe (Standard ist für gewöhnlich schwarz), erscheint eine Farb-Tabelle. Wähle die Farbe für den Text.

Im Beispiel wurde rot verwendet, da dieser Text auf weißem Hintergrund stehen soll. Bestätige mit "OK".

  • 6-Klicke nun auf "Test" in der VSB-Toolbar, um das Ergebnis nun anzeigen zu lassen.

Hinweis: Werden solche Dinge getestet, so ist immer darauf zu achten, dass eine Farbe gewählt wird, die sich von dem Bereich abhebt, welcher angepasst werden soll. Es bringt nichts, schwarze Schrift auf schwarzen Hintergrund zu setzen, usw.

ES WIRD NICHT GARANTIERT, DASS DAS ERGEBNIS ZWANGSLÄUFIG ZUFRIEDENSTELLEND IST. NICHT JEDE® TEXTFARBE, SCHRIFTART, HINTERGRUND, ETC. KANN DURCH HINZUFÜGEN VON EIGENSCHAFTEN GEÄNDERT WERDEN!

Es gibt kein Tutorial, das klärt, was sich durch Hinzufügen von Eigenschaften verändern lässt.

Hier wurde "Textcolor : Color" verwendet, da dies leicht verständlich und gut erkennbar ist.

Jedoch gibt es noch andere Eigenschaften.

Mit dem Hinzufügen von Eigenschaften haben sich bereits fortgeschrittene Desktop-Designer lange Zeit beschäftigt. Hier kann man nur experimentieren. Manchmal kommt man zu einem Ergebnis, manchmal nicht.

Dies kann sehr zeitaufwändig sein und erfordert viele Tests des eigenen Entwurfs. Es hängt davon ab, wie weit man den Spaß treibt.

Viel Glück damit und lasst es uns wissen, wenn ihr einen "guten Fund" gemacht habt.

Adding20a20property.jpg


test
Pfad im VSB (WSB) Bild
text bild


test
Pfad im VSB (WSB) Bild
text bild


test
Pfad im VSB (WSB) Bild
text bild


test
Pfad im VSB (WSB) Bild
text bild


test
Pfad im VSB (WSB) Bild
text bild
Baustelle von strictly.gif
Diese Seite wird weiter ausgebaut!
Es kann sein, dass einige Informationen noch fehlen!
Hilf mit, wenn du neue Informationen hast und ergänze oder verbessere den Artikel.
Vielen Dank