Fertige Layouts?

[UliNobbe]

Okay… nicht einfach.
Einschränkungen:

• Im Browser kann man die Textfarbe aktuell (noch?) nicht ändern. Da wird das mit dem leicht dunklen Grauton grenzwertig.

• Gleiches gilt für die Toolbar.

• Beim Encoder-Status und der PlaylistToolbar wird es etwas komplexer, weil die Buttons sich hovern lassen (verändertes Verhalten, wenn die Maus drüber ist). Außerdem kannst du dich noch entscheiden, wie die Buttons aussehen sollen wenn sie aktiv bzw. inaktiv sind.

• Die Anzeige der Event-Zeit lässt sich nicht schalten (kein Button), aber grundlegend anpassen (so lassen, auch weiße Schrift oder ganz anders?).

• Die LED-Uhr im Browser kann man farbtechnisch nicht konfigurieren, da ist der Hintergrund unveränderlich schwarz.
  Es gibt die LED-Uhr jedoch als eigenes Bildschirmobjekt, die sich farblich gestalten lässt.
  Nachteil: Frisst wieder Platz auf dem Bildschirm.

• Das sind erstmal die Grundlagen.
  Glaube mir, du wirst noch sehr viele Sonderwünsche entwickeln.

Ein Wort noch zum Encoder-Status: MIC und LINE-Button zugleich braucht man üblicherweise nicht; in den meisten Fällen ist einer von beiden überflüssig. Mit geschickter Konfiguration auch beide. Hängt vom persönlichen workflow ab.
Welche Hardware ist denn am Start? Mischpult? USB-Mikrofon bzw. Miniklinke oder auch Headset direkt am PC? Alternativ auch ein Audio-Interface?

Da ist noch Verbesserungspotential drin, bevor es an den Skin geht.

[UliNobbe]

So kann ein grau / weißes Standard-Layout aussehen:

Wie du erkennst, gibt es da an den Buttons noch richtig viel zu tun.
Aber das wäre so (ganz grob) ein erster Ansatz.

Und jetzt du!

[DerLeeoon]

Jo ungefähr so hatte ich mir das vorgestellt, das mit denn Buttons find ich jetzt nicht schlimm oder das etwas Weiß durchschimmert.

Sieht so schon ganz gut aus.

Was und Wie muss ich denn dann anpassen?

[UliNobbe]

@DerLeeoon

Was und Wie muss ich denn dann anpassen?

Um es vorsichtig auszudrücken: 'ne ganze Menge (was aber daran liegt, dass in einigen Bereichen der skin.ini leider noch der Wurm drin ist und wir momentan keine Zeit für eine Wurmkur haben).

Nun denn: Zur Bearbeitung empfehle ich dir einen Text-Editor (also für plain text). Der aus Windows geht; besser wäre natürlich Notepad++.
Damit öffnest du die skin.ini (wo du sie findest, weißt du?).

Ich kann dir hier eine Vorlage einstellen, aber danach arbeitest du selber weiter (mit unserer Hilfe, klar).
Du solltest dir im übrigen Gedanken über die von dir gewünschten Farben machen und die Hex-Codes dazu.

[DerLeeoon]

Oh ha okey.

Leider weiß ich noch nicht wo ich die skin.ini finde!

Als Editor werde ich Visual Studio Code Nutzen, die Vorlage würde ich dankend an nehmen

Die Hex-Codes werde ich mir raus suchen.

[Peter_Schmidt]

@DerLeeoon

Die Hex-Codes werde ich mir raus suchen.

Nur als Tip:
Tante Google ist diesbezüglich dein Freund. Gibt zig Seiten mit den Hex-Codes.

[UliNobbe]

Es gibt auch Tools, mit denen man eine Farbe vom Bildschirm quasi per Pipette aufnehmen kann und bekommt die Ergebnisse angezeigt.

Achte darauf, dass du neben dem Hex-Code auch die RGB-Werte bekommst. Du kannst sie in der Farbgestaltung der GUI-Elemente gut einsetzen.

[UliNobbe]

@DerLeeoon

Leider weiß ich noch nicht wo ich die skin.ini finde!

Sie liegt im Config-Ordner der aktuellen mAirList-Version, die du im ProgramData-Verzeichnis (in aller Regel versteckt) findest.

Es geht aber auch einfacher:

(geht auch über die mAirList-Systemsteuerung)

Welchen Weg auch immer du wählst, das Ergebnis ist gleich:

Ach ja, wie war das jetzt eigetlich mit der Frage hier:

@UliNobbe

Ein Wort noch zum Encoder-Status: MIC und LINE-Button zugleich braucht man üblicherweise nicht; in den meisten Fällen ist einer von beiden überflüssig.
(…)
Welche Hardware ist denn am Start? Mischpult? USB-Mikrofon bzw. Miniklinke oder auch Headset direkt am PC? Alternativ auch ein Audio-Interface?

Das wäre durchaus hilfreich zu wissen, dann könnten wir den Encoder Status ggf. verschlanken.

[DerLeeoon]

Moin,

Also bezüglich der MIC / Line frage ich nutze nur denn Line Button!

Zudem nutze ich das D&R Webstation Pult.

Lg

Leon

[UliNobbe]

In dem Fall brauchst du keinen der Buttons und liest dir bitte noch diesen Tipp durch:

Hilfreiche Tipps und Tricks rund um mAirList

Line-Eingang automatisch "scharf schalten" Beim Start von mAirList ist zunächst einmal kein Eingangskanal aktiv geschaltet. Hierzu müsste man jetzt das Bildschirmobjekt “Encoder-Status” nutzen und dort den Button “Line” anzeigen sowie aktivieren: [2%20Encoder%20Mic%20Line] Wer aber auf diese Buttons im Encoder-Status verzichten möchte oder sich den Encoder erst gar nicht anzeigen lassen möchte, kann den Line-Eingang unmittelbar nach dem Programmstart aktivieren. Konfiguration > Aktionen > N…

[DerLeeoon]

Ahh okey das hab ich verstanden.

Wie machen wir das dann mit der Skin.ini ?
Lg Leon

[UliNobbe]

Ich muss noch was rundfeilen. Mir ist eine Unstimmigkeit aufgefallen, aber da brauche ich etwas Zeit mit Torben dafür, um das zu klären. Ist mir in meinem persönlichen Skin noch nie aufgefallen, weil ich eine spezielle Funktion nicht gebraucht habe. Bitte ein wenig Geduld.

[DerLeeoon]

Ja alles gut hat keine große Eile

Lg Leon

[UliNobbe]

[Moderator]
Ich habe zwei themenfremde Beiträge aus diesem Thread verschoben und möchte dich bitten, selber darauf zu achten, etwas Struktur im Forum beizubehalten. Du profitierst schließlich selber davon.
Außerdem soll das hier kein “Leon braucht Hilfe bei allem”-Thread werden, sondern einen Mehrwert für alle darstellen. Vielen Dank.
[/Moderator]

[DerLeeoon]

Okey, wollte dafür nicht unbedingt unnötig was neues erstellen. Wenn du weißt was ich mein

[DerLeeoon]

Moin schon denn Fehler gefunden?

Lg

Leon

[UliNobbe]

Dazu brauche ich Torben, der in den Code von mAirList schauen muss. ich kann den Widerspruch (noch) nicht auflösen. Übers Wochenende ging gar nichts und heute war leider keine Zeit.

[UliNobbe]

Grummel… es lag doch nicht am Code, sondern an mir. Die Fehlersuche war trotzdem nicht ganz einfach.

So könnte ein dunkelgraues Design in etwa aussehen (mit Mic-Button):

Das hier ist die zugehörige skin.ini:

; Color definitions

; Color "storm" (from Windows header) RGB 76 74 72 = #4C4A48
; Color "green" from mAirList ASSIST RGB 45 205 110 = #2DCD6E
; Color "red" from mAirList AUTO RGB 231 76 60 = #E74C3C
; Color "yellow" from mAirList Event RGB 241 196 43 = #F1C42B (also used for cartwall PFL)
; Color "grey" (50%) RGB 127 127 127 = #7F7F7F
; FontColor totally white #FFFFFF
; FontColor full black #000000
; Error Font Color RED ALERT #FF0000

; see skin.ini documentation in mAirList Wiki: https://wiki.mairlist.com/reference:skin.ini_reference

[MainWindow]
Color=#4C4A48

[Toolbar]
BackgroundColor=#4C4A48

[Playlist]
BackgroundColor=#4C4A48
BorderColor=#4C4A48
DefaultRowColor=#4C4A48
FontColor=#FFFFFF
ErrorFontColor=#FF0000
; Red font color for elements marked as "error".

[PlaylistToolbar]
BackgroundColor=#4C4A48
ButtonColor=#4C4A48
ButtonBorderColor=#4C4A48

; Individual Button colors

AssistButtonInActiveFontColor=#2DCD6E
AssistButtonActiveColor=#2DCD6E
AssistButtonInActiveHoverBorderColor=#2DCD6E
AssistButtonInActiveHoverFontColor=#2DCD6E
; green

AutoButtonInActiveFontColor=#E74C3C
AutoButtonActiveColor=#E74C3C
AutoButtonInActiveHoverBorderColor=#E74C3C
AutoButtonInActiveHoverFontColor=#E74C3C
; red

EventButtonFontColor=#F1C42B
; yellow

EndTimeButtonFontColor=#FFFFFF

[Player]
; It is recommended to set the player background color in mAirList player configuration ("custom").

; Player ccolor for each player state :(

EmptyColor=#4C4A48
LoadingColor=#4C4A48
LoadedColor=#4C4A48
NextColor=#4C4A48
PlayingColor=#4C4A48
FadingColor=#4C4A48
EOFColor=#4C4A48
ErrorColor=#FF0000
PausedColor=#4C4A48
StoppedColor=#4C4A48
PFLColor=#4C4A48
FlashEOFColor=#E74C3C
; Red from mAirList AUTO ;)

; Font color for each single text in the player AND per player state :((

EmptyNameFontColor=#FFFFFF

LoadingNameFontColor=#FFFFFF
LoadingTimeFontColor=#FFFFFF
LoadingTitleFontColor=#FFFFFF
LoadingArtistFontColor=#FFFFFF
LoadingStateFontColor=#FFFFFF

LoadedNameFontColor=#FFFFFF
LoadedTimeFontColor=#FFFFFF
LoadedTitleFontColor=#FFFFFF
LoadedArtistFontColor=#FFFFFF
LoadedStateFontColor=#FFFFFF

NextNameFontColor=#FFFFFF
NextTimeFontColor=#FFFFFF
NextTitleFontColor=#FFFFFF
NextArtistFontColor=#FFFFFF
NextStateFontColor=#FFFFFF

PlayingNameFontColor=#FFFFFF
PlayingTimeFontColor=#FFFFFF
PlayingTitleFontColor=#FFFFFF
PlayingArtistFontColor=#FFFFFF
PlayingStateFontColor=#FFFFFF

FadingNameFontColor=#FFFFFF
FadingTimeFontColor=#FFFFFF
FadingTitleFontColor=#FFFFFF
FadingArtistFontColor=#FFFFFF
FadingStateFontColor=#FFFFFF

EOFNameFontColor=#FFFFFF
EOFTimeFontColor=#FFFFFF
EOFTitleFontColor=#FFFFFF
EOFArtistFontColor=#FFFFFF
EOFStateFontColor=#FFFFFF

ErrorNameFontColor=#FFFFFF
ErrorTimeFontColor=#FFFFFF
ErrorTitleFontColor=#FFFFFF
ErrorArtistFontColor=#FFFFFF
ErrorStateFontColor=#FFFFFF

PausedNameFontColor=#FFFFFF
PausedTimeFontColor=#FFFFFF
PausedTitleFontColor=#FFFFFF
PausedArtistFontColor=#FFFFFF
PausedStateFontColor=#FFFFFF

StoppedNameFontColor=#FFFFFF
StoppedTimeFontColor=#FFFFFF
StoppedTitleFontColor=#FFFFFF
StoppedArtistFontColor=#FFFFFF
StoppedStateFontColor=#FFFFFF

PFLNameFontColor=#FFFFFF
PFLTimeFontColor=#FFFFFF
PFLTitleFontColor=#FFFFFF
PFLArtistFontColor=#FFFFFF
PFLStateFontColor=#FFFFFF

FlashEOFNameFontColor=#FFFFFF
FlashEOFTimeFontColor=#FFFFFF
FlashEOFTitleFontColor=#FFFFFF
FlashEOFArtistFontColor=#FFFFFF
FlashEOFStateFontColor=#FFFFFF

[Cartwall]
WindowBackgroundColor=#4C4A48
BackgroundColor=#4C4A48
PlayerColor=#4C4A48
PlayerDarkFontColor=#FFFFFF
PlayerInverseFontColor=#FFFFFF

InactiveBrightness=0.5

; Tabs

TabColorBackground=#4C4A48

TabColorTabActive=#4C4A48
TabColorTxtActive=#FFFFFF

TabColorTabInActive=#4C4A48
TabColorTxtInActive=#000000

[CartwallToolbar]
BackgroundColor=#4C4A48
ButtonColor=#4C4A48
ButtonBorderColor=#4C4A48
; Background color for cartwall toolbar buttons.

; Cartwall button colors depending on their state

OnAirButtonActiveColor=#E74C3C
; Red from mAirList AUTO
OnAirButtonActiveFontColor=#FFFFFF
OnAirButtonInactiveColor=#4C4A48
OnAirButtonInactiveFontColor=#E74C3C

PFLButtonActiveColor=#F1C42B 
; Yellow from mAirList event
PFLButtonActiveFontColor=#000000
PFLButtonInactiveColor=#4C4A48
PFLButtonInactiveFontColor=#F1C42B

[Browser]
WindowBackgroundColor=#4C4A48
BackgroundColor=#4C4A48

[EncoderStatus]
BackgroundColor=#4C4A48

MicButtonInactiveColor=#4C4A48
MicButtonInactiveFontColor=#FFFFFF
MicButtonInactiveBorderColor=#E74C3C
MicButtonInactiveHoverColor=#4C4A48
MicButtonInactiveHoverFontColor=#E74C3C
MicButtonInactiveHoverBorderColor=#FFFFFF

MicButtonActiveColor=#E74C3C
MicButtonActiveFontColor=#FFFFFF
MicButtonActiveFontStyle=1
MicButtonActiveBorderColor=#FFFFFF
MicButtonActiveHoverColor=#E74C3C
MicButtonActiveHoverBorderColor=#E74C3C

Jetzt kannst du, in Abgleich mit dem Wiki, lernen, welche Zeile was bewirkt und wie sie sich zusammensetzt.
Das hilft dir, dich weiter in dein persönliches Design einzuarbeiten und zu vertiefen.

Ab hier darfst du selber schwimmen lernen und dann, in schwierigen Einzelfragen, auf uns zurückkommen.
Okay?

[DerLeeoon]

Okey, ich schau mal ich meld mich dann bei fragen und ob ich alles so hin bekomme😊

Vielen Dank schon mal

Lg
Leon