Workshop - CVS-Skin erstellen "Step by Step" für Dummys

EgLe · 6. Januar 2011

Der Screen  erscheint bei folgender Bedienung:

Menü - Einstellungen - Softwareverwaltung - Erweiterte Optionen - "Paketverwaltung"

Code

<!-- PacketManager -->
	<screen name="PacketManager" position="center,center" size="620,420" title="Packet manager" >
		<ePixmap pixmap="skin_default/buttons/red.png" position="0,0" size="140,40" alphatest="on" />
		<ePixmap pixmap="skin_default/buttons/green.png" position="140,0" size="140,40" alphatest="on" />
		<widget source="key_red" render="Label" position="0,0" zPosition="1" size="140,40" font="Regular;20" halign="center" valign="center" backgroundColor="#9f1313" transparent="1" />
		<widget source="key_green" render="Label" position="140,0" zPosition="1" size="140,40" font="Regular;20" halign="center" valign="center" backgroundColor="#1f771f" transparent="1" />
		<widget source="list" render="Listbox" position="5,50" size="600,365" scrollbarMode="showOnDemand" selectionPixmap="Modern_Stone2_XD/menu/listselection600x50.png" transparent="1" >
			<convert type="TemplatedMultiContent">
				{"template": [
				MultiContentEntryText(pos = (5, 1), size = (440, 28), font=0, flags = RT_HALIGN_LEFT, text = 0), # index 0 is the name
				MultiContentEntryText(pos = (5, 26), size = (440, 20), font=1, flags = RT_HALIGN_LEFT, text = 2), # index 2 is the description
				MultiContentEntryPixmapAlphaTest(pos = (445, 2), size = (48, 48), png = 4), # index 4 is the status pixmap
				MultiContentEntryPixmapAlphaTest(pos = (5, 50), size = (510, 2), png = 5), # index 4 is the div pixmap
				],
				"fonts": [gFont("Regular", 22),gFont("Regular", 14)],
				"itemHeight": 52
				}
			</convert>
		</widget>
	</screen>

Alles anzeigen

EgLe · 6. Januar 2011

Dieser Screen muss bei diesem Skin nicht editiert werden,
wird aber der Vollständigkeit wegen hier auch aufgeführt.

Menü - Standby / Neustart - "Ausschalt-Timer"

Code

<!-- Sleeptimer edit -->
	<screen name="SleepTimerEdit" position="center,center" size="500,240" title="Sleep Timer">
		<widget name="current_status" position="40,40" size="400,30" valign="center" font="Regular;20" />
		<widget name="red" pixmap="skin_default/buttons/button_red.png" position="10,88" size="12,12" alphatest="on" />
		<widget name="green" pixmap="skin_default/buttons/button_green.png" position="10,128" size="12,12" alphatest="on" />
		<widget name="yellow" pixmap="skin_default/buttons/button_yellow.png" position="10,168" size="12,12" alphatest="on" />
		<widget name="blue" pixmap="skin_default/buttons/button_blue.png" position="10,208" size="12,12" alphatest="on" />
		<widget name="red_text" position="40,80" size="400,30" valign="center" font="Regular;20" />
		<widget name="green_text" position="40,120" size="400,30" valign="center" font="Regular;20" />
		<widget name="yellow_text" position="40,160" size="400,30" valign="center" font="Regular;20" />
		<widget name="blue_text" position="40,200" size="450,30" valign="center" font="Regular;20" />
		<widget name="pretext" position="15,10" size="235,25" font="Regular;19" />
		<widget name="input" position="260,10" size="40,25" font="Regular;19" />
		<widget name="aftertext" position="305,10" size="100,25" font="Regular;19" />
		<ePixmap pixmap="skin_default/sleeptimer.png" position="390,17" size="90,125" alphatest="on" />
	</screen>

Alles anzeigen

EgLe · 6. Januar 2011

Der Screen  ist wie folgt zu finden:

Menü - Einstellungen - Softwareverwaltung - Erweiterte Optionen - "Wählen Sie eine Upgrade-Quelle"

Code

<!-- IPKGMenu -->
	<screen name="IPKGMenu" position="center,center" size="560,400" title="Select upgrade source to edit." >
		<ePixmap pixmap="skin_default/buttons/red.png" position="0,0" size="140,40" alphatest="on" />
		<ePixmap pixmap="skin_default/buttons/green.png" position="140,0" size="140,40" alphatest="on" />
		<widget source="key_red" render="Label" position="0,0" zPosition="1" size="140,40" font="Regular;20" halign="center" valign="center" backgroundColor="#9f1313" transparent="1" />
		<widget source="key_green" render="Label" position="140,0" zPosition="1" size="140,40" font="Regular;20" halign="center" valign="center" backgroundColor="#1f771f" transparent="1" />
		<widget name="filelist" position="5,50" size="550,340" scrollbarMode="showOnDemand" selectionPixmap="Modern_Stone2_XD/menu/listselection560x25.png" transparent="1" />
	</screen>

EgLe · 6. Januar 2011

So den Screen  erreicht man z.B. mit einem Langem Druck auf die
Info-Taste und dann eben im nächsten Fenster den ersten Punkt "Grafischer Multi-EPG" auswählen.

Code

<!-- Graphical Multi EPG -->
	<screen name="GraphMultiEPG" position="center,center" size="800,435" title="Electronic Program Guide">
		<ePixmap pixmap="skin_default/buttons/red.png" position="90,0" size="140,40" alphatest="on" />
		<ePixmap pixmap="skin_default/buttons/green.png" position="260,0" size="140,40" alphatest="on" />
		<ePixmap pixmap="skin_default/buttons/yellow.png" position="420,0" size="140,40" alphatest="on" />
		<ePixmap pixmap="skin_default/buttons/blue.png" position="580,0" size="140,40" alphatest="on" />
		<widget name="key_red" position="90,0" zPosition="1" size="140,40" font="Regular;18" halign="center" valign="center" backgroundColor="#9f1313" transparent="1" />
		<widget name="key_green" position="260,0" zPosition="1" size="140,40" font="Regular;18" halign="center" valign="center" backgroundColor="#1f771f" transparent="1" />
		<widget name="timeline_text" position="0,41" size="800,20" />
		<widget name="list" position="0,65" size="800,270" EntryBorderColor="#071930" EntryBackgroundColor="#2f4964" EntryBackgroundColorSelected="#25688caf" scrollbarMode="showOnDemand" />
		<widget name="timeline0" position="0,65" zPosition="1" size="1,270" pixmap="skin_default/timeline.png" />
		<widget name="timeline1" position="0,65" zPosition="1" size="1,270" pixmap="skin_default/timeline.png" />
		<widget name="timeline2" position="0,65" zPosition="1" size="1,270" pixmap="skin_default/timeline.png" />
		<widget name="timeline3" position="0,65" zPosition="1" size="1,270" pixmap="skin_default/timeline.png" />
		<widget name="timeline4" position="0,65" zPosition="1" size="1,270" pixmap="skin_default/timeline.png" />
		<widget name="timeline5" position="0,65" zPosition="1" size="1,270" pixmap="skin_default/timeline.png" />
		<widget name="timeline_now" position="0,64" zPosition="2" size="19,273" pixmap="skin_default/timeline-now.png" alphatest="on" />
		<ePixmap pixmap="Modern_Stone2_XD/menu/border_multiepg.png" position="0,42" zPosition="1" size="800,393" transparent="1" alphatest="on" />
		<widget source="Event" render="Label" position="10,337" zPosition="1" size="460,20" font="Regular;19" noWrap="1">
			<convert type="EventName">Name</convert>
		</widget>
		<ePixmap pixmap="skin_default/icons/clock.png" position="483,339" zPosition="1" size="14,14" alphatest="on" />
		<widget source="global.CurrentTime" render="Label" position="500,337" zPosition="1" size="50,20" font="Regular;19" halign="right">
			<convert type="ClockToText"></convert>
		</widget>
		<widget source="Event" render="Label" position="10,357" zPosition="1" size="50,22" font="Regular;18">
			<convert type="EventTime">StartTime</convert>
			<convert type="ClockToText"></convert>
		</widget>
		<widget source="Event" render="Label" position="60,357" zPosition="1" size="70,22" font="Regular;18">
			<convert type="EventTime">EndTime</convert>
			<convert type="ClockToText">Format:- %H:%M</convert>
		</widget>
		<widget source="Event" render="Progress" position="120,360" zPosition="1" pixmap="skin_default/progress_medium.png" size="65,11" borderWidth="2" borderColor="#cccccc">
			<convert type="EventTime">Progress</convert>
		</widget>
		<widget source="Event" render="Label" position="200,357" zPosition="1" size="350,20" font="Regular;18" noWrap="1">
			<convert type="EventTime">StartTime</convert>
			<convert type="ClockToText">Format:(%A)</convert>
		</widget>
		<widget source="Event" render="Label" position="10,377" zPosition="1" size="540,53" font="Regular;18" foregroundColor="#cccccc">
			<convert type="EventName">ExtendedDescription</convert>
		</widget>
	</screen>

Alles anzeigen

EgLe · 6. Januar 2011

Der Screen  kann erreicht werden indem man im Grafischen Multi EPG
einfach die Menü-Taste drückt.

Bei diesem Screen habe ich mal noch das DMM-Logo eingesetzt

Code

<!-- Time & date input -->
	<screen name="TimeDateInput" position="center,center" size="400,200" title="Time/Date Input">
		<widget name="cancel" pixmap="skin_default/buttons/red.png" position="10,0" size="140,40" alphatest="on" />
		<widget name="ok" pixmap="skin_default/buttons/green.png" position="250,0" size="140,40" alphatest="on" />
		<widget name="canceltext" position="10,0" zPosition="1" size="140,40" font="Regular;19" halign="center" valign="center" transparent="1" />
		<widget name="oktext" position="250,0" zPosition="1" size="140,40" font="Regular;19" halign="center" valign="center" transparent="1" />
		<widget name="config" position="10,40" size="380,150" />
		<ePixmap pixmap="skin_default/icons/dmm_logo.png" position="100,170" size="200,10" alphatest="on" />
	</screen>

EgLe · 6. Januar 2011

Der Screen  wird durch die skin_default.xml im oberen Linken Bereich des TV-Bild
angezeigt, wenn man eben das Timeshift benutzt.

Da ich dies nicht verändern möchte brauche ich diesen Screen hier im SKin nicht extra zu definieren.
Ich Liste dies hier nur der Vollständigkeit wegen auf, für evtl. Zukünftige Skinner

Code

<!-- Timeshift state -->
	<screen name="TimeshiftState" position="70,70" zPosition="2" size="150,60" backgroundColor="transpBlack" flags="wfNoBorder">
		<widget name="state" position="0,0" size="150,30" font="Regular;25" halign="center" backgroundColor="transpBlack" />
		<widget source="session.CurrentService" render="Label" position="0,30" size="150,30" font="Regular;25" halign="center" foregroundColor="white" backgroundColor="transpBlack">
			<convert type="ServicePosition">Remaining</convert>
		</widget>
	</screen>

EgLe · 6. Januar 2011

Diese Screen sind für den Untertitel zuständig.
Falls ein Sender dies ausstrahlt sind die Untertitel über die Audiotaste dann Gelb für die Tonspuren
und dann die entsprechende TTX auswählen.

Benötigt wird eigentlich nur dies:

Code

<!-- Subtitle effects -->
	<subtitles>
		<sub name="Subtitle_TTX" font="Regular;35" foregroundColor="#ffffff" shadowColor="#40101010" shadowOffset="3,3" />
		<sub name="Subtitle_Regular" font="Regular;35" foregroundColor="#ffffff" shadowColor="#40101010" shadowOffset="3,3" />
		<sub name="Subtitle_Bold" font="Replacement;35" foregroundColor="#ffffff" shadowColor="#40101010" shadowOffset="3,3" />
		<sub name="Subtitle_Italic" font="Regular;35" foregroundColor="#ffffff" shadowColor="#40101010" shadowOffset="3,3" />
		<!-- omitting foregroundColor attribute will enable auto-assignment of color -->
	</subtitles>

Hier habe ich die Schrift nun etwas größer gestaltet font="Regular;35" und die ganzen
Texte auf Weiß gesetzt (sieht meiner Meinung nach besser aus)

Wichtig: die verwendeten Schriften müssen innerhalb von den  definiert sein!
Dies wäre also in diesem Beispiel die Schrift "Regular" und "Replacement"....

Code

<!-- Fonts -->
	<fonts>
		<font filename="nmsbd.ttf" name="Regular" scale="90" />
		<font filename="lcd.ttf" name="LCD" scale="100" />
		<font filename="ae_AlMateen.ttf" name="Replacement" scale="90" replacement="1" />
		<font filename="tuxtxt.ttf" name="Console" scale="100" />
	</fonts>

So damit nun auch der Text sauber mittig und über den ganzen Bildschirm ausgestrahlt wird
sollte man noch die hinzufügen:

Code

<!-- Subtitle area -->
	<screen name="SubtitleDisplay" position="0,0" size="1024,576" zPosition="-1" flags="wfNoBorder" backgroundColor="transparent" />

Hier definieren wir den Bildschirmbereich (XD-Auflösung size="1024,576") damit der gesamte Bildschirm genutzt werden kann.

EgLe · 7. Januar 2011

Hallo,

da mein Frauchen nun im Bett ist und keine Timeraufnahmen auf meiner DM8000 laufen,
kann ich mal die Screens für das "Common Interface" auf der DM8000 erstellen

Benutzen Wir eine Box mit der Möglichkeit CI-Module zu verwenden sollten diese Screens
zumindest berücksichtigt werden.

Der erste Screen erreichen wir über:

Menü - Einstellungen - "Common Interface"

Code

<!-- Common interface - selection -->
	<screen name="CiSelection" position="center,center" size="440,185" title="Common Interface">
		<widget name="text" position="10,10" size="430,25" font="Regular;23" />
		<widget name="entries" position="10,55" size="420,100" scrollbarMode="showOnDemand" selectionPixmap="Modern_Stone2_XD/menu/listselection560x25.png" transparent="1" />
	</screen>

EgLe · 7. Januar 2011

Der zweite Screen  erreicht man über:

Menü - Einstellungen - "Common Interface Zuweisung"

Code

<!-- CIselectMainMenu -->
	<screen name="CIselectMainMenu" position="center,center" size="350,270"  title="CI assignment" >
		<widget name="CiList" position="10,10" size="330,200" scrollbarMode="showOnDemand" selectionPixmap="Modern_Stone2_XD/menu/listselection560x25.png" transparent="1" />
		<ePixmap position="10,210" size="290,2" pixmap="skin_default/div-h.png" transparent="1" alphatest="on" />
		<ePixmap pixmap="skin_default/buttons/red.png" position="10,220" size="140,40" alphatest="on" />
		<ePixmap pixmap="skin_default/buttons/green.png" position="160,220" size="140,40" alphatest="on" />
		<widget source="key_red" render="Label" position="10,220" zPosition="1" size="140,40" font="Regular;19" halign="center" valign="center" backgroundColor="#9f1313" transparent="1" />
		<widget source="key_green" render="Label" position="160,220" zPosition="1" size="140,40" font="Regular;19" halign="center" valign="center" backgroundColor="#1f771f" transparent="1" />
	</screen>

EgLe · 7. Januar 2011

Der dritte und Letzte Screen lautet 

Da ich keine Module besitze weiß ich nicht wie der Screen aufgerufen wird und kann
deswegen auch keinen Screenshot liefern...

Der Code dazu lautet:

Code

<!-- Common interface -->
	<screen name="MMIDialog" position="center,center" size="450,270">
		<widget name="title" position="10,10" size="430,25" font="Regular;23" />
		<widget name="subtitle" position="10,35" size="430,25" font="Regular;23" />
		<widget name="entries" position="10,70" size="430,150" scrollbarMode="showOnDemand" selectionPixmap="Modern_Stone2_XD/menu/listselection560x25.png" transparent="1" />
		<widget name="bottom" position="10,230" size="430,25" font="Regular;23" />
	</screen>

EgLe · 7. Januar 2011

Dieser Screen  ist auch als Beispiel aus der skin_default.xml genommen.

Bei einigen Boxen (DM7025 und DM8000) kann man ja im Menü unter:

Menü - "Scart-Videorecorder"

Wohl einen Videorecorder anschließeb, habe aber dies nie gemacht und weiß also nicht wie das
geht, doch ich denke der Screen  ist dafür gedacht....

Dies ist nur Informativ, und den Screen können wir in einem SKin eigentlich weglassen,
da falls er ja mal gebraucht wird er ja ehh aus dem skin_default.xml genommen wird.

Code

<!-- Scart -->
	<screen name="Scart" position="0,0" size="720,576" backgroundColor="transparent" />

Auch das ändern der Auflösung bringt ja nix, über Scart gibt es keine höhere Auflösung

Im Anschluss nur mal das Beispielbild von meiner DM8000 mit der Scart-Anzeige im Menü

EgLe · 7. Januar 2011

Der Screen  ist erreichbar über:

Menü - Einstellungen - Jugendschutz - Kanäle Schützen (ja klicken) - "Bouquetliste bearbeiten"

Code

<!-- Parental control - editor -->
	<screen name="ParentalControlEditor" position="center,center" size="520,370" title="Parental control services Editor">
		<widget name="servicelist" position="10,10" size="500,350" scrollbarMode="showOnDemand" selectionPixmap="Modern_Stone2_XD/menu/listselection560x25.png" transparent="1" />
	</screen>

EgLe · 7. Januar 2011

Der Screen  erscheint wenn wir kanäle oder Favoritten geschützt haben und darauf
zugreifen wollen, es ist die Aufforderung der entsprechende Pin-Nummer.

Dieser Screen muss bei diesem Skin nicht bearbeitet werden
und wird so aus der skin-default.xml dann heraus gelesen...

Code

<!-- Pin input -->
	<screen name="PinInput" position="center,center" size="500,170" title="Pin code needed">
		<widget name="service" position="10,10" size="480,25" font="Regular;20" />
		<widget name="text" position="10,40" size="480,25" font="Regular;20" halign="center" />
		<widget name="tries" position="10,70" size="480,25" font="Regular;20" halign="center" />
		<widget name="input" position="10,110" size="480,40" font="Regular;50" halign="center" />
	</screen>

EgLe · 7. Januar 2011

Der Screen  gehört noch in den Bereich der Kanalsuche.
Hatte ich doch dort glatt übersehen, danke für die Aufklärung wo der zu suchen ist:

Skin screen name="NimSetup" ?

Also erreichbar über:

Menü - Einstellungen - Kanalsuche - Tuner-Konfiguration - "einen Tuner anklicken"

Code

<!-- Nim setup -->
	<screen name="NimSetup" position="center,center" size="560,412" title="Reception Settings">
		<widget name="config" position="10,10" size="540,402" scrollbarMode="showOnDemand" selectionPixmap="Modern_Stone2_XD/menu/listselection560x25.png" transparent="1" />
	</screen>

EgLe · 8. Januar 2011

Der Screen  gehört wie man hier nachlesen kann mit zu der Kanalliste.

Also erreichbar z.B. über:

Mittlere Pfeiltaste nach oben (Kanallliste) - Menü - "Marker Einfügen"

Auch dieser Screen muss in diesem Skin nicht geskinnt werden und wird hier nur der
Vollständigkeit dieses Threads aufgeführt.

Code

<!-- Inputbox -->
	<screen name="InputBox" position="center,center" size="550,90" title="Input">
		<widget name="text" position="10,20" size="550,25" font="Regular;23" />
		<widget name="input" position="10,55" size="550,25" font="Regular;20" />
	</screen>

EgLe · 8. Januar 2011

Der Screen  musste ich wieder an meiner DM8000 testen...

Dieser wird angezeigt wenn man eine Festpatte auswählen muss und ist erreichbar über:

Menü - Einstellungen - System - Festplatte - "Initialisieren und/oder Dateisystemprüfung"

Code

<!-- Harddisk selection -->
	<screen name="HarddiskSelection" position="center,center" size="540,285" title="Select HDD">
		<widget name="hddlist" position="10,10" size="520,275" selectionPixmap="Modern_Stone2_XD/menu/listselection560x25.png" transparent="1" />
	</screen>

EgLe · 8. Januar 2011

So in der Skin_default.xml findet man noch zwei weitere Einträge zu den Festplatten.

Diese werde ich hier mal so einfach posten und da ich für euch bestimmt nicht meine Daten auf den Festplatten riskiere bleiben diese auch ungeprüft und somit unkommentiert und ohne Screenshot

Code

<!-- Harddisk setup -->
	<screen name="HarddiskSetup" position="center,center" size="420,160" title="Harddisk">
		<widget name="model" position="20,10" size="380,25" font="Regular;23" />
		<widget name="capacity" position="20,40" size="380,25" font="Regular;23" />
		<widget name="bus" position="20,70" size="380,25" font="Regular;23" />
		<ePixmap pixmap="skin_default/buttons/button_red.png" position="120,110" zPosition="10" size="15,16" transparent="1" alphatest="on" />
		<widget name="initializetext" position="140,110" size="140,40" zPosition="10" font="Regular;20" transparent="1" />
		<!--widget name="initialize" pixmap="skin_default/buttons/red.png" position="140,110" size="140,40" alphatest="on" />
		<widget name="initializetext" position="140,110" size="140,40" zPosition="1" font="Regular;20" halign="center" valign="center" transparent="1" /-->
	</screen>

Code

<!-- Harddisk wait -->
	<screen name="HarddiskWait" position="center,center" size="540,60">
		<widget name="wait" position="20,10" size="500,25" font="Regular;23" />
	</screen>

Ich denke mal das Diese Screen eben erscheinen wenn wir die Festplatte initialisieren...

EgLe · 8. Januar 2011

So in der skin_default.xml finden wir noch diesen kleinen Screen 

Code

<!-- Dish -->
	<screen name="Dish" flags="wfNoBorder" position="300,100" size="130,160" title="Dish" zPosition="100" backgroundColor="transparent">
		<widget name="Dishpixmap" pixmap="skin_default/icons/dish.png" position="0,0" size="130,160" alphatest="off" />
	</screen>

Da dieser Screen rein nur ein Bild anzeigt, (was ich mir natürlich angesehen habe) gehe ich mal davon aus das dieser Screen wohl eingeblendet wird wenn sich eine Rotorbetriebene Schüssel in Bewegung setzt?

EgLe · 8. Januar 2011

Der Screen  erscheint wenn wir die rote Farbtaste der Fernbedienung drücken und keine Funktion hinterlegt ist.

Z.B. wenn wir das Menü anzeigen lassen "Menü-Taste" und dann die Rote Farbtaste drücken....

Code

<!-- unhandled key pressed -->
	<screen name="UnhandledKey" flags="wfNoBorder" position="80,50" size="66,66" title="UnhandledKey" zPosition="100" backgroundColor="transparent">
		<widget name="UnhandledKeyPixmap" pixmap="Modern_Stone2_XD/unhandled-key.png" position="0,0" size="66,66" alphatest="off" />
	</screen>

Habe das defaultbild vergrößert und eingefärbt in Rot, ist also das Rote durchgestrichene Bild gemeint

PS: weiterhin sieht man nun bei unserem Menü wie es aussieht wenn ein neuer nicht definierter Eintrag dazu gekommen ist (hier im Beispiel mal das BluePanel)....

EgLe · 8. Januar 2011

Dieser Screen  kannte ich auch nicht, hier wurde geholfen.

Also er erscheint wenn wir mittles minuteneingabe in einem Film springen wollen.
Um diesen anzeigen zu lassen, z.B.einfach eine Aufnahme abspielen und da dann lange die
Blaue Taste auf der Fernbedienung gedrückt halten...

Dieser Screen muss in diesem Skin nicht neu definiert werden und wird hier der Vollständigkeit wegen aufgeführt.
Der abgebildetet Code ist in der skin_default.xml zu finden:

Code

<!-- Minute input -->
<screen name="MinuteInput" position="center,center" size="280,60" title="Seek">
<widget name="minutes" position="80,15" size="160,25" halign="right" font="Regular;23" />
</screen>

Workshop - CVS-Skin erstellen "Step by Step" für Dummys

Wer ist / war online ?

Benutzer online 7

Wer war online 23