Embedding OTF Fonts in Windows Phone 8

Friday, January 3rd, 2014

Now I don’t think there is a difference between between TTF and OTF fonts when it comes to Windows Dev. I do how ever think that the way the fonts them selves are set up, are different.

A lot of people as well as my self have had trouble with embedding OTF fonts. The problem ended up being the name of the font inside the font file. The Windows OS font does not show you all of the variations on the name.

How to embed a font you are having trouble with:



MyFontFileNameExtraBold.otf needs to have 2 properties set the “Build Action” which should be resource for WinPhone 8 and the “Copy to Output Directory” which should be Copy if newer. See image bellow.


The font name problem

As you can see in the above FontFamily prams for custom fonts its made up of the path to the font followed by a hash then the font name. Now for some reason it is not the font name that creates the problem. first you need a font viewer that  shows all the names.

I use: http://us.fontviewer.de/download.html

Open up your font in this program. You will see lots of info for the font. In my case I needed to use the “Preferred Family” name to replace the “My Font Name” in the path above. but if that does not work for you try one of the others. See image bellow:


AS3 Development in OSX

Sunday, January 20th, 2013

I had a small AS3 project and decided I would stray from the standard Flash Builder solution provided by adobe to see how things have changed over the last few years. I ended up looking at two solutions. Being major TextMate fan I set it up and hooked it up to the Flex SDK. On the recommendation of a colleague I checked out the latest version of FDT as well.

TextMate 2 still supports AS3. Due to the broad nature of the application it does require some setting up. There is a plugin for As3. The plugin however is not the only part of the setup process. See setup instructions here. If you already use TextMate or have an affinity for it then its very usable once you get through the setup process.

FDT used to be a Eclipse plugin back in the day. Some where between FDT 3 and FDT 5 it became its own app. Well you get eclipse pre-bundled with it. FDT used to be quite pricy. How ever now they offer a free version. The free version does not have all the bells and whistles you get with the paid for version but if your looking for is a quick and easy way to compile AS3 projects. It has a two step setup process and practically works out of the box. The only thing you have to do is hook it up to the Flex sdk then all the settings have defaults and you set them all in a GUI.

In short FDT is the easiest and quickest solution if all you want is to get in, compile then out.

AppCode File Template for CoreGraphics and PaintCode

Wednesday, November 21st, 2012

In my last post I setup a CALayer subclass for CoreGraphics and PaintCode.

I created an AppCode template that I am sharing here.

The header file template:

Implamentation file template:


Vector Graphics in iOS with CoreGraphics and PaintCode from an SVG file

Monday, November 19th, 2012

Since I started iOS development there has always been one thing missing for me. That has been a vector graphic file format. There is no format currently natively supported by apple.

I did some digging and found SVGKit. This is a very nice library that loads in .svg files. It even supports SVG animations. Not to mention its free. So I had to share this. However it can be tricky to set up.

In the end I settled on using PaintCode. PaintCode is a vector based graphics application that generates CoreGraphics Objective-C. PaintCode will also load in SVG files.

The idea is you load an SVG file into PaintCode. Edit it if needed then copy the Objective-C code into your project.

There are different ways you can include it in your projects. I would like to use it in layer of the CALayer flavour.

What I have done is create a CALayer subclass. That all you have to do is past in the PaintCode code.

For convenience I create all my vector assets at 100×100 pixels. I then use a scale to get it to the right size.

This assumes you have PaintCode and have already got the code ready. Also assumes the image is 100×100.

Step 1:
Add the “QuartzCore.framework” to your project.

Step 2:
Create a new file using the “Objective-C Class” template for iOS. USE CALayer Subclass

Step 3:
Add the bellow line to to your Header file(.h).


Step 4:

Add the bellow code to the implementation file(.m). Note: see line 17 if your image is not 100×100 pixels

Step 5:

Add the CoreGraphics code to the drawImage method.

Step 6:

Add this layer to a view that is currently on the view stack.


Thats all you need.



I created an AppCode template for this.


Using LevelHelper without Box2d for Cocos2d-X

Thursday, November 8th, 2012

I have been trying out LevelHelper recently and it has been very useful when making games that have a fair bit of physics.

I was looking at making a really simple game that did not require physics. Thats where LevelHelper seemed to fall over. Since the editor generates code for you and that code has reference to Box2D.

Fear not for all is not lost, you can still use LevelHelper without implementing the physics. You still need use the Cocos2D-X with Box2D template in xCode. You just don’t attach the physics properties.

So follow the tutorials on the LevelHelper site. When you get to the bellow line of code in the second video:

The first parameter “world” is used to attach the physics properties. The second parameter “this” is what all the image assets in LevelHelper level are attached to. All you need to do is change the above line to:

Now just ignore any code to do with physics and Box2D.

Implementing CCCallFunc Cocos2d-X 2.0

Thursday, August 2nd, 2012

This is a simple way of implementing CCCallFunc.

ClassA wants to pass a function reference to ClassB.

CCCallFunc calls a function without any parameters. If you want to get the CCObject that called it then use CCCallFuncN and if you want to pass your own data use CCCallFuncND

In ClassB header create a variable to hold the callFunction.

In ClassB implementation call the passed in function.

In class ClassA implementation.

Creating Frame Animation in Cocos2d-X 2.0 Using a Sprite Sheet

Saturday, July 28th, 2012

Since the Cocos2d-X 2.0 rc2 a lot of the initialisation has changed so this code works in Cocos2d-X 2.0.

First create a sprite sheet so we can load it in.

Once you have created the Sprite Sheet you will end up with a image file and plist.


I like to name my sprites like this:



It makes creating the animations easier. My code below is depended on the above naming convention.

Create Cocos2d-X 2.0 Sprite Sheet

Sunday, July 22nd, 2012

Cocos2dx is the C++ implementation of Cocos2d. Even though it is C++ and cross platform it still uses plists. There are probably a lot of tools out there that can help you create these sprite sheets. I am currently using SpriteHelper which has export settings specifically targeting Cocos2D-X. I used to use Texture Packer for Cocos2D because it has a nice PVR viewer.

The main reason i am using SpriteHelper is because of Level Helper. Level Helper looks like it has a lot of potential.

Miller Cylindrical Projection with source for (Long, Lat) to (x, y)

Wednesday, May 2nd, 2012

Recently I have been trying to get a custom map working with Longitude and Latitude that plotted in the x and y in iOS. It also needed to work with a zoom and offset. It was a bit of an argus journey but I got there in the end.

What you will need is a projections type(map type) and the formula for the conversion. Ideally a projection type that compensates for the curvature of the earth.

I settled for a Miller Cylindrical projection. The problem with the maps is finding an accurate map. You can use maps with offsets but getting started it helps if you have an accurate map. I ended up going through a lot of maps before I found an accurate one. It had a white border that I had to crop off but otherwise it was perfect.



I scaled it up for testing purposes up to a height of 6563 and a width 8933 cropped.

Here is the Objective-C code and little C to get he job done:

As you can see the the hight and width is hard coded. What if your map needs an offset and you also need to have a dynamic size to compensate for zoom levels.

NO MORE LOGS!!!!! (Using breakpoints in xCode)

Thursday, October 20th, 2011

I cant count the number of times I have compiled an app and found my self lost in logs. This is not not just an xCode issue I have come across this in every language/IDE I have used. For some reason we like to log it and leave it.

We give our selves all maner of excuses for not removing log statements. Whether its needed so every developer on the project knows whats happening or simply not  having time to go back and remove them. We do end up accumulating a lot of logs over the span of a project.

Dont get me wrong a well placed log can make debugging a problem much easier. There are other ways to do it though. Using breakpoints in xCode rocks logging as well as giving you a few extra perks.

Lets start with right click and editing a breakpoint to see:

Now this is one of my favorite tools in xCode. Off that bat it allows for conditional breaks. The above break for example will not break unless the variable newPos is equal to 42. This can help with keeping an eye on a value to make sure it does not act in appropriately and if does you will get the break. How ever clicking the actions text above marked with a blue arrow will unleash the true power behind the xCode breakpoint.

Out of the 5 above options I only use two with any frequency.  The “Debugger Command” which will allow you to log, inject calls and set variables.  The “Log Message” more for english messages and keeping track of the frequency of code used.  OH ya one more thing “Log Message” supports text to speech.

Lets start with the “Debugger Command”:

“po someObject” looks like it would print the description of someObject. Thats not all though. Dont forget the conditional above it “newPos == 42”. Combine the two and you will only print someObject to the consol when newPos is equal to 42. If you uncheck the bottom checkbox “Option” it will log the description with out breaking.

You can also use the field to more than log. Be careful  though as this can easily cause problems if you forget to remove or disable the break.

The command could be to call a function or set a variable like this: “newPos = 13”

If you were to forget to remove a command like that it could burn a lot of time tracking it down.

Moving onto the “Log Message”: 

This obviously prints a message. If you look under text field to the right you can see a key. Above I used the %H which will be replaced by the number of times the break has been hit. Also if you remember to uncheck the Option at the botton it wont break but will simply log at the break.

You also get the option to have the message read out loud. This is useful if you have to keep your attention on the app and cant keep an eye on the logs.

This covers the two basic implementations. What if you need to do more than one thing like run multiple commands?

Stacking Actions:

Pressing the + button as indicated above by the orange arrow. That would be the top arrow as the bottom one is yellow. (my color selection is rubbish) You get another action that runs at the same time.  You can run any number of commands in the one break which can provide very rich loggin and debugging capabilities.

Managing your breaks:

Toggling the button indicated by the green arrow you can enable or disable all your breaks in one go.

The only way to manage large numbers of logs is to search nslog and edit the file. This will cause the file to have been touched wich will obviously need versioning. Fortunately if you open the break window indicated by the blue arrow above. A list of all your breaks and their locations can be found.

Each break can be enabled or disabled by pressing the break symbol to its right as indicated by the purple arrow above.

Sharing Breaks:

Most projects are version controlled with either SVN or GIT. In all of my projects we make sure to ignore the personal settings folder in the .xcodeproj file. Which incidentally is just a folder. You can right click “Show its Contents”. In there you will find a folder called “xcuserdata” this will contain the personal profile for each developer. It will contain  the developer specific xCode settings like layout. This folder is ignored and never committed or pushed.

However if you were to share a breakpoint.

Right click a break point and select share as seen above. It creates a new folder in the project file. The “xcshareddata” can then be used to share break points with other developers . Say you had a particularly nasty bug and set up some particularly elaborate breaks they would be easily passed on to another developer who could help you or continue on the work.