RetroPad Editor - create and edit onscreen gamepads

Is there a way to add a background image in the editor itself, or do we have to add that to the overlay ourselves by editing the config file directly? Sorry if it’s a dumb question, I’m a complete novice at creating overlays.

Click “Create/Edit” under overlay section, then tick “Edit current overlay” checkbox. It automatically opens additional overlay parameters. Add new line with file name

overlay = your_image.png

File name should be in double quotes if contains spaces or path slashes. This is not much different from editing config - this is only shortcut for overlayXX_overlay = image.png in .cfg file

1 Like

How can I animate the controls? It’s possible?

not exactly. You can do a sort of fake animation, though, by making a background with the pressed button state and then you cover it with an unpressed image and set it to go transparent on activation. This makes the unpressed image disappear and reveal the pressed state, which looks like animation.

2 Likes

Thanks, so, I can configure which image I want to be displayed when the image is transparent according to which button I am pressing, and how that would be done?

The existing “animated” overlays can explain it much better than I could in words :slight_smile:

As has been said before - there is no straightforward way to set images for pressed/released states of button. Only thing you can do is changing image opacity on button press (alpha_mod under additional button options or overlayXX_descYY_alpha_mod parameter in .cfg file).

Common approach for animated overlays is to make background with “pressed state” button image and place real button on top of it. alpha_mod should be 0.001 or something, so button will literally disapear on press, revealing background. This method has strict limitations: overlay opacity should be 100%, can not animate whole d-pad tilt, does not work on top of game viewport…

Also after this question I’ve tested image with alpha value of 1 and button alpha_mod=255. And it works well - non-colored pixels remain transparent! This actually makes possible to show image on press instead of hide.

1 Like

Please excuse my poor English.

I see that by creating the image after the button is pressed with an alpha value of 1 in the image editor and setting “alpha_mod = 255” for the button in question in the configuration file, I can “compose a neutral background and a pressed button image”. It is easy for me to understand:) I think it would be possible to do something like a button that glows when pressed.

-original japanese-

つたない英語をお許しください。

ボタン押下後の画像をアルファ値にして1で画像エディタで作成し、構成ファイルの当該ボタンの"alpha_mod = 255"にすることで、「ニュートラルな背景と押されたボタン画像で構成する」ことが出来るますね。私にも理解しやすいです:) 押下時に光るボタンみたいなこともできるのではないでしょうか。

I haven’t messed with them myself, but neil4 added some interesting new overlay components that you might be able to integrate with your tool that generate a dpad (and maybe a face button quad?) that act differently with transparency when you hit a single direction, IIRC. He also made an overlay that uses them so you can use it as a reference.

Yes. This method is actually suitable for outer glow effect. But using very big values for alpha_mod will cause aliasing around curved edges. So you need some workaround (dithering?).

abxy_area and dpad_area commands can be entered manually in editor, but maybe I’ll add those to command list later.

If I understand correctly *_area does nothing with animation - new overlays still use separate buttons for highlighting. But combining overlay0_desc0_range_mod_exclusive = true on area and overlay0_desc1_reach_x = 0 on underlaying button should exclude this button from input. And this makes possible to create fully animated d-pad: 8 images of tilted positions stacked in one place and dpad_area on top of it.

2 Likes

Interesting… do you know where can i read some documentation about the usage of these 2 commands? ( range_mod_exclusive and reach_x ) i’d like to play with those and see if i can make it work.

1 Like

There was another question about this: Can anyone explain the new features dpad area? Did not find any additional docs.

Neo-retropad has dpad and abxy with those params. You may check it.

Idea is to use dpad_area for actual input and underlaying “layers” for fake animation. But I did not tested how it actualy works.

1 Like

and sometimes reply button does not work

Also i made some updates: now it is possible to manipulate multiple buttons. Mouse drag or two-finger tap to select area.

…but can not edit topic header to add this.

1 Like

I have seen that post. And as you mentioned there, i couldn’t find (or understand) more use for those new functions, Than touchscreen usability. And not much related to overlay images. Maybe we need to ask the implementators, if this could be achieved or maybe give us a sample overlay config. (I’ll chek thioe two “neo” overlays mentioned there, but i doubt that they use custom images for dpad button presses. Also Thanks for keeping the overlay editor updated and adding new features!

Hi everyone on this forum. I don’t know if this is the right place to ask this question. The question I want to ask has to do with the activation of the translation service in real time in a game through hotkeys or shortcuts; I am asking about this because on an Android device I have not been able to run the real-time translation because all hotkey settings are available for peripherals, ie input devices for desktops, laptops, etc; such as keyboards, mouse, joystick among others; but the touch screen option is not enabled to be able to configure a button or combinations of emulated controller buttons on the same touch screen (gamepad or emulated controller as an overlay) to be able to activate real-time translation in a given game. In a nutshell I have not been able to enable real-time translation in any game (eg NES games) in Retroarch 1.15.0. I have already enabled all the necessary configuration to run the IA Service through a zTranslate api. So I’m wondering: Does IA Service work on an Android smartphone? Thank you all in advance for your patience and understanding.

if i want add button command let say ai_service and at the same time button pressed it changed the overlay…how to do that?

Hi. This has been answered by muttsuenem already - button with ai_service command should toggle Ai Service.

Source file that may be used as command reference: https://github.com/libretro/RetroArch/blob/master/configuration.c#L281

Create separate buttons for each command with same size and position. Linking with | does not work with overlay_next.