SUBSIM Radio Room Forums



SUBSIM: The Web's #1 resource for all submarine & naval simulations since 1997

Go Back   SUBSIM Radio Room Forums > Subsim International > SUBSIM Nederlands Forum
Forget password? Reset here

Reply
 
Thread Tools Display Modes
Old 03-22-10, 11:09 AM   #1
java`s revenge
Ace of the Deep
 
Join Date: Jan 2007
Location: at periscope depth
Posts: 1,204
Downloads: 97
Uploads: 0
Default menu editor wordt stapsgewijs vertaald 28/6 laatste edit

De menu editor wil ik vertalen. Aangezien dit een vrij lange text is
zal ik er enige tijd over doen. Het begin is er. Het bericht staat hier
origineel. Van Nederlands naar Engels zou ik wel gemakkelijker vinden.

Ik zie deze editor voor het eerst dus mensen die fouten zien in mijn
tekst schroom je niet .....Ik zal zelf als ik klaar ben nogmaals de tekst doorlezen op
fouten.
En ik leer er zeker wat van !

Hier is de engelse versie,
http://www.subsim.com/radioroom/showthread.php?t=163118

En namens de schrijver karamazovnew


__________________

Last edited by java`s revenge; 05-11-10 at 05:52 AM.
java`s revenge is offline   Reply With Quote
Old 03-22-10, 11:11 AM   #2
java`s revenge
Ace of the Deep
 
Join Date: Jan 2007
Location: at periscope depth
Posts: 1,204
Downloads: 97
Uploads: 0
Default

INTRODUCTIE


Wel, de devs heeft ons een nieuw puppy gegeven. Voor de oude GUI modders zal dit een vreugde zijn om te gebruiken. In één woord de SH3, SH4 en SH5 zijn allen gebaseerd op gelijkwaardige regels. Ik zie geen reden waarom ervaren modders deze tool niet kunnen gebruiken ofzelfs SH3 en SH4 met deze interface te tweaken. Deze tutorial gaat slechts over hoe de 2D graphics te
creëren. Op dit moment weet ik niet hoe je de items naar commands, scripts, of dials kunt linken. Juist omdat een nieuw mooi geanimeerde "KILL THE WHALES" toets button in de editor te creëren, betekend het niet dat het iets doet wanneer je erop klikt. Een aparte thread is er nodig om ieder type item uit te leggen. Mijn doel is slechts om je op weg te helpen met de Menu Editor.

Laten we nu deze tool starten:
Ten eerste ga je naaar de Mijn Documenten SH5 folder (in W7 and Vista is het C:\Users\xxxxx\Documents\SH5\data\cfg en open de main.cfg file.

verwijder de punt komma`s de DEVELOPER regels:

[DEVELOPING]
Modding=Yes
MenuEditor=Yes
DebugScripts=Yes

Start nu het spel en dan zie je een a dialog box:



Wanneer je No selecteerd , zal het spel normaal opstarten. Wanneer je Yes selecteeerd zal de Menu Editor openen.





De Editor is samengesteld uit een Preview Screen en een Control Panel. Boveaan de Control Panel zie je een lijst met alle items in alle schermen van de 2D interface. Ze zijn allemaal verbonden binnen een hiërarchie van ouders en kinderen. In simpele termen, alle items zijn in groepen gezet. Een groep verplaatsen zal alle items die hieronder vallen meeverplaatsen.

Als je met je rechtermuistoets op de menu bar van de Preview Window klikt ben je in staat om één van de andere modding tools te starten. Windows 7 users, zover ik weet is dit de enige weg toegang te krijgen tot deze tools.





Navigatie en selectie:

Je kan elk item in het Preview scherm selecteren en het zal omlijnd zijn dmv een geanimeerde gele grens. Als je met je muis beweegt kan je ook zien in een rode omlijning welk item geselecteerd zal
worden als je klikt.



Sommige Pagina`s bevatten heel wat items (niet zo erg als in SH4). Het zal moeilijk zijn om je te
focussen op één bepaalde groep en het correcte item te selecteren. Zo laten we het Control Panel gaan gebruiken.

Groene items zijn ontzichtbare groepen (of pagina`s). Bij ingebreken blijven kan je alleen oorspronkelijke objecten die hierbij horen selecteren. (zoals in SH3 en SH4). Alle andere items
zijn in zwart zichtbaar met een indicatie van wat het item is (een toets, een beeld, een film enz).
Het geselecteerde item is in het rood aangegeven.



Onderaan kan je checkboxes selecteren:
- B.boxes: zal begrensde ontwerpen tekenen rond alle zichtbare items.
- Rev.sel: zal een geanimeerde gele grens rond een geselecteerd item maken
- Full page: Zal alle item laten in die pagina OF op een bepaalde groep focussen en alle andere
items verstoppen in die pagina. Je moet eerst een groep selecteren en dan de volle pagina optie unchecken.

De achtergrond is een groots kenmerk dat je toestaat de kleur van de preview window in te stellen. Enter de RGB waarde van de kleur dat je wilt, "A" is voor "alpha" echter ik weet niet
wat voor effect dat heeft. De achtergrond kleur heeft geen effect in het spel.

Alle bovengenoemde opties worden niet gesaved als je de menu editor sluit.



ONGEDAAN MAKEN

Voordat veranderingen maken is het belangrijk te weten hoe je ze weer ongedaan kan maken. De Editor zal slechts veranderingen bewaren wanneer je op de SAVE button onderaan de Control Panel klikt. Je kan niet CTRL-Z gebruiken om iets ongedaan te maken, maar je kan de UNDO toets onder de item lijst aanklikken. Je zal blij zijn te weten dat je snelle stappen kan maken naar 20 backward steps.

__________________

Last edited by de vliegende hollander; 03-23-10 at 03:00 AM.
java`s revenge is offline   Reply With Quote
Old 03-22-10, 11:13 AM   #3
java`s revenge
Ace of the Deep
 
Join Date: Jan 2007
Location: at periscope depth
Posts: 1,204
Downloads: 97
Uploads: 0
Default

NIEUWE ITEMS CREËREN

Ik houd ervan om altijd met een blanco pagina te starten (letterlijk) als ik dingen oefen en een nieuwe pagina creëer en we er een zooitje van gaan maken zonder het risico het spel te verpesten.

Dus wat zijn Pages/Groups? Het zijn onzichtbare items die een bepaalde positie,
resolutie schaalverandering en afmetingen hebben. Je kan van alles van binnen plaatsen en als je
ze beweegt, zullen alle items als een groep bewegen (duh).

Ik heb er geen idee van op welke wijze een "page" verschilt van een "group". Ze zijn waarschijnlijk verschillend toegankelijk door de hardcode. In SH4 was het waarschijnlijk dat het mogelijk was de Periscope Interface in 3D te laten zien terwijl je op de brug of bij de Hydrophone Station was.
Dus voor nu zeggen we dat Pages "Screens" zijn: De periscope screen, de map screen enz.

In SH3 en SH4, alle "Pages" zaten in een enorme file, het gevreesde menu_1024_768.ini file. Dingen zijn veranderd "FOR THE BETTER".
We kunnen nu elke "page" in z`n eigen file bewaren. Aldus mods kunnen nu de bepaalde screens
aanpakken, zonder het risico te lopen op een belangrijke incompatibiliteit.
Alle files dat interface opmaakt zit binnen de \data\Menu\Pages folder. Dus maak voor de zekerheid een backup folder voordat je gaat modden, of gebruik het tooltje JSGME.

Kunnen we nieuwe "pages"creëren? Zeker weten!

Slechts right click op de "Root Parent" in de Control Panel lijst...



In de niewe dialog box, slechts een goede naam enteren en, als je wilt, een specifieke ID. Maak je niet druk over bestaande items, de verandering zal niet een kopie creëren:



Bijvoorbeeld, Ik heb net 2 items gecreëerd, een "Page" genaamd Karamazov en een "group" genaamd Karamazovgroup. Nadat ik gesaved heb kijk wat er gebeurd:



De juiste files zijn gecreëerd. Beide nieuwe items zijn toegevoegd naar de menu_1024_768.ini file (welke zich nu gedraagd als een index voor alle "pages"). Je zult nu ook zien dat elke nieuwe "page" automatisch wordt geconfigureerd om het gehele scherm op iedere resolutie te vullen. (meer daarover volgt later). Beide nieuwe items verschijnen net onder de "Root Menu", de eerste in de lijst. Maar je kan ze knippen/plakken naar elke plaats dat je wilt. Dit zal een effect hebben op de volgorde in welke de "pages" op het scherm zullen verschijnen. Meer daarover volgt later, maar onthoudt dat elk item NA elk item verder onder de lijst verschijnt. Anders gezegd, any new item that you've just created inside a group/page will always be behind any other items that were already in that group. Ik kom hierop binnen een seconde terug.

Laten we een nieuw item naar mijn Karamazov "page" toevoegen. Ik right click erop en krijg het
volgende menu:



- Change ID: geeft je toegang om een gangbare ID in te voeren.

- Add Controls group: geeft je toegang om een "group" te creëren.
Je kan zoveel genestelde "groups" creëren zoveel je maar wilt, Zelfs als je de lijst klein wilt
houden voor het gemakkelijk modden.

- Add Control: Creëert een nieuw item binnen een "group". Hier is de Control box die je krijgt
als je erop klikt:



Je kunt nu de type selecteren die je wilt creëren.
Wees voorzichtig omdat dit het enige moment is waar je het kan doen.
Als je je later bedenkt, moet je het deleten en een nieuw item creëren.
Beseft ook dat de ID input box dynamisch is. Wanneer we de "page" creëerden was het alleen
toegestaan de eerste 2 cijfers in de string te veranderen. Het is nu toegestaan de laatste 4 items in de string te veranderen. Dit is om een warboel te voorkomen van de the ID's en ook
om de dingen simpel te lezen zijn voor je:

-Enig "page" of hoofd "group" (die onder de root staan) zal dit patroon hebben:
XX000000. Dus je hebt een maximum van 196 "pages" beschikbaar.
Onthou dat alle hun eigen file hebben/krijgen.

Mijn Karamazovgroup item kreeg ID: 1B000000.
-Elke "group" in een "page" zal de ID van de "parent" erven. Dus iedere "groep" dat ik creëer
binnen mijn "Karamazovgroup" zal er zo uit zien: 1BXX0000. Het maakt niet uit hoe ze zijn samengevoegd (Tenzij je dit in binary code schrijft ). Aldus kan je een totaal van 196 "groups" in iedere "group"creëren.
Bijvoorbeeld, Ik creëer een nieuwe "group" dat de ID: 1B010000 krijgt.
- Ieder item dat binnen deze "group" geplaats is zal dit patroon hebben: 1B01XXXX. In andere woorden ik ben in staat 9999 items in elk van mijn 196 totale mogelijke "groups" te creëren . Dat zijn heel wat mogelijke items

Dus wat voor items kunnen we creëren? Hier is een vlugge lijst:
Static Text, Static BMP, Static BMP Array, Button, Checkbox, Slider, EditBox, Radio button, EditBox, Move, Progress, TabControl, DetectMouse, enz., enz., enz.


items hernoemen

Om een item te hernoemen, Ten eerste selecteer je het in de lijst door te klikken op op de lijst.
Dan,na een halve seconde ofzo, klik het nogmaals. Niet snel dubbelkilkken dat zal niet werken.

items verwijderen

Op het moment onthoud je ervan om originele spel items te verwijderen. Het zal crashes veroorzaken. Als je een item wilt verwijderen van de "screen", verplaats het dan buiten de weergave plaats (Ik zal het in de volgende post uitleggen). Den enige manier om items te
verwijderen is er met een rechtermuis op te klikken en dan verwijderen uit het menu te
selecteren.

Veranderen van de volgorde van de items binnen een "group"

Voor het volgende voorbeeld heb ik de volgende structuur gecreëerd:
1. Ik heb gecreëerd: GROUP 1
2. Ik heb gecreëerd: een vooruitgang binnen GROUP 1
3. Ik heb gecreëerd: een "static" tekst binnen GrOUp 1
4. Ik heb gecreëerd: GROUP 2

Ik heb daarna de items met mijn muis verplaats in de "Preview Screen":



Zoals je kunt zien, het LAATSTE item dat je gecreëerd hebt is boven aan de lijst geplaats
Maar in het spel, het LAATSTE item is altijd achter alle ander objecten in de "group" te vinden.
Merk op dat de tekst ("TO GAME") is achter de "progress bar" plaatje. Bemerk ook dat items
niet verplaats hoeft te worden BINNEN de "bounding box" van een "group". De "The Static Text Object" is compleet buiten GROUP1. Om de "Text appear" van de "Progress Bar Image" naar voren
te halen hoef je het slechts naar BENEDEN te slepen, in the lijst.



Zoals je kunt zien, de tekst verschijnt nu bovenaan het beeld. Dezelfde regel en methode
wordt gebruikt voor de "groups", "parent groups" en "pages". Een item verslepen in de lijst
zal slechts de volgorde in een "group" veranderen.

Je kunt een item niet verplaatsen naar een andere "group".
Je moet echter Copy/Cut/Paste gebruiken.

Om een item eenvoudig te verwijderen, rechtermuisklik op het in de lijst en selecteer delete.
Alsjeblieft merk op dat de editor niet automatisch de items hernummerd.

Bijvoorbeeld:
- mijn "New Progress bar" object heeft een ID van 01010001 (als het de eerste was item Ik creëerde binnen de eerste group binnen de eerste page).
- mijn "New Static text" object heeft een ID van 01010002. Het illustreerd, sinds het was
de tweede object dat ik creëerde.
Als ik nu de "Progress Bar" verwijder, de "static text" zal niet automatisch opnieuw genummerd worden. Echter de het volgende item dat ik binnen de "group" creëer zal automatisch het eerst
beschikbare id (01010001) gegeven worden. De volgorde in welke de objecten verschijnen op het scherm heeft niets te maken met deze ID`s. Het enige dat telt is de orde in de lijst (en aldus,
in dhe .ini file van dat "page"). SH3+SH4 UI modders weten dat al, natuurlijk ..... door het rondbewegen van "objects" in de lijst dmv ze te verslepen zal dus nooit de ID`S veranderen.

Opmerken: Hoe kan je een Id zien? slechts right click de item in de lijst en selecteer "Change ID" of kijk eenvoudigweg een paar lijnen lager:




Cut/Copy/Paste:

Natuurlijk kunnen we GROUP1 achter of boven GROUP2 verslepen. Maar wat als we GROUP1
BINNEN GROUP2 willen verslepen. We kunnen dat niet doen dmv verslepen. Dus we zullen
slechts

1. Right Click op GROUP1 en selecteer CUT
2. Right Click op GROUP2 en selecteer PASTE



GROUP1 en al z`n items zullen verplaatsen naar GROUP2

GROUP1 and all of its items will be moved to GROUP2 (boven aan de lijst, op deze manier).

Als we ipv GROUP1 naar GROUP2 kopieëren, zullen we dit krijgen:



Zoals je kunt zien, hebben ze dezelde namen. Maar hun ID`s zijn verschillend. Kan je raden hoe?

- De nieuwe GROUP1 is nu de derde "group" in mijn "page" dus het zal een ID van: 01030000 hebben.
- De oude "Progress bar" had een id van 01010002, kunt je nu raden welke Id het nu zal hebben?
01030002.
- Op dezelfde wijze, de nieuwe "text object" zal een ID van 01030001 hebben.

Nu omdat de ID`s het formaat hebben van PG.GR.ITEM (page.group.item of xxyyzzzz)
Als je items kopieëert of knipt van de ene "page" naar een ander zullen ze
automatisch de "Page ID" erven van de bestemming EN de eerste vrije beschikbare "group" of item ID toewijzen.

Aldus, je kunt gemakkelijk toetsen, wijzerplaten, zelfs gehele "groups" van de ene "page" naar
een ander, of zelfs binnen dezelfde "page", of zelfs binnen in dezelfde "group" en je hoeft
je geen zorgen te maken over hun orde of ID`s. Als de gelijksoortige namen je ergeren, gewoon
herbenoemen. En ja, je kunt alle items naar "Mini Me" of wat je wilt herbenoemen. Het spel
zal er niet om geven.

Het is niet langer nodig om items in de ini files opnieuw te nummeren., het is allemaal voor je gedaan wanneer je saved.
__________________

Last edited by java`s revenge; 03-24-10 at 09:15 AM.
java`s revenge is offline   Reply With Quote
Old 03-22-10, 11:14 AM   #4
java`s revenge
Ace of the Deep
 
Join Date: Jan 2007
Location: at periscope depth
Posts: 1,204
Downloads: 97
Uploads: 0
Default

Dit is waar het pijn doet. Sorry Nederlanders (grapje tussendoor) maar je moet eerst het volgende lezen. Slechts browse door ze, Ik zal m`n best doen om alles weer uit te leggen.

(picture heavy )

Terug in 2007 toen SH4 uitkwam, Zamboni schreef deze tutorial. Je zult het
niet geloven, maar het werkt nog steeds
http://www.subsim.com/radioroom/showthread.php?t=111832"

Het nam 2 en een half jaar in beslag om iemand (ik!) om uit te vogelen hoe de naar
de resolutie te schalen.:

http://www.subsim.com/radioroom/show...28&postcount=7

Als je één van de oude garde bent is er niets nieuw dat ik je kan vertellen en het zal je slechts
een paar minuten kosten om de interface en de editor uit te vogelen. ( het nam mij 1 minuut
in beslag).

Alles is hetzelfde. En dat is een zeer goede zaak. Je ziet, zelfs honderden items in NOTEPAD
maakte nut in SH. De werkstroom was traag maar als je het begrepen had HOE, het was enkel
een zaak van tijd en geduld.

Introductie

Terug in SH3, we zaten we vast aan de 1024x768 resolutie. Dit maakte het modden nogal gemakkelijk als ieder positie van het item aanwezig was als een verschuiving naar zijn "parent",
in pixels. Maar items precies positioneren en uitlijnen was pijnlijk. Bij voorbeeld:

[G01 I1]
Name=Page shell
Type=1027;Menu page
ItemID=0x1000000
ParentID=0x0
Pos=0,0,0,0

[G01 I3]
Name=SShell
Type=1030;Static bmp
ItemID=0x1000004
ParentID=0x1000000
Pos=146,685,28,33

Het 0x0 item was de "Root". Het hoofd scherm. Het was 1024 pixels breed en 768 pixels hoog
dus het vulde het scherm op. Het kon niet verplaatst worden, het kon niet
toegankelijk zijn. Het "startte" van de linkerboven hoek van het scherm.
Het 0x1000000 item daar is het eerste menu "page". Het is een "child" van het 0x0 item (ParentID=0x0). Het is 0 pixels breed door 0 pixels high(Pos=0,0,0,0).Maar
waar is het geplaatst? Elk item positie is wel degelijk een positie gegeven vanuit zijn LINKERBOVEN
HOEK.

Enig "child" van dat item zal dan verwant naar de item's (de "parent") verplaatsen, door een
verschuiving in pixels. Dit verspreid naar de hierarchy dus heeft in feite nooit de echte positie op het scherm. Je moest stapsgewijs te werk gaan, van "parent" naar "child", met ieder stap
een verschuiving maken, In ons geval, de "Page" heeft een verschuiving van

0 pixels op horizontaal en 0 pixels op verticaal (Pos=0,0,0,0). In ander woorden, Het is precies op 0 0 coordinates (in de linkerboven hoek van het scherm).

De bitmap object object 0x1000004 is een "child" van de "page"(ParentID=0x1000000). Het heeft een breedte van 28, een hoogte van 33 en zijn linkerboven hoek is verschoven naar de "parent`s"
linkerboven hoek door 146 pixels naar rechts en 685 pixels op(Pos=146,685,28,33).

In andere woorden, de Pos lijn is:
Pos=X, Y, WIDTH, LENGTH waar X en Y de eerste verhoudingsgewijs naar de eerste onmiddelijke "parent" is gegeven.

Denk je dat dit ingewikkeld was? Doe een snelle blik op de SH4 positie lijn:

Zone= 545 396 80 24 0 1 0x28190001 1 -0.5 0x28190003 0 0.5 3 0

Maak je niet druk, het zal alles nuttig maken. We zullen zien hoe de Menu Editor echt dit monster
produceert en waarom het belangrijk is om de tijd te nemen en het te begrijpen.

The Menu Editor is een prachtige tool maar je moet eerst veel vooruit denken, en hier is waarom.

Toen SH4 uitkwam, bracht het meerdere resoluties en, natuurlijk, meerdere verhoudings a aspecten (1024x768 en 1600x1200 zijn 4:3 resoluties terwijl 1920x1200 is een 16:10 resolutie,
of zoals het wordt genoemd, breedbeeld).
Dus hoe maakten ze de ze de inferface naar iedere resolutie/aspect om het hele scherm op te vulllen?

Meerdere interfaces voor iedere resolutie? Magie? Geheime tools? De zoon van Einstein? Neee.
Eigenlijk programmeerden ze de gehele interface als een 1024x768 scherm en rekten het
"achter de schermen"!!! En raadt wat......je zult hetzelfde in SH5 nodig hebben
Omdat de Menu Editor je slechts een 1024x768 scherm laat zien. En als je ongeveer de imba
interface creëert voor iedereen afvraagt, je moet begrijpen hoe het "schalen" werkt om vooruit
te plannen.
Anders, je zult niet weten wat je geraakt hebt.

Scherm Resolutie versus Editor resolutie, relatief versus absoluut

Voor al mijn volgende voorbeelden zal ik slechts 2 resoluties als refentie gebruiken:
1024x768 (normaal 4:3 aspect) en 1920x1200 (16:10 aspect).
1024x768 is de meest belangrijke resolutie omdat het de resolutie is in welke je de de priview
van de resultaten zult zien.
Als je interface van het object correct zijn geplaatst en geschaald in de Editor, zullen ze in het
spel ook zo goed eruit zien. Maar op één of andere manier moet je iets doen om het goed te laten
uitzien op alle resoluties en de relatieve positie of instelling van het scherm.

Dus je moet vooruit denken hoe je items op het scherm wilt hebben. Hier is wat je in je
achterhoofd moet houden;

ABSOLUTE SIZE: als je je item altijd X pixels breed en Y pixels hoog wilt hebben, de item zal "krimpen" als je de schermresolutie hoger zet:



ABSOLUTE POSITION: als je je item altijd X pixels links en Y pixels onder van de linkerboven hoek van je scherm wilt hebben , de positie zal veranderen als de resolutie toeneemt.




RELATIEVE MAAT:

Er hebben al heel wat mensen geklaagd over de recognition manual dat het te klein is.
Het is niet zo klein op 1024x768, maar het wordt kleiner en kleiner als de resolutie toeneemt.
Dit heeft betrekking op 90% van de game`s interface. Het is goed voor enige items, maar
slecht voor het meeste. Dat wat we willen is voor een item zijn relatieve maat op het scherm
blijft houden. Als de resolutie verdubbeld, willen we de de maat van het item verdubbeld hebben.
Maar hier is wat er gebeurd als je de aspect ratios schakeld:



Waarom? Omdat wanneer de resolutie van 1024x768 naar 1920x1200 toeneemt, de schembreedte
is toegenomen met een factor van StretchX=1.6 (als in 1920/1024) terwijl de schermhoogte is
toegenomen met een factor van StretchY=1.5625 (als in 1200/768). Dus ons item is toegenomen met de maten 1.6 horizontaal en 1.5625 verticaal. Dit creëert het oprekken. Dus wat als we het niet willen oprekken?

In deze kwestie moet je KIEZEN hoe jouw item moet ingesteld worden.

Het spel biedt veel flexibiliteit hier:

- "none": neemt de maat helemaal niet toe. Het resultaat: de items worden kleiner en kleiner.
- "no constraint": De breedte neemt toe door StretchX en hoogte door StretchY. Resulaat: de items worden groter maar hey wordt gerekt of samengedrukt tot enig non 4:3 aspect ratio.
- "horizontallyOnly": zal slechts de horizontale maat toenemen door StretchY. Resultaat: de items zal ZEERRR breed worden terwijl gelijkertijd kleiner wordt in hoogte. Zeer goed voor zaken als "long bars".
- "verticallyOnly" : Zal slechts de verticale maat toenemen door StretchX. Resultaat: hetzelfde als hiervoor maar dan verticaal.
- "constantAspectRatioHorizontal": Zal beide horizontale en verticale maten toenemen door StretchX. Resultaat: de items worden groter zonder gerekt te worden. Dit is
de beste methode voor achtergronden omdat ze het scherm opvullen. Echter, het zal
hun "top" en "bottom margins" verkorten.
- "constantAspectRatioVertical": Zal beide horizontale en verticale maten toenemen door y StretchY. Resultaat: de items worden groter zonder gerekt te worden. Dit is niet goed voor de achtergronden omdat het lege banden links en rechts zal laten.
- "constantAspectRatioMin" en "constantAspectRatioMax": Dit zal
overtollig klinken, zoals alle monitoren een "Width>Heigth" maar daar zullen mensen zijn die het leuk vinden om hun monitor te draaien. Dit zorgt voor rare resoluties zoals 1200x1600 en 1200x1920.



Met het risico van "slechts teveel zeggen", ik wil erop wijzen omdat 1024*768 is een 4:3 resolutie,
al de "constantAspectRatio resizing" methoden zal hetzelfde verschijnen als je een 4:3 monitor bezit. Als je het doet, en je wilt een interface creëren is het belangrijk dit te onthouden omdat
je voorzichtig moet zijn als je items herschaalt, simpel omdat je niet in staat zult zijn om het
op een wijde resolutie uit te testen. Het zal er goed uitzien voor je, maar een persoon met een
verschillend "aspect ratio" zal fouten zien als je niet voorzichtig bent. Als een vuistregel,
is het slechts op 2 resoluties nodig om je creaties uit te testen: 1024*768, en de maxium breedte
resolutie dat je computer toestaat. Als het op deze er goed uitziet, zal het op ieder monitor er
goed uit zien.


Heeft het slechts op images betrekking? Nee. ik gebruikte alleen het plaatje van de grootste held van alle tijden om te laten zien "stretching" wanneer "resizing".

Het heeft eigenlijk betrekking tot alle items ongeacht of ze images hebben of ontzichtbaar zijn:
menu pages, groups, alles. We rekken geen images, we veranderen (resizing) afmetingen. Bijvoorbeeld, zeg dat je een menu group wilt hebben dat het hele scherm moet opvullen op
elke resolutie. Wat zal je doen?

1. Je "vult op" het scherm tot 1024x768, met de bedoeling dat je een item creëert met de maat 1024x768 en je plaatst het in de linkerbovenhoek op het scherm.
2. je wijst het toe tot "resize method" van "geen beperking". Op deze manier zal het altijd het scherm opvullen.

Waarom wil je onzichtbare objecten "resizen"? Hier volgt waarom:

RELATIEVE POSITIE:

Neem een blik terug naar de image met absolute positie. Je plaats het item in de "dead center" van het scherm en je wilt dat het daar in elke resolutie blijft. Als je zegt "wel, mijn resolutie is
1024x768 dus ik start vanaf de linkerbovenhoek van het scherm en schuift het item juist door 512 pixels en neer door 384" zeker, het zal goed lijken bij 1024*768, MAAR het zal niet langer in
het midden bij 192x1200 staan, omdat het midden bij zo`n scherm is 860 per 600 (als in de image).

Wat je moet doen is zoals dit:

"Ok, Ik heb een "parent" (Het scherm in dit voorbeeld). Het heeft Breedte en Hoogte en ze variëren in resolutie. Dus als ik een nieuw "child item"wil maken dat in het midden van de "parent" scherm blijft, moet ik de positie uitdrukken van de "child" als gerelativeerd tot de
BREEDTE en HOOGTE van de "parent". In andere woorden, om een knop te maken dat is
geplakt aan de rechter zijde van het scherm, begin je van de linker bovenhoek van de "parent", zoals in SH3, en dan de horizontale positie verrekenen door de volle BREEDTE van
de "parent"
. Als je jouw item in het midden van het scherm wilt houden, begin je van de bovenhoek van het scherm en dan verschuif je jouw item rechts door 0.5 * BREEDTE en dan verschuif het naar beneden door 0.5 * HOOGTE.

Relatieve positie werkt zoals dit:
1. Je start van de positie van de "parent"
2. Je verschuift dmv een aantal relatief tot de "parent's" afmetingen.
3. Je verschuift dan een aantal relatief tot de "item's" afmetingen.
4. Je verschuift dan dmv een bepaald nummer van pixels.

Ik zal voorbeelden laten zien waarom iedere stap nuttig is.

Zo, dit is wat het spel doet wanneer je items rekt. Zelfs door je "pages" en "items" kan slechts een maximum maat van 1024*768 in de editor hebben, wanneer je het spel laad, de "engine" zal de breedte en de hoogte van alle items achter de "scene" toenemen. Zoals gezegd te hebben door de "resizing" methode. Dit zal effect hebben op alle posities van de "children".

Ik hoop echt dat het nu zin heeft omdat ik het niet beter uitleggen kan dan dit.


SH4 & SH5 Zone Lijn

Gebaseerd op wat je zover hebt gezien, het is nu tijd de echte variabelen vast te leggen dat
de positie van de TOP LEFT hoek van elk item opmaakt. (niet het midden):



ID - Het ID van de item
AnchorID - de "positioning" parent: Voor relatieve posities kan je elk item in dezelfde groep selecteren (inclusief de "group" op zichzelf, welke de echte "parent" is) of, voor absolute posities, helemaal geen item.

X - Absolute Horizontale positie op het scherm: 0 betekend LINKS scherm rand .. 1024 betekend RECHTS scherm rand.

Y - Absolute verticale positie op het scherm: 0 betekent ONDERSTE schermrand ...768 betekent
BOVENSTE scherm rand.

In relatieve modus, zijn ze beiden automatisch bijgewerkt op basis van de andere waarde.
Ze controleren eigenlijk niet de positie, ze zijn gewoon voor de show.
In Absolute modus

Echter in Absolute Modus, controleren ze de positie.

Resize - de grootte van de methode voor het item.
DX - Breedte van het item in pixels
DY - Hoogte van het item in pixels

1. We gaan uit van het anker de linkerbovenhoek en verschuiven op basis van de afmetingen van het anker.

ARX - Achor Ratio X: ARX * (Achor's width) = het aantal pixels waarmee het item wordt verplaatst naar links of rechts van het anker X.

ARY - Achor Ratio Y: ARY* (Achor's height) = het aantal pixels waarmee het item omhoog of omlaag verplaatst van het anker van Y.

2.
Dan verschuiven we weer, maar deze keer gebaseerd op de afmetingen van het object.

DRX - Post Ratio X: DRX * DX = het aantal pixels waarmee het item wordt verplaatst naar links of rechts uit de vorige stap.
DRY - Post Ratio Y: DROOG * DY = het aantal pixels waarmee het item wordt verplaatst naar boven of beneden van de vorige stap.

3. Dan, als het nodig is verschuiven we dan door een specifieke offset (meestal het beste alleen al vanwege schalingsproblemen links)

Uit x - Offset X: horizontale afstand in pixels
Uit Y - Offset Y: horizontale afstand in pixels

Geen idee of deze ook worden aangetast door de grootte en de resolutie scaling of eenvoudigweg toegevoegd / substracted als ze zijn opgenomen.

Laten we eens kijken naar de gevreesde zone line:

Zone= 545 396 80 24 0 1 0x28190001 1 -0.5 0x28190003 0 0.5 3 0
Zone= X Y DX DY Resize ? AnchorID ARX ARY ItemID DRX DRY OffX OffY

Het "?" item is altijd 1, wanneer de Editor gebruikt wordt en niet veranderd kan
worden. Ik heb een theorie over wat het doet, maar zelfs na het maken van 300 items in hetzelfde scherm heb ik nog nooit een nuttigheid gevonden.

Genoeg theorie, laten we wat voorbeelden doen.
__________________

Last edited by java`s revenge; 06-28-10 at 01:53 AM.
java`s revenge is offline   Reply With Quote
Old 03-22-10, 11:15 AM   #5
java`s revenge
Ace of the Deep
 
Join Date: Jan 2007
Location: at periscope depth
Posts: 1,204
Downloads: 97
Uploads: 0
Default

Laten we 2 hoofd objecten creëren in een nieuwe "page". Een panel met 3 wijzers en een
centraal gebonden voorwerp.

(Bijvoorbeeld een AOBF). Met iedere stap zal ik ook de zone lijn schrijven voor het respectieve voorwerp, genomen van de ini file van die pagina.

1. De "page"Creëren:


Ik maak een pagina met de naam "Page_Tutorial". Druk opslaan.
Als ik naar de map Silent hunter 5 \ data \ menu \ page folder ga, kan je zien dat
de oude page`s die uit de lijst verwijderd zijn er nog steeds zijn.
TUTORIAL.ini is niet langer belast door de editor in het spel simpelweg omdat het is verwijderd uit de lijst (het werd verwijderd uit de menu_1024_768.ini-bestand). U kunt het bestand handmatig verwijderen natuurlijk als je het niet meer nodig hebt . Het is een goed idee om een juiste naam aan uw page`s te geven om ze te onderscheiden van de originele pagina's.

Let's see how the game positions pages by default (it does this automatically for you):
1. DX=1024 and DY=768. So it makes them as big as the screen.
2. It anchors them to the Root item (the 0x0 screen item).
3. It gives them a "NoConstraint" resize method.
4. It automatically gives values to ARX=0.5, ARY=-0.5, DRX=-0.5, DRY=0.5 to place the item
Here's why:
- it places the item's top right corner on the top right corner of the Root item (0,768)
- it then shifts the page to the right by half of the anchor's width (ARX=0.5) and down by half of the anchor's height (ARY=-0.5)
it then then shifts the page left by half of the ITEM's width (DRX=-0.5) and up by half of the item's height (DRY=0.5).



Since both of the items had the exact same dimensions, we're basically back to start. So why did the Editor bother?

Object Pivot

That's because the Editor has a real passion for DRX= -0.5 and DRY = 0.5. This particular set of values basically shifts the object's "corner" to the center of the object. Let me rescale my page to show this effect better.



I've only changed the size, not the position. Yet the page remains centered on the screen. Even though the corner of my page now sits in a different place, the center of my page is has remained in it's old position. So you see, the DRX and DRY values are the coordinates of the objects "pivot".
- (0,0) pivot in the top left corner
- (0,1) pivot in the bottom down corner
- (-1,0) pivot in top left corner
- (-1,1) pivot in bottom right corner
- (-0.5 , 0,5) pivot smack in the center
- (3,1.6) pivot outside the object (yes, it can be done and even useful)

This effect can be best illustrated if you create an object, mess with the DRX and DRY and then resize the object with the mouse in the preview screen. I'll do this next with 2 objects to better illustrate the effect. Let's create a panel for 3 dials.

Creating the groups:

I know that I want to have 3 dials. Dials are made up of multiple layered images so it's best to place them in their own groups. So I've made 3 groups. GroupDial1, GroupDial2 and GroupDial3 (IN THAT ORDER). As you can see from the pic, group 3 will be placed beneath group 2 which in turn, will be place beneath group 1. As long as they don't overlap, we don't particularly care about their order.



But hold on a sec, what if I want to move all of them together . Then I'll create another group and move all the others inside it.

So I create the DialsPanelGroup group and cut/paste each of the other groups inside it.



Now let's see where they are...
When creating any New item (groups, buttons etc, meaning everything that's NOT a page)the Editor always gives the following values:

- Size: DX=200, DY=200
- Resize: none
- Anchor: none (meaning that we're in Absolute Positioning mode)
- ARX=0, ARY=0, DRX=0, ARY=0
- And because we're in absolute mode, it positions the item at X=0, Y=200

In other words, it always places ANY new item like this:



Anchor none? Resize none? WTF? That's right. If you create, say, a picture inside a group, you might think "well, if I move the group, the picture will move too right?" Nope. You'll have to edit a bit. First things first, let's anchor the DialsPanelGroup to our page. Actually let's use a better term... "Let's SNAP". There are 2 easy ways to do this:

1. By selecting the Anchor through the drop-down menu.



Observe that you can snap to any anchor on the same level of the hyerarchy (inside the same group, including the group node itself). Snaping the item to itself will be ignored, of course.
Every time you snap an object to another, the editor will automatically do this things:
- DRX=-0.5 DRY=0,5, regardless of their previous values!
- It will then set ARX and ARY in such a way as to maintain the objects position. Observe that the X and Y values don't change.

2. By using the right click menu in the list. This allows you to snap (meaning "use as anchor for...") all the children (objects on the immediate next level in the hierarchy), or all the brothers (objects at the same level in the hierarchy).



The "... not snapped elsewhere" is particularly useful as it allow you to snap all the items that are currently using Absolute Positioning (anchored to the Root object).

Also note that when you cut/paste inside the group, the items are automatically snapped to that group object so, yes, it will automatically get a DRX= -0.5 and DRY= 0.5. However, it will retain it's overall position on the screen.


Placing our objects

Since we've already created all our needed groups, let's quickly place them. You can move and resize any object in the Preview window BUT you'll have a hard time moving overlapping objects because the editor will always select the top object (the last in the list). Moving the group or moving a group that is smaller and completely occluded by its children is practically impossible, so we'll do it manually.
You can enter values in the Control Panel boxes, but, if you try to enter the X and Y values directly it won't work (they're just for show). The only way to move an item is by changing its ARX and ARY values. Make sure you have a calculator close by, because you'll have to do a bit of math

For example, I want to move my DialsPanel group so that it's centered right at .. say... (400,300). I want it to always stay there, regardless of resolution, and it's a fairly small item so I want to resize it uniformly. You can see the coordinates of the mouse at the top bar of the Preview screen.
So...
1. Who's the anchor of DialsPanelGroup? It's Page_Tutorial which takes up the entire screen.
2. So we start at the Page_Tutorial's X and Y, which are X=0 and Y=768.
3. We want to get to X=400 so we have to shift by 400-0=400 pixels. SInce it's a positive value, we're actually shifting to the RIGHT.
4. What's the width of Page_Tutorial? It's 1024.
5. Because I need to shift by 400=ARX*1024, it means that ARX=400/1024=0.390625

6. Now we want to shift down to Y=300, so we must shift by 300-768=-468 pixels. Since it's a NEGATIVE value, we're actually shifting DOWN.
7. What's the height of Page_Tutorial? It's 768.
8. Because I need to shift by -468=ARY*768, it means that ARY=-468/768=-0.609375.

Note1: The next pictures are very big so I'll upload them as snapshots. Click on them to see the full version. I have underlined in RED everything that is important to see. Including the position of where I keep my mouse (remember that you can see the X and Y of the mouse cursor at the top of the Preview Window). Because PrintScreen doesn't show the cursor, I have depicted the cursor as a small yellow circle. I've also temporarily changed the size of the GroupDial objects inside of the panel to allow you to see them as they move.

Note2: Entering values is a bit annoying. You need to write the value and then click inside another box to see the effect. Even so, sometimes, the value resets. If you do this often, it's better to keep your value in the clipboard or you'll be forced to write it again and again... quite annoying.

Let's enter those values:



As you can see, the corner of my item now sits at 400,300. But I want it to be CENTERED there. In other words I want my "pivot" to be in the center. How did we achieved that? We set DRX=-0.5 and DRY=0.5.



Note that the actual X and Y have changed. Those don't show you the position of the "pivot", they always show you the position of the top left corner of an object. Now remember that by default, the Editor has an obsession on centering items. Most of the time it will set DRX and DRY automatically, even when you don't want to. So if you don't manually calculate and place items, you'll have a very hard time figuring out how to precisely place items with precision. And remember, I used to do this in NOTEPAD! And I could only check the position by starting the game after I made each change. We have it easy now.

You might say "why waste time on calculating when we can drag objects, resize objects, all fast in the preview window?" As I said, sometimes there's no way to click objects that are beneath other objects. Even WORSE, every time you drag an object in Relative Positioning (meaning that it has any anchor other than NULL), the DRX and DRY will reset again to -0.5 and 0.5. Most of the time you want it to do this. But trust me, sometimes you don't.

Resizing and quick placing

I want the panel to look like this. I have 3 dials, each with a circular image that sits in a bounding box of, say, 185x185 pixels. I want to space them equally by, say 42 pixels. All dials will have labels so I don't want them to be centered on my panel vertically.


(ignore my Picasso style)

So let's make things easy for us and decide now that we want the left dial to be glued to the top left corner of the panel, the middle dial to be glued to the top center of the panel and the right panel to be glued to the top right corner of the panel.

We would need the following dimensions for the panel:
DX=185+42+185+42+185=639
DY= at least 185, let's put it at 250 for now.

So, first I resize my panel:



Observe that the X and Y values have changed AGAIN, but the center remains fixed at 400,300, based on our DRX and DRY, ARX and ARY values. "Wait a sec, so why did the X and Y changed"?. Well, because if you remember, after you shift based on the anchor's dimensions, you then shift based on the ITEM's dimensions (DX and DY). ShiftX=DRX*DX and so on.

Now let's place our dial groups. Here's a very quick way, perfect for this example. The editor allows you to snap to predefined values. You'll love this. First I select DialGroup1 in the list, because I can't click on it, since it's "beneath" the other 2. Then I press the small "P" button next to the Anchor select box. I can now select 9 predefined positions. Think of them as "ALIGN and SNAP" options. These will automatically enter ARX,ARY, DRX and DRY values for you. I've marked with a small yellow circle the "pivot" of each snap point.



Notes about the Location Presets window:
- if you uncheck the "Inside" option, the DRX and DRY will receive inverse values so that the item appears "outside".
- if you try to use an offset, it might not work because of a bug. For the 3'd group I'll set it manually to demonstrate the effect of offset.

Now let's do the same for the other 2 groups. Just follow the pictures:



For the last group, after snapping it to the top right corner of the panel, I'll create an offset by entering values manually in the OffX and OffY boxes. As you can see, this resultet in a shift of -10 both horizontally and vertically (meaning to the LEFT and DOWN).



But wait a sec! I forgot to resize them! No problemo, we can do it now. Here's how our image looks after I resize all 3.



Trust me, the first time you resize an item after playing with its "pivot" I will hear you all the way to here screaming "aaaaaaaaaaaaah, that's what it is???!!!!".

But wait, there's more. Now that we have placed our items, let's play around with the Panel's dimensions. Luckily I can resize it just by dragging it's borders with my mouse (because it's not obstructed by anything). But before I do that, let me do something VERY important. I will intentionally move the left most dial group just a tiny tiny bit with my mouse. The moment I do that, all the values will be changed! DRX will switch to -0.5, DRY will switch to 0.5, and ARX and ARY will then be calculated to express the new position. THIS ALWAYS HAPPENS WHEN YOU DRAG AN OBJECT!!!!



I'll now drastically resize the Panel. You'll see that the center dial remains glued to the center top, the right dial will stay put at 10 pixels down and left to the right top corner. But the left dial will move wildly.

Continued in the next post...
__________________

Last edited by java`s revenge; 06-28-10 at 02:06 AM.
java`s revenge is offline   Reply With Quote
Old 03-22-10, 11:39 AM   #6
java`s revenge
Ace of the Deep
 
Join Date: Jan 2007
Location: at periscope depth
Posts: 1,204
Downloads: 97
Uploads: 0
Default

I've also added 3 small image objects and positioned them with my mouse to mimic "labels" for the dials. I'll now resize the panel with my mouse:



The effects speak for themselves. Note that if I had actually made the panel very very small, it would've been completely obstructed by its children so it would've been impossible for me to resize it again with the mouse.

So, if you think ahead, you can quickly do stuff like:
- increase space between dials
- increase space between dials and labels

Just keep in mind to be careful when you drag items with the mouse because resizing will then bug your items.

"Yes Kara but c'mon, I mean how many times do we actually resize items?".
Well, every time you switch resolutions for example So yeah, you do need to plan ahead. Make a habbit to resize your panels temporarily just to check if the items act correctly to resizing.

Now, let's talk again about the Resize (resolution rescaling) methods.



Note that you can't see the effects in the Editor, simply because you can't change the resolution. If there's a way to do that, someone please tell me. Make a habbit of writing down each item that you want to create and think ahead how you want it to resize. Multiple combinations are possible. For example I could've opted for my Panel to resize but for my dials and labels to stay as they are. As I'd increase resolution, the distance between the dials and the labels would increase creating an awkward effect (similar to the first picture). Thus, when you combine different resize methods in a hierarchy (very useful at some times), make sure you understand how it will behave. and test it at multiple resolutions in the game before releasing the mod. You can achieve any effect that you want, don't let the editor decide for you. You have complete control.

By default, the editor selects Resize=None for all newly created items. I've already explained each so I'll now give you some examples of where each is useful:

None: any item that you WANT to become smaller and smaller as you increase resolution. Buttons are ok, but text might be hard to read and images might be hard to see.

NoConstraint: ANY invisible item that must fill the screen. That means groups, pages...

ConstantAspectRatioVerticalRes: Best used for any image that's not a background. Dials, buttons, anything that you want to retain it's overall relative size. If you use it for backgrounds (images that fill the entire screen), they'll be stretched uniformly until the top and button of the image reaches the top and bottom of the screen. That will leave you with empty bands to the sides when using non 4:3 resolutions.

ConstantAspectRatioHorizontalRes: Best used for any background image that must fill the screen. They'll be stretched uniformly until the left and right margins of the image reach the left and right edges of the screen. That will clip the image at the top and bottom when used on non 4:3 resolutions. Also, ANYTHING that is directly linked to the background and must retain it's position relative to the background (for example custom periscope marks, lens colors, the mighty AOBF) need to use this resize method. So plan ahead for clipping.

For example, when I created the AOBF for Kiub, The AOBF group and all of it's items were scaled with the ConstantAspectRatioHorizontalRes method. But its direct parent was a group that had a NoConstraint method applied. To prevent clipping, I had to place the AOBF inside my periscope viewfinder. This made it harder to see through it, but At least the AOBF appeared in full on any resolution. The periscope bearing linear dial was forced by hardcode to never scale. But I had to keep it in the same position relative to the background image. So in other words, I had:
- periscope dial None linked to:
--background image ConstantAspectRatioHorizontalRes linked to:
---periscope page NoConstraint linked to:
----root 0x0 item.

That's all I can tell you about positioning items. I'll start another thread soon to talk about specific objects and how to use them. If there's anything not perfectly clear about what I've explained or you have any tips and comments, I'm all ears
__________________
java`s revenge is offline   Reply With Quote
Old 06-29-10, 04:39 AM   #7
java`s revenge
Ace of the Deep
 
Join Date: Jan 2007
Location: at periscope depth
Posts: 1,204
Downloads: 97
Uploads: 0
Default

Hallo Allemaal,

Even een vraagje, hebben de mensen nog interesse in
de vertaling?

En is het eigenlijk wel nodig omdat je nu ook google
vertaal hebt.
__________________
java`s revenge is offline   Reply With Quote
Old 07-03-10, 12:53 PM   #8
Dutchie-one
Officer
 
Join Date: Jan 2007
Location: the Netherlands
Posts: 249
Downloads: 255
Uploads: 0
Default

Hallo is er ook een download versie zodat alles nogeens
rustig na te lezen is ?
Of heb ik iets over het hoofd gezien ?

Groet, Dutchie-one
__________________
Old in Age but young of Heart





Dutchie-one is offline   Reply With Quote
Old 07-04-10, 06:12 AM   #9
java`s revenge
Ace of the Deep
 
Join Date: Jan 2007
Location: at periscope depth
Posts: 1,204
Downloads: 97
Uploads: 0
Default

Nee, er is geen dowload versie. De originele schrijver heeft het op
het engelstalig forum een uitleg geschreven. In de 1ste post heb
ik daarvan een link gezet.
__________________
java`s revenge is offline   Reply With Quote
Old 06-11-11, 04:53 AM   #10
raoul01
Machinist's Mate
 
Join Date: May 2009
Location: Zweden
Posts: 122
Downloads: 90
Uploads: 0
Default

kun je het allemaal op 1 pagina zetten?
raoul01 is offline   Reply With Quote
Reply

Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT -5. The time now is 03:47 PM.


Powered by vBulletin® Version 3.8.11
Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.
Copyright © 1995- 2024 Subsim®
"Subsim" is a registered trademark, all rights reserved.