Hi Manuel,
Sorry to say, we don't as yet have a comprehensive documentation on how this all comes together, but hopefully that will change in the near future. The best we have today is the related pages in our KB or Wiki, where we try to add links to relevant discussions when they do occur. You can find pages for Themes and Custom Controls. You may also find this article useful, as it's relevant for the update I made to your project.
Let's concentrate on your immediate concern, the problem with the custom image not showing. The change you made, overriding the image, is the first step as then you have the correct resource inside of your custom control's skin. The next step is making sure that your overridden resource is actually used, instead of the standard one. For many overridden resources, this would indeed be possible by doing exactly what you started on, creating a new theme and customizing the theme property that references the resource you were overriding. To understand this option, open your new TestTheme, navigate to the ButtonTest node and look at the PropertyGrid down right. Explode the nodes for some style and you will see.
In your case (and for the moment you will simply have to find this out in each case), the ArrowDown.gif is not controlled by any such Theme property, so you can't force your ButtonTest to use it by (re)setting a theme property. Instead, you will have to dig a little deeper. For this purpose, what I usually do is to take a look at the .XSLT created for your skinnable control, the ButtonTestSkin.Button.xslt. You will need to follow the calls to the templates to see where your property (the ArrowDown image) is actually being used, and in this case it's within the tplDrawButtonContentAPI template (you find this by educative browsing the standard xslt). This template is best to view within the TestTheme, navigating to the Button node and you will find it within the ButtonSkin.Button.xslt file (within the call to tplDrawButtonContent tempate, the prmDropDownImage parameter).
In this case, I simply made a copy of this template and pasted within the xslt for your ButtonTest control, gave it a new name (tplDrawButtonContentAPItest) and then modified you custom control's call to this template to call this new template.
The modifications required within this new xslt tempate is simply changing the resource for this parameter as you can see in the modified project I uploaded here.
After these modifications, you have an overridden image inside the skin and you also have made sure to modify/override the resources that use this image so they will use your overridden image instead of the standard one. Works like a charm.
For the record, as I chose to do the modifications within the custom control itself, the TestTheme you created is unnecessary for this customization to work. As explained above, this is not always true, and especially for the font question you asked, take a look at what properties you can set by modifying properties within the theme, without doing any custom coding. Experimenting is a good virtue in this case :-)
Hope this explains enough to get you started.
Good luck,
Palli