I had some fun hacking on the configuration GUI today
Specifically, I tried to see if I could automatically generate the lines connecting the buttons to their labels.
I created a new kind of add-on, "Game Peripherals", to provide pictures and metadata for the various game console controllers we support. Each game peripheral contains a layout that will be shown in the GUI:
I loaded this image in GIMP and extracted the coordinates for the buttons. I placed these coords in the addon.xml file:
Code:
<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
<addon id="game.controller.nes"
name="NES Controller"
version="1.0.0"
provider-name="garbear">
<requires>
<import addon="xbmc.game" version="1.0.0"/>
</requires>
<extension point="xbmc.game.peripheral" name="NES Controller">
<layout image="layout.png" overlay="overlay.png" costmap="button-costmap.png" width="558" height="262">
<button label="30000" geometry="circle" x="466" y="164" radius="25"/>
<button label="30001" geometry="circle" x="400" y="164" radius="25"/>
<button label="30002" geometry="rectangle" x1="287" y1="175" x2="335" y2="189"/>
<button label="30003" geometry="rectangle" x1="223" y1="175" x2="271" y2="189"/>
<dpad label="30004">
<button label="30005" geometry="rectangle" x1="101" y1="92" x2="141" y2="128"/>
<button label="30006" geometry="rectangle" x1="139" y1="126" x2="172" y2="162"/>
<button label="30007" geometry="rectangle" x1="101" y1="160" x2="141" y2="194"/>
<button label="30008" geometry="rectangle" x1="70" y1="126" x2="103" y2="162"/>
</dpad>
</layout>
</extension>
<extension point="xbmc.addon.metadata">
<summary>NES Controller</summary>
<description>The game controller used for both the NES and the Famicom features a simple four button layout and a cross-shaped joypad.</description>
<disclaimer></disclaimer>
<platform>all</platform>
<nofanart>true</nofanart>
</extension>
</addon>
I wrote a python script that generates a "cost map", where pixel brightness corresponds to the cost of drawing a line through that pixel. I used openCV to render the buttons as they are given in addon.xml, and then dilated the image with an increasing number of iterations to make the cost "fan out" from the buttons.
The best path from button to label should have a few constraints:
- Contact between line and button should be perpendicular
- At most 1 vertical segment, and (subject to being perpendicular) only if line starts on button top or bottom
- At most 2 horizontal segments, at most 2 diagonal segments
The path finder is straight-forward A* search under the constraints above. Initial tests are promising:
A* in python is too slow to run in realtime, so I'll probably generate these paths offline and include them in a
resources/ folder. This way, we can generate an array of paths that skins can select from, depending on where they wish to place the button labels.