Creating a basic Crafting table with custom Interface

This guide is for version Spirited Giraffe but may still be applicable for later versions.
If someone would like to proof read please feel free to tell me my errors

I recommend using notepad++ for the txt files and paint.net for the sprites. No LUA knowledge necessary

If you dont the very basics of modding cheak out this tutorial: Modding basics,
but saying that you dont need much knowledge to complete this tutoral.
-----------------------------------------------------------
Index
-Creating the table object
-Creating an interface
-Adding recipes and crafting your table
------------------------------------------------------------

----------------------------- Creating the table object -----------------------------​

the first thing to think about is the table itself we will need to add it into the game as a object;
1.after creating your new mod folder and .modinfo file for the sake of tidyness create the folders "/objects/crafting/{yourtable}" replacing {yourtable} for the folder for your object usually with the same name as the object
2.create a txt file renamed to "{yourtable}.object" (make sure file extensions are enabled on windows explorer) the content of this file should be as follows (all {} must be replaced with correct data and will be explained later)(text after "//" it is just a description of what to include for this category and not necissary but can be left in)

Code:

{
  "objectName" : "{yourtable}", //this is the id the game will reconise your table with this is not the name that will be displayed do not include spaces e.g. "quarrytable"
  "rarity" : "Common", // this effects the colour of the ring around your tables icon
"printable" : false, // "true" or "false" determiners if you want your table to be printable at your 3d printer for its price
  "description" : "{yourdescription}.", // a one sentence description of your object
  "shortdescription" : "{ign}", // the name you want to be displayed when picking up or selecting your table
  "race" : "generic", // the race associated with your table e.g. "apex"
  "category" : "Crafting", // this serves as a subtitle for when your mousing over your objects item
  "price" : 700, // the 3d print price of your table

  "inventoryIcon" : "{youricon}.png", // the icon file you will create
  "orientations" : [
    {
      "dualImage" : "{yoursprite}.png:<color>", // your sprite ":<color>" only necessary for objects with multiple colours but can be left no problem
      "imagePosition" : [-16, 0],  // this determines where the object is placed in relation to your mouse point "[0,0]" means your mouse will be at the bottom left corner of sprite when placing
      "frames" : 1, //leave a 1 unless animating your table
      "animationCycle" : 1.0, //leave a 1.0 unless animating your table

      "spaceScan" : 0.1, //works with "collision"
      "anchors" : [ "bottom" ], //were your object must be placed
      "collision" : "platform" //look at your sprite if your hight is a multiple of 8 and your table has a flat top then you may wont the player to be able to stand on your table and objects to be placeable

    }
  ]
}

4.next we must create a .png sprite for the table and a .png icon with a resolution of 16*16 with different names
fill the names into the "dualImage" and "inventoryIcon" feilds in your object file (don't forget your extensions)
5.create a {yourtable}.frames txt file formatted like this

Code:

{

  "frameGrid" : {
    "size" : [32, 16], //this is the resolution of your image
    "dimensions" : [1, 9], // the 1 represents the number of frames for animated objects and the 9 represents the number of colours if you don't know about this leave at "[1, 1]"
    "names" : [
      [ "default" ], //same as above leave as '["default"]' unless you know about colours
      [ "red" ],
      [ "blue" ],
      [ "green" ],
      [ "yellow" ],
      [ "orange" ],
      [ "pink" ],
      [ "black" ],
      [ "white" ]
    ]

  }
}

now you should be able to spawn your object in game just .admin then .spawnitem {yourtable}
and bam

--------------------------- Creating an interface ---------------------------​

1.The interface we nee to create is the "popup" that gets brought up on interaction with your crafing table to create one first we need to create a few folders. these are: "{yourmod}/interface", "{yourmod}/interface/windowconfig", "{yourmod}/interface/crafting".

2.In the windowconfig folder create a file called {yourmod}.config (the name dosent actually matter) format this file like this (this ones big so just copy paste for now we will do transformations after we get it working)

Code:

{
  "paneLayout" : {
    "panefeature" : {
      "type" : "panefeature"
    },
    "background" : {
      "type" : "background",
      "fileHeader" : "/interface/crafting/craftingheader.png", // these can be changed if you want a custom look for your interface
      "fileBody" : "/interface/crafting/craftingbody.png",
      "fileFooter" : "/interface/crafting/craftingfooter.png"
    },
    "close" : {
      "type" : "button", // this is the button you press to exit the menu and can be moved if you would like to
      "base" : "/interface/inventory/x.png",
      "hover" : "/interface/inventory/xhover.png",
      "press" : "/interface/inventory/xpress.png",
      "position" : [322, 261]
    },
    "windowtitle" : { // !importaint!
      "type" : "title",
      "title" : "{title}", //this is the title that appears at the top of the interface and can be moved
      "subtitle" : "  (subtitle)",
      "position" : [-5, 252],
      "icon" : {
        "type" : "image", //this is the icon at the top of interface can be moved
        "file" : "/interface/crafting/craftingtable.png",
        "position" : [0, -20],
        "zlevel" : -1
      }
    },
    "lblSchematics" : { //the label that say SCHEMATICS
      "type" : "label",
      "position" : [88, 243],
      "hAnchor" : "mid",
      "value" : "SCHEMATICS"
    },
    "lblProducttitle" : { //the label that say PRODUCT
      "type" : "label",
      "position" : [265, 243],
      "hAnchor" : "mid",
      "value" : "PRODUCT"
    },
    "spinCount" : { //the arrows that allow you to increase and decrease the num of product
      "type" : "spinner",
      "position" : [202, 40],
      "upOffset" : 34
    },
    "tbSpinCount" : { //the number of probuct that will be made
      "type" : "textbox",
      "position" : [214, 40],
      "textAlign" : "center",
      "maxWidth" : 15,
      "regex" : "x?\\d{0,3}",
      "hint" : ""
    },
    "lblAmountInput" : { //the black box the tbSpinCount will is in by defult
      "type" : "image",
      "file" : "/interface/crafting/amount.png",
      "position" : [208, 39],
      "zlevel" : -3
    },
    "lbllvlSort" : { // the ^level^ image
      "type" : "image",
      "file" : "/interface/crafting/organizelevelhigher.png",
      "position" : [123, 232],
      "zlevel" : -3
    },
    "btnCraft" : { //the craft buttons image
      "type" : "button",
      "base" : "/interface/button.png",
      "hover" : "/interface/buttonhover.png",
      "position" : [274, 38],
      "caption" : "Craft"
    },
    "btnFilterHaveMaterials" : { //the have materials checkbox
      "type" : "button",
      "base" : "/interface/crafting/checkboxnocheck.png",
      "baseImageChecked" : "/interface/crafting/checkboxcheck.png",
      "checkable" : true,
      "checked" : false,
      "position" : [26, 84]
    },
    "lblProduct" : { // the MATERIALS AVAILABLE text
      "type" : "label",
      "position" : [51, 83],
      "hAnchor" : "left",
      "value" : "MATERIALS AVAILABLE"
    },

    "scrollArea" : { //the area with recipes appare and all funtions within it
      "type" : "scrollArea",
      "rect" : [5, 93, 174, 231],
      "children" : {
        "itemList" : {
          "type" : "list",
          "schema" : {
            "selectedBG" : "/interface/crafting/craftableselected.png",
            "unselectedBG" : "/interface/crafting/craftablebackground.png",
            "spacing" : [0, 1],
            "memberSize" : [156, 20],
            "listTemplate" : {
              "background" : {
                "type" : "image",
                "file" : "/interface/crafting/craftablebackground.png",
                "position" : [0, 0],
                "zlevel" : -1
              },
              "itemName" : {
                "type" : "label",
                "position" : [21, 11],
                "hAnchor" : "left",
                "wrapWidth" : 116,
                "value" : "Replace Me"
              },
              "itemIcon" : {
                "type" : "itemslot",
                "position" : [1, 1],
                "callback" : "null"
              },
              "level" : {
                "type" : "label",
                "position" : [138, 9],
                "hAnchor" : "mid",
                "value" : "Lvl. 100"
              },
              "newIcon" : {
                "type" : "image",
                "position" : [129, 2],
                "file" : "/interface/crafting/new.png"
              },
              "moneyIcon" : {
                "type" : "image",
                "position" : [126, 1],
                "file" : "/interface/money.png"
              },
              "priceLabel" : {
                "type" : "label",
                "position" : [138, 1],
                "hAnchor" : "left",
                "value" : "0"
              },
              "notcraftableoverlay" : {
                "type" : "image",
                "file" : "/interface/crafting/notcraftableoverlay.png",
                "position" : [0, 0],
                "zlevel" : 1
              }
            }
          }
        }
      }
    },
    "description" : { //the entire contens of the product box when a schematic is selected
      "type" : "widget",
      "position" : [190, 50],
      "size" : [140, 220]
    },
    "filter" : { //the serch box
      "type" : "textbox",
      "position" : [56, 68],
      "hint" : "Search",
      "maxWidth" : 70,
      "escapeKey" : "close",
      "enterKey" : "filter",
      "focus" : true
    },
    "categories" : { //the catagorey buttons allong the bottom of the screen
      "type" : "radioGroup",
      "toggleMode" : true,
      "buttons" : [
        {
          "position" : [19, 45],
          "baseImage" : "/interface/crafting/blocks.png",
          "baseImageChecked" : "/interface/crafting/blocksSelected.png",
          "data" : {
            "filter" : [ "materials" ] //the tag in the .recipe file the button will look for
          }
        },
        {
          "position" : [39, 45],
          "baseImage" : "/interface/crafting/armor.png",
          "baseImageChecked" : "/interface/crafting/armorSelected.png",
          "data" : {
            "filter" : [ "armors" ]
          }
        },
        {
          "position" : [59, 45],
          "baseImage" : "/interface/crafting/weapons.png",
          "baseImageChecked" : "/interface/crafting/weaponsSelected.png",
          "data" : {
            "filter" : [ "weapons" ]
          }
        },
        {
          "position" : [79, 45],
          "baseImage" : "/interface/crafting/items.png",
          "baseImageChecked" : "/interface/crafting/itemsSelected.png",
          "data" : {
            "filter" : [ "consumables" ]
          }
        },
        {
          "position" : [99, 45],
          "baseImage" : "/interface/crafting/smith.png",
          "baseImageChecked" : "/interface/crafting/smithSelected.png",
          "data" : {
            "filter" : [ "tools" ]
          }
        },
        {
          "position" : [119, 45],
          "baseImage" : "/interface/crafting/objects.png",
          "baseImageChecked" : "/interface/crafting/objectsSelected.png",
          "data" : {
            "filter" : [ "objects" ]
          }
        },
        {
          "position" : [139, 45],
          "baseImage" : "/interface/crafting/other.png",
          "baseImageChecked" : "/interface/crafting/otherSelected.png",
          "data" : {
            "filter" : [ "other" ]
          }
        }
      ]
    },
    "rarities" : { // the small colored boxes represnting rarity value
      "type" : "radioGroup",
      "toggleMode" : true,
      "buttons" : [
        {
          "position" : [8, 232],
          "baseImage" : "/interface/crafting/sortcommon.png",
          "baseImageChecked" : "/interface/crafting/sortcommonselected.png",
          "data" : {
            "rarity" : [ "common" ]
          }
        },
        {
          "position" : [14, 232],
          "baseImage" : "/interface/crafting/sortuncommon.png",
          "baseImageChecked" : "/interface/crafting/sortuncommonselected.png",
          "data" : {
            "rarity" : [ "uncommon" ]
          }
        },
        {
          "position" : [20, 232],
          "baseImage" : "/interface/crafting/sortrare.png",
          "baseImageChecked" : "/interface/crafting/sortrareselected.png",
          "data" : {
            "rarity" : [ "rare" ]
          }
        },
        {
          "position" : [26, 232],
          "baseImage" : "/interface/crafting/sortlegendary.png",
          "baseImageChecked" : "/interface/crafting/sortlegendaryselected.png",
          "data" : {
            "rarity" : [ "legendary" ]
          }
        }
      ]
    }
  },
  "tooltip" : { //the hover tool tip and contents
    "panefeature" : {
      "type" : "panefeature"
    },
    "itemList" : {
      "position" : [2, 3],
      "type" : "list",
      "schema" : {
        "spacing" : [0, 0],
        "memberSize" : [125, 25],
        "listTemplate" : {
          "itemName" : {
            "type" : "label",
            "position" : [22, 10],
            "hAnchor" : "left",
            "wrapWidth" : 116,
            "value" : "Golden Moustache"
          },
          "itemIcon" : {
            "type" : "itemslot",
            "position" : [1, 1],
            "callback" : "null"
          },
          "count" : {
            "type" : "label",
            "position" : [118, 0],
            "hAnchor" : "right",
            "value" : "19/99"
          }
        }
      }
    }
  }
}

3.now we need to get this interface to pop up then we interact with our table object
to do this go back to your .object file and add the code

Code:

"interactAction" : "OpenCraftingInterface",
  "interactData" : {
    "config" : "/interface/windowconfig/{interfacefilename.config}",
    "filter" : [ "{recipefilter}" ] //the recipes the table will look for
  }

(dont forget your commas) {interfacefilename.config} is that {yourmod}.config file we created befor.
4. now we should change things with this interface to make it ours, First find the titles and change them befor we start transformations.

5. if you wish to remove a field you can but be carful there are some felds that are necessary. so if the game crashes when you interact with your object chances are you removed a mandatory field. that said you can remove any lable, other than that thier is no easy way to remove a field. try removing the lable "SCHEMATICS"

Code:

"lblSchematics" : {
      "type" : "label",
      "position" : [88, 243],
      "hAnchor" : "mid",
      "value" : "SCHEMATICS"
    },

you can remove 'sub' fields such as a button. for example removing the object button

Code:

{
          "position" : [119, 45],
          "baseImage" : "/interface/crafting/objects.png",
          "baseImageChecked" : "/interface/crafting/objectsSelected.png",
          "data" : {
            "filter" : [ "objects" ]
          }
        },

you can remove all of the buttons but you must leave part of the "root" code. for example

Code:

"rarities" : {
      "type" : "radioGroup",
      "toggleMode" : true,
      "buttons" : [ ]
    }

6. almost anything can be moved around within in your ui. the prosses is simple, the "position" : [ X , Y ] can be edited moving the image in relation to the ui so if i want to move the exit button left change the "position" : [322, 261] to "position" : [200, 261]. the exit button moves from 322 to 200 on the x axis or 122 pixles left.

7.adding is similar to deleting. you can add lables and some buttons ect...

8. finally you may want to replace a image with another (this includes backgrounds) to do this create a image in the "{yourmod}/interface/crafting" folder. use the .png file and change the "baseImage" : , path to the path of your image for exampe

Code:

{
          "position" : [119, 45],
          "baseImage" : "/interface/crafting/objects.png", //change this to change the objects button
          "baseImageChecked" : "/interface/crafting/objectsSelected.png", //change this to change the objects button when selected
          "data" : {
            "filter" : [ "objects" ]
          }
        },

9.finally "filter" : ["{customfilter}"] found inder a button is importaint if you wish to create custom filters that must match with the filters in your .recipe files you will make later.

--------------------------------- Adding recipes and crafting your table --------------------------------​

this last section gives our table a purpose! custom recipes will make your custom objects and items be craftable in game.

First we need to give our table a recipe so we should create the folders: "{yourmod}/recipes" and "{yourmod}/recipes/plain"
in the plain folder create a file called "{yourtable}.recipe" with the content

Code:

{
  "input" : [ //these are the cost to craft
    { "item" : "darkwoodmaterial", "count" : 20 },
    { "item" : "ironbar", "count" : 5 }
  ],
  "output" : { //this is your table
    "item" : "{yourtable}",
    "count" : 1
  },
  "groups" : [ "plain", //this is were the object can be made so "plain" means anywere which is why pe put it in a folder called plain
                      "objects", "all", "tools" ] //these are the groups that thoes buttons you made in your ui early look for
}

now we want to add our recipe as a defult blueprint using the . patch file which should be a txt file placed in your mods root folder called "player.config.patch". format it like this

Code:

[
{ "op" : "add", "path" :
"/defaultBlueprints/tier1/-", "value" : {
"item" : "{yourtable}"} }
]

thier is a whole tutorial on this subject but for now this will do if you want to learn more read on BASIC PATCHING NOW WITH PATH GUIDE

next we wont to add recipes to your table so we must create another folder "{yourmod}/recipes/{yourfilter}" {yourfilter} is refering to the filter you created in your object file under '"filter" :' in this flder create a recipe file called "{itemid}.recipe" with the format

Code:

{
  "input" : [  //these are the cost to craft
    { "item" : "{itemid}", "count" : 20 }
  ],
  "output" : { //this is the item you want to spawn
    "item" : "{itemid}",
    "count" : 1
  },
  "groups" : [ "{yourfilter}", //this is were the object can be made so use the filter you created in your object file of your table
                      "{yourcategory}" ] //these are the groups that thoes buttons you made in your ui early look for, if you want to create a custom category in your ui any items with that custom category here will appear in that list.
}

now we must edit that .patch file we made for our table to add each additional item so

Code:

[
{ "op" : "add", "path" :
"/defaultBlueprints/tier1/-", "value" : {
"item" : "{yourtable}"} },
{ "op" : "add", "path" :
"/defaultBlueprints/tier1/-", "value" : {
"item" : "{youritem}"} }
]

thats it you have made a crafting table object added a ui and made your items craftable at that table so here is an example mod to take assets from. Mega link

 

cool, so what if I want to modify the existing craftingtable and add a new filter etc for my mod specific blocks? copy the original asset and add my code, images etc. but how would I tell the game to load that file and not the original?

 

I only glanced over the tutorial and it is older than the current stable release which is Glad Giraffe. The Nightly branch also differs from the stable branch and should be pushed over to Unstable at some time within 1-2 months. If you want to learn how to mod something then try and aim for Nightly which will replace all other releases.

If you make a mod and create files that match the base assets then the files in your mod will replace the base assets. This however breaks any compatibility with other mods and is why you should, when possible, use json patches (.patch) instead.

If you're not familiar with how the gui is built up in Starbound I would wait with learning how to make patches and start making replacement files first instead.
The | Suit has a basic tutorial on patches for you to look at when you're ready. http://community.playstarbound.com/threads/basic-patching-now-with-path-guide-v1-9.84496/

 

Yeah, this tutorial is outdated effectively, and I noticed some inaccurate information.

 

thanks, that makes it clearer, though I did intend to attempt to use the patch system.

but after I posted that I figured I'd just make a whole new mod-specific table, thanks anyway!