This week, I worked on developing a way to represent embedded system for both the iOS and Android versions of the application. The aim was to create one user interface that is the same between both environments.
What is an embedded system?
Any system can be represented as a single block. By representing systems in this way, more complex systems can be modelled. These single blocks that represent a system can be thought of as a sub-system "embedded" in the system being modelled.
In order to allow users to see that a block represents a system, I designed a special icon for the block. This allows users to see at a glance which blocks are embedded systems.
How do you alter the parameters of the whole system?
In order to alter the parameters of the whole system, you must be able to change the values of the blocks within embedded systems. This means that there must be a way for the user to access the sub-model in order to edit it.
By tapping on the special embedded system block, the user interface (UI) zooms into the block showing the embedded model within and allows users to alter its parameters.
So how easy was it to make it the same for both Android and iOS?
It was pretty easy to make the embedded systems look the same for both Android and iOS when zoomed into the block. The block itself was a different matter. The icon for the block is drawn programmatically rather than loaded from an image and this required different maths to draw the curves between the two different environments. This is due to how the drawing functions work.
What about functionality?
The functionality was actually the easy bit. By subclassing the class for a regular block and thus creating a new embedded block class, embedded models can easily be created and passed around inside the model.
The iOS version of the code posed an interesting issue whereby the outer model did not refresh its calculated values properly. However, by adding a new method to clear the cached values and subsequently calling it after returning from editing an embedded model, the correct values are calculated and it all worked fine.
So what's next?
Next week will be finishing off the final touches to the UI and looking into ways the application can be used to aid education.