MatroseFuchs

I wrote to the devs about this issues, they will fix it in one of the next updates SMC. Thanks for the report.

Hi, do you working with SoundModCreator or handle editing xml file?

How to add and use Unbound technology on the ModAPI stage As Unbound layout is processed on the Flash side, then the development of the mod will be associated mainly with ActionScript files. We need a layout handler and the main file for the Flash API similar to what we already did in the previous examples. But first, let’s prepare a file with a simple layout code that we will experiment with, for example, draw a square in the corner. test_window.xml Create an XML file with a simple layout of a simple white square. The resulting XML file shall be run through the "xml2as.bat" utility in order to compile layout expressions into a SWF file similar to what we did with the modification of the finished XML. Put the resulting SWF file in "..\res_mods\0.8.8.1\gui\unbound\flash" and add its path to "..\gui\ lash\USSExpressionsLoader.xml". Movie.as To process XML files with Unbound layout, we need to create a handling tool. To do this, open the AcrionScript editor (for example, FlashDevelop) and create a new project. The main Flash file of the mod will be called, as is customary, "Main.as", and for handling the layout we will create another one and name it, for example, "Movie.as" from which we will start. Now we need to inherit the Movie handler class from the "ScaleformMovie" class, which we import from the external library "wows_library.swc", with the command "import lesta.dialogs.ScaleformMovie;". In this parent class, we will have almost all the necessary tools to work with the Unbound layout. Next, we declare a variable for the layout “element” "private var unboundElement: UnboundElement;" and import this data type "import lesta.libs.unbound.UnboundElement;". We also need a controller for our element, declare it "private var unboundController: UnboundElementController;", we also import its class "import lesta.dialogs.battle_window_controllers.UnboundElementController;". Since our handler inherited the class from the parent class, now it is necessary to correctly describe the main function of the class "public function Movie()". If we look at the parent class, we will see that its main function has three parameters, so we also need to set three parameters. When creating an instance of our class, we will pass there all the necessary parameters. Now, in this Main() function, we add the call to the parent class (super()) by the rules and pass the parameters of the function of our class to it. Here we add a callback that will update the element stage size. The next function that we will describe is the main function of handling the layout. So, let's declare a function, for example, call it "public function buildUnboundApplication():void", create an instance of the element "new UnboundElement()". Now our element needs to specify the path to the XML file with layout in the "config" property. This can be done by specifying a direct path in the format "C:\\Games\\World_of_Warships\\res_mods\\0.8.7.0\\PnFMods\\ubtest\\test_window.xml" (this is the path in ActionScript), or by adding a file search function "get configPath()", this is necessary due to the peculiarities of downloading files, because the folder with the mod is outside the file upload directory. After that, in the "rootElementId" element property we indicate the name of the element in the layout, which will be the main one for displaying on the stage. Next, we need to create an instance of the controller "new UnboundElementController()", which will be responsible for loading this element. In the "clip" property you need to specify the "unboundElement" element to be loaded, via "setDataHub" method, add the "setDataHub (dataHub)" datahub instance to the controller property, which we will pass when initializing the "Movie" (this dataHub instance will not contain data but we need to add it), using the "setUbCentral" method add an instance of "protoCentral" (it will contain all the bindings), which is located in the parent class "ScaleformMovie", then using the "initController()" method initialize it. Now let's set the element stage size using the "setStageSize" function and pass it the stage sizes from the main class of the Main mod, which we will describe later. In the function, create an instance of the stage from the available components "lesta.components.Stage", and set the attributes of the component "width, height, scale and evStageSizeChanged", then pass these sizes to the element controller. Finally, add our element to the "addChild (unboundElement)" stage. Main.as In the main class of the mod, declare two variables - "dataHub:DataHub" and "movie:Movie" (our layout handler). In the main function of the class, create an instance of the datahub and declare a call of the main function of the parent class "ModBase" from which we inherit our "Main" (see the previous examples for this). We override the function "init()" of the parent class "ModBase" and describe it, as it will be executed during initialization (if necessary, you can override other parent class functions). In this function, we also need to call the overridable parent class function "super.init();", now we will create an instance of the layout handler "movie" and pass to it the required parameters "new Movie (dataHub, this.stage, gameAPI)", then add the layout handler instance to the container of our mod "addChild(movie)", add to the handler a listener of the event of adding it to the stage "movie.addEventListener (Event.ADDED_TO_STAGE, onAddedToStage);" and add our mod’s link to the ModAPI stage "gameAPI.stage.addChild (this)". Let’s describe the last function that will be called when the handler is loaded onto the "onAddedToStage(event: Event)" stage. For Scaleform to accept our movie, we need to create an entity “entity” with a stage id (id - ComponentClass.stage), a stage component “stageComponent” with the same id, add the stage component to the entity, get a collection of entities with stage components and add our entity "collection.add (entity)" to this collection. Now we can use our handler method to output the result to the stage "movie.buildUnboundApplication();" and delete the listener, because we don’t need it anymore, our element is now on the ModAPI stage. Mod on unbound We compile our project and the resulting Main.swf file (the name of the final project file can be set in the project properties) put to the mod folder. Add the Main.py file in which we write one line "API_VERSION = 'API_v1.0'", because without it, the mod will not work. Add our prepared XML file with the layout to the mod folder, and put the compiled SWF file from XML to "gui\unbound\flash" and add the path to it in "gui\flash\USSExpressionsLoader.xml". Run the client and make sure that our mod handled the file with the layout and displayed a white square in the corner of the game window. Add data to the scope Let's analyze the use of such a tool as a controller, which allows to add data to the scope and operate it, and for this we need to write our own controller. So, we will create a new file in the project and name it "MyUbController", it will inherit from the "UbController" class. In the controller, we override the method "override public function init (param1:Vector.<IUbExpression>):void" so it is possible to pass the calculated arguments to it. Pass the arguments to the parent class "super.init(param1);" and write a line into the scope, which we then display "scope.myText ="Text";". Our controller is ready. Add the controller to the main file "Main.as" via import if the file is in a subdirectory, or as in our case the controller is in the same directory as the other project files, then just declare the controller "MyUbController;" to initialize it and the controller data could be used (if your controller is in the same directory as Main.as, then you do not need to import it), or you can configure your editor so that when assembling the SWF file it also includes unused project files. Now add the resulting controller to the XML file, mark up the text block and use the data from the scope for display. Remember that after changing the layout you need to reassemble its SWF, otherwise we will not see the change. Run the game and see the result. Our simple mod is ready. PS In order to drag and drop our rendered element and the layout does not break, you need to create the “UserPrefs” settings file in which they will be stored and updated.

Hello, ModsSDK.zip_0.8.8.0 can be used for version 0.8.8.1. The method extraction didn't change.

Hi, i tried to use without Wwise, and it works. In step 4 there is no point on add the Wwise.

Hello, unfortunately ModStation does not support a client installed from Microsoft store.

Hello, you can get it using the wowsunpacker tool http://prntscr.com/p0lrht

Hi, there’s no such possibility for now, but we will add it as soon as possible.

Hello, on some maps the lighting was reworked which, in turn, when the mod was installed, led to increased brightness, we will try to repair this mod but it is likely that it will enter the game client, moreover, work on the maps continues and this mod will need to be repaired every patch.

Hello, there is no ship name "JSA037_Hakuryu_Space" in ContentSDK or game client, method "contentSdk.registerShipMod('JSA037_Hakuryu_Space')" can register only ship name 'JSA037_Hakuryu'.

Hello, did you try to switch this buttons with language flags?

Hello, With SoundModCreator you can use sounds for guns, ships and commanders at the same time, but it works only for default value, if you want to use for current commander or ship, you have to wait when we'll fix bug.

CSS Tips and Tricks Usage of style objects (similar to css-classes) Create style objects: (def css SomeStyleObject() (position = "absolute") (width = 100%) (height = 100%) ) Invoke: (block (class SomeStyleObject) ) Example of implementing the Hover pseudo class The Hover is triggered when you point to the cursor to a specific area, and not the entire block If you need to set a certain area as hitArea, add a block whose name='hoverArea' and pass the block's name to the hitArea property of the parentElement element with the help of the $target object. Styles change depending on the screen's width/height (similar to media requests)

Styles and CSS General Description A block's layout parameters can be customized via its style. Each block has its own set of style parameters. Customizing style for the tf block: (tf (style (fontSize = 32) (textColor = 0xFFFFFFFF) ) (text = 'Hello world!!!') ) Customizing style for the block-type block: (block (style (backgroundColor = 0xffff0000) (width = 100px) (height = 100px) ) ) Customizing style for the mc block: (mc 'Window_BG' (style (width=100) (height=50) ... ) ) Styles can be described in a separate definition and transferred to the block's class property. (def element TestView() layout = true (block (class BlockStyle) ) ) (def css BlockStyle() (backgroundColor = 0xffff0000) (width = 100px) (height = 100px) ) The value of the class property can be calculated in an expression. This allows you to adjust the blocks' styles depending on the conditions. If several styles with the same properties are applied to a block, the subsequent ones will overwrite the values of the previous ones. The application sequence is important. (block (class BlockStyle_1) (class BlockStyle_2) ) Note: But if you change the style's property directly in the style and transfer CSS as a parameter with the same property, the sequence of style application does not matter. The style block will be the last one applied. Table of Styles Block types: Basic blocks: tf, mc, image, and text_input. Container blocks: block (and all its aliases — hblock, vtile, gtile, reverse, and hreverse), list, view_holder, slider, scroll_bar, progress. and scrollArea. Container blocks inherit the properties and methods of their base block. Property CSS analog The property is supported by: Value types Example of a possible valie width width all blocks number, %, px 10px; 10% minWidth min-width all blocks number, %, px 100px; 50% maxWidth max-width all blocks number, %, px 100px; 50% height height all blocks number, %, px 10px; 10% minHeight min-height all blocks number, %, px 100px; 50% maxHeight max-height all blocks number, %, px 100px; 50% position position all blocks absolute, flow absolute left left all blocks number, %, px 10px; 10% right right all blocks number, %, px 10px; 10% top top all blocks number, %, px 10px; 10% bottom bottom all blocks number, %, px 10px; 10% center offset from the center all blocks number, %, px -170 hcenter offset from the center horizontally all blocks number, %, px 10px; 10% vcenter offset from the center vertically all blocks number, %, px 10px; 10% marginLeft margin-left all blocks number, %, px 10px marginRight margin-right all blocks number, %, px 10px marginTop margin-top all blocks number, %, px 10px marginBottom margin-bottom all blocks number, %, px 10px paddingLeft padding-left container blocks number, %, px 10px paddingRight padding-right container blocks number, %, px 10px paddingTop padding-top container blocks number, %, px 10px paddingBottom padding-bottom container blocks number, %, px 10px padding padding container blocks number, %, px 10px backgroundColor background-color container blocks 0xARGB 0x1000ff00 backgroundImage background-image container blocks str, 'url: {url}', 'bitmap: {linkage}', 'symbol: {linkage}' backgroundImage = 'url:..\icons\ico.png' backgroundSize background-size background-repeat container blocks fill; crop; cover; repeat; autosize backgroundSize = "crop" flow flex-direction container blocks Flow.HORISONTAL, Flow.VERTICAL, Flow.TILE_HORIZONTAL, Flow.TILE_VERTICAL flow = "Flow.HORISONTAL" align justify-content align-items container blocks left, right, bottom, top, center, middle align = "middle|right" alpha opacity all blocks number from 0 to 1 1; 0; 0.4 fontSize font-size tf number 36 leading inter-string interval tf number letterSpacing letter-spacing tf number 2 fontFamily font-family tf str textColor color tf 0xRGB 0xCFC7A8 textAlign text-align tf left; right; center textAlign = "center" multiline white-space tf bool true; false ubScaleX transform: scaleX() all blocks number changes the block's scale horizontally 1.25 ubScaleY transform: scaleY() all blocks number changes the block's scale vertically 1.25 rotation block rotation, suitable for blocks which are located in absolute position all blocks in absolute position number (value in degrees) (style (rotation = 30) ) pivotX zero-point position by X used for rotation, scale, absolute position all blocks in absolute position number, %, px (style (pivotX = 50%) ) or (style (pivotX = 100px) ) pivotY zero-point position by Y used for rotation, scale, absolute position all blocks in absolute position number, %, px (style (pivotY = 10%) ) or (style (pivotY = 20px) ) scaleX scale by X could be < 0, applied to block itself and its children all blocks double (style (scaleX = 1.2) ) scaleY scale by Y could be < 0, applied to block itself and its childre all blocks double (style (scaleY = -1.0) ) BackgroundSize (def element NationFlagsSmall () layout=true (style (bind backgroundImage "'url:../nation_flags/small/flag_USA.png'" init=false) (backgroundSize = "fill") (width = 117) (height = 72) ) ) cover - растягиваем текстуру по размеру контейнера с сохранением пропорций текстуры, чтобы она заполняла всю площадь, с обрезанием текстуры за пределами контейнера. crop - обрезаем изображение по размеру контейнера. fill - растягиваем изображение по размеру контейнера без сохранения пропорций. align - позиционируем изображение по центру контейнера с обрезанием текстуры за пределами контейнера.

UI Widgets Symbol Adding a MovieClip to the stage by linkage. Symbols are used inside definitions of elements, whose layout parameter is set as false. Layout system is disabled. Example: (style (backgroundImage = "'symbol:minimap_aim_position'") ) 'symbol:' + toLower('minimap_' + markerIcon) Sprite Adding a Sprite instance to the stage. Sprites are used inside definitions of elements, whose layout parameter is set as false. Example: MC Adding a MovieClip instance to the stage by linkage. MovieClips are used inside definitions of elements, whose layout parameter is set as true. Layout system is enabled. Example: (def element TestView() layout=true (mc 'FWCloseButtonSlimMC' (name = 'closeBtnCrossAnim') (bindcall gotoAndPlay "stateFrame") ) ) TextField Adding a TextField instance to the stage. This is supported for all elements, whose layout=true|false. To display a text, use the text or htmlText property. When text and htmlText will set at the same time, only last action will applied Example: (tf (text = 'Hello world!') ) When the text is too large and doesn't fit into the text field, you can use the elideMode property. If elideMode=true, the text that doesn't fit into the block is cut off, and the last three symbols of the text inside the block are replaced with dots. Every time a text is entered, the block generates the textElideStatus event with the value argument, which indicated whether the text has been cut or not. Example: substitute substitute - textblock method that allows replacing substrings with pictures. init=true - required argument (tf (class $TextDefault19NM) (bindcall substitute imageOffset="_frameTextCount" substitutionMap={'[test_icon]' : 'icon_ground_radar_ally' } sourceText='radar: [test_icon] mouse: [KEY_LEFTMOUSE]' postfix='_bg' init=true ) ) Element Block It adds a Sprite container-instance to the stage. All nested blocks will be added to this container and positioned one after another, based on the value of the flow property in the block's style. A block has the following aliases: block - vertical block hblock — horizontal block vtile — vertical tile block htile — horizontal tile block reverse — vertical block with reverse order of elements in it hreverse — horizontal block with reverse order of elements in it backgroundImage It adds a Bitmap instance to the stage. In the source property, specify the following: The path to the file (specify the relevant object of the R-class global object) The texture name from the atlas URL of the image If the block's size hasn't been set in style, the block will become of the same size as the image, once the image is loaded. (bind backgroundImage "markerIcon") ---------------- (style (bind backgroundImage "'bitmap:' + toLower(markerIcon)") ) ---------------- (block (style (backgroundImage = 'url:../aircraft/icon_lock.png') ) ) Slider This component is just a regular Slider. The component is configured through the following variables in its scope: value (number) — current value of the slider between the minimum and maximum values. minimum (number) — minimum value. maximum (number) — maximum value. enabled (true/false) — whether the slider is available or not. The slider can dispatch the following events: evValueChanged — the slider value has changed.