Tutorial
Updated
Custom NDS VC layouts
Editing the layout of the NDS screens of the VC is actually quite trivial. I reccomend you first open Paint.net of Photoshop and design your layout there. The TV resolution is 1280x720 and the DRC (GamePad) resolution is 876x480.
Example TV layout design:
Final result:
How to make the design function inside the VC:
There is a sub-section to each layout in 'configuration_cafe.json' for the screen (most have 4, 2 screens on the TV and 2 on the GamePad, all support this if manually added). I have not explored the possibility of adding new lay-outs, only replacing ones with a custom one. For an example lay-out see below.
There are a few attributies you need to know how to set to create your own custom lay-out.
source: This is the screen of the DS, upper is the top screen, lower the bottom.
rotation: In degrees, this set's the rotation of the screen on the TV/GamePad
size: Size of the screen on TV/GamePad (recommended to be a multiplication of the original resolution but it doesn't have to be)
target: Render this on the TV or GamePad (called 'tv' and 'drc' respectively)
position: Position of the top left of the screen.
Custom backgrounds:
You can also create custom backgrounds for your or existing lay-outs. This is very easy to do.
1. Create your background (keep the positions of the screens in mind, I recommend placing these in the image when designing the background)
2. Place them in the content\0010\assets\textures folder. Save them as a PNG file, filename is not important.
3. In each layout there is a section with background, most point to tvback.png and drcback.png, just replace these filenames with your own and the custom background will now display!
Custom Lay-Out desctiptions:
1. Navigate to content\0010\data\strings
2. Open the folder for the language you want to edit (en for US and eur_en for EU english, other langues work the same)
3. Open strings.json
4. Search (ctrl+f) for the VCM_LAYOUT
5. Now edit the strings of the NAME and DESCRIPTION of the layout number that you replaced in configuration_cafe.json
Example configuration_cafe.json:
Change manual:
This is a very minor thing, most people probably won't need this, but it is nice to have. Please note that as not all manuals are online you might have to scan in your manual and host it somewhere for this to work.
To change the manual you will have to modify the vcmenus.lua file in content\0010\data\scripts. Now search for the function openManual(), and change it to this:
If you still have questions please ask them so I can improve this tutorial!
Example TV layout design:
Final result:
How to make the design function inside the VC:
There is a sub-section to each layout in 'configuration_cafe.json' for the screen (most have 4, 2 screens on the TV and 2 on the GamePad, all support this if manually added). I have not explored the possibility of adding new lay-outs, only replacing ones with a custom one. For an example lay-out see below.
There are a few attributies you need to know how to set to create your own custom lay-out.
source: This is the screen of the DS, upper is the top screen, lower the bottom.
rotation: In degrees, this set's the rotation of the screen on the TV/GamePad
size: Size of the screen on TV/GamePad (recommended to be a multiplication of the original resolution but it doesn't have to be)
target: Render this on the TV or GamePad (called 'tv' and 'drc' respectively)
position: Position of the top left of the screen.
Custom backgrounds:
You can also create custom backgrounds for your or existing lay-outs. This is very easy to do.
1. Create your background (keep the positions of the screens in mind, I recommend placing these in the image when designing the background)
2. Place them in the content\0010\assets\textures folder. Save them as a PNG file, filename is not important.
3. In each layout there is a section with background, most point to tvback.png and drcback.png, just replace these filenames with your own and the custom background will now display!
Custom Lay-Out desctiptions:
1. Navigate to content\0010\data\strings
2. Open the folder for the language you want to edit (en for US and eur_en for EU english, other langues work the same)
3. Open strings.json
4. Search (ctrl+f) for the VCM_LAYOUT
5. Now edit the strings of the NAME and DESCRIPTION of the layout number that you replaced in configuration_cafe.json
Example configuration_cafe.json:
Code:
{
"screen": [
{
"source": "upper",
"rotation": 0,
"size": "640 480",
"target": "tv",
"position": "0 120"
},
{
"source": "lower",
"rotation": 0,
"size": "640 480",
"target": "tv",
"position": "640 120"
},
{
"source": "upper",
"rotation": 0,
"size": "512 384",
"target": "drc",
"position": "30 48"
},
{
"source": "lower",
"rotation": 0,
"size": "256 192",
"target": "drc",
"position": "568 240"
}
],
"desc_string_id": "VCM_LAYOUT_10_EXPLANATION",
"background": [
{
"position": "0 0",
"rotation": 0,
"resource": "//content_dir/assets/textures/AA_bg_TV.png",
"target": "tv",
"size": "1280 720"
},
{
"position": "0 0",
"rotation": 0,
"resource": "//content_dir/assets/textures/AA_bg_DRC.png",
"target": "drc",
"size": "854 480"
}
],
"name_string_id": "VCM_LAYOUT_1_NAME"
},Change manual:
This is a very minor thing, most people probably won't need this, but it is nice to have. Please note that as not all manuals are online you might have to scan in your manual and host it somewhere for this to work.
To change the manual you will have to modify the vcmenus.lua file in content\0010\data\scripts. Now search for the function openManual(), and change it to this:
Code:
function openManual()
local manual_url
manual_url = "http://yoursite.com/yourmanual.pdf"
VC_openBrowser(manual_url)
endIf you still have questions please ask them so I can improve this tutorial!
Last edited by MRJPGames,
