[Tutorial] Custom NDS VC layouts

Discussion in 'Wii U - Tutorials' started by MRJPGames, May 16, 2016.

May 16, 2016
  1. MRJPGames
    OP

    Member MRJPGames Pretty great guy

    Joined:
    Aug 17, 2013
    Messages:
    1,048
    Location:
    The Netherlands
    Country:
    Netherlands
    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:
    [​IMG]

    Final result:
    [​IMG]

    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)
    end
    
    If you still have questions please ask them so I can improve this tutorial!
     
    Last edited by MRJPGames, May 22, 2016
    Troopage, nxwing, lordelan and 4 others like this.
  2. ShadowOne333

    Member ShadowOne333 GBAtemp Guru

    Joined:
    Jan 17, 2013
    Messages:
    5,372
    Country:
    Mexico
    Wow.
    Good work!
    Thank you for the tutorial. :)

    This will surely come in handy for people who want to record DS games without having to buy an additional recording capture device for DS games.
    Just your usual TV capture card and you're ready to go!

    Even better, you can enable the filters that Nintendo so delightfully locked out of our grasp to make the image even better. ;)
     
    MRJPGames likes this.
  3. MelonSpeedruns

    Newcomer MelonSpeedruns Member

    Joined:
    Jun 27, 2015
    Messages:
    24
    Country:
    Canada
    Is a similar method availiable for N64 games?
     
  4. MRJPGames
    OP

    Member MRJPGames Pretty great guy

    Joined:
    Aug 17, 2013
    Messages:
    1,048
    Location:
    The Netherlands
    Country:
    Netherlands
    No, sadly enough there is not. It could probably be done, but it would require (VERY) significantly more work than on the DS VC. This is mostly due to the fact that N64 does not have a background image by default (in which case that could be replaced), and that there are no layouts so also no configuration file for it either (which could have possibly allowed for a background setting). So because this is not present in the N64 VC it is not possible in a similar way and might never be made possible.
     
  5. LongLiveTheKing

    Member LongLiveTheKing GBAtemp Regular

    Joined:
    Nov 5, 2010
    Messages:
    179
    Country:
    United States
    This is great i hope more people do this.
     
    MRJPGames likes this.
  6. MelonSpeedruns

    Newcomer MelonSpeedruns Member

    Joined:
    Jun 27, 2015
    Messages:
    24
    Country:
    Canada
    Aw... this is unfortunate. Well, i'm glad that it's still something we can do with DS games!
     
  7. ShadowOne333

    Member ShadowOne333 GBAtemp Guru

    Joined:
    Jan 17, 2013
    Messages:
    5,372
    Country:
    Mexico
    The only way in which you might be able to modify N64 (and SNES/NES/GBA VC) is by hard-hacking the RPX/RPL file.

    You have to convert the RPX/RPL into an ELF file, and then disassemble the ELF file into ARM commands.
    Only then you might be able to tell what parts of the RPX are the ones that modify the aspect ratio, gamma correction, bilinear filters, etc. of the VC emulator.

    Here's a thread that shows up how to modify the aspect ratio of SNES and NES games, and hopefully, soon N64 and GBA games too:
    https://gbatemp.net/threads/understanding-and-changing-snes-vc-rpx-settings.425474/

    Gamma correction hacking and filters might be on the way too.
     
    the_randomizer and MRJPGames like this.
  8. the_randomizer

    Member the_randomizer The Temp's official fox whisperer

    Joined:
    Apr 29, 2011
    Messages:
    17,962
    Location:
    Unknown
    Country:
    United States

    Only caveat with that is I've yet to find a good or even a free PowerPC disassembler because I can't program worth crap lol. If I can find one somewhere, I might be able to help with N64 too.
     
  9. MelonSpeedruns

    Newcomer MelonSpeedruns Member

    Joined:
    Jun 27, 2015
    Messages:
    24
    Country:
    Canada
    Dude, N64 layouts would be so amazing! Keep me updated of your discoveries.
     
  10. ShadowOne333

    Member ShadowOne333 GBAtemp Guru

    Joined:
    Jan 17, 2013
    Messages:
    5,372
    Country:
    Mexico
    Keygen/Crack for IDA Pro. ;)
     
    Subtle Demise and the_randomizer like this.
  11. the_randomizer

    Member the_randomizer The Temp's official fox whisperer

    Joined:
    Apr 29, 2011
    Messages:
    17,962
    Location:
    Unknown
    Country:
    United States
    That issue would be resolved, but the other issue would be I don't know jack squat on how it actually works, disassembling PowerPC instructions :unsure:
     
  12. ShadowOne333

    Member ShadowOne333 GBAtemp Guru

    Joined:
    Jan 17, 2013
    Messages:
    5,372
    Country:
    Mexico
    Did you ask shutterbug about how to do so?
     
  13. the_randomizer

    Member the_randomizer The Temp's official fox whisperer

    Joined:
    Apr 29, 2011
    Messages:
    17,962
    Location:
    Unknown
    Country:
    United States
    Well, I no, I haven't, I think he's busy. I don't know.
     
  14. Larsenv

    Member Larsenv RiiConnect24 Developer

    Joined:
    Sep 28, 2013
    Messages:
    469
    Location:
    Somewhere.
    Country:
    United States
    Thanks.

    I will add it to VCiicon.
     
    MRJPGames likes this.
  15. MRJPGames
    OP

    Member MRJPGames Pretty great guy

    Joined:
    Aug 17, 2013
    Messages:
    1,048
    Location:
    The Netherlands
    Country:
    Netherlands
    Added way to change the manual of the VC. As I cannot rename this thread I would like to ask a mod to rename it to: "[Tutorial] Customize the NDS VC" as I plan to explain how to tweak more than just the lay-outs and now the manual URL.
     
  16. Walo

    Newcomer Walo Advanced Member

    Joined:
    Aug 4, 2008
    Messages:
    89
    Country:
    Chile
    Could anyone upload a configuration with both screens side by side as big as they can be on the Gamepad?
     
  17. MRJPGames
    OP

    Member MRJPGames Pretty great guy

    Joined:
    Aug 17, 2013
    Messages:
    1,048
    Location:
    The Netherlands
    Country:
    Netherlands
    Wow, your really lazy if you can't do that yourself, aren't you?
    But because I already made this for myself for my DS injects, here you go:
    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": "427 320",
                                "target": "drc",
                                "position": "0 80"
                            },
                            {
                                "source": "lower",
                                "rotation": 0,
                                "size": "427 320",
                                "target": "drc",
                                "position": "427 80"
                            }
                        ],
                        "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"
                    },
    
    PS. I am lazy as well (though not to your extend), so I did not change the background texture directory, you don't have to I think, it should just be black if you have no file there but if it doesn't work you'll have to fix it yourself (IT IS NOT HARD).
     

Share This Page