Programmer's Notebook

In the last  post , I introduced the 2D Graphic Drawing in Html5 and android canvas, it is the basic skills if you want running into GUI programming fields, they have the similar drawing API, once you got familiar and fluent in one platform, you will be a master of another GUI platforms in a short time. And why we must learn this 2D graphic drawing API? In Html5 canvas, game developing is the most common scenario to use canvas drawing API, and in Android and IOS platform, if you want to make a custom view or widget, then here we are the 2D drawing show, the difference is that Android is operating those drawing API on a canvas, while the IOS is drawing in a Graphic Context. Again, in the last  example , I learned an example how to drawing custom clock widget in Html5 Canvas, then I ported this widget into Android platform, just the same widget but running in different native platforms. I just enjoy this, and I am looking forward the IOS version of clock widget is my next...

I already spent more than three months to learning programming in IOS, my first learning resources are the on-line courses in  Udemy , most of them are so silly that I just learned how to use the visual programming toolkit, Xcode. After leaving the help the storyboard, I still can not start a project. In the really IOS project, the storyboard and Xib visual interface not permitted at a real project. All the layout and views are organized programming in code. Then, I purchased the famous IOS book, Programming IOS 9: Dive deep into views, view controllers, and Frameworks. It tokens me $30 dollars in Amazon’s market, but I tell you It worth every coin. this is an excellent book. I can do IOS programming now, although still at the junior stage. During my learning progress, I found out the Apple’s on-line office document so sucks. I can not figure out where to get started. As an Android developer, I learned everything I need from its office website. What I just did is to downloa...

CSS layout There are three kinds of layouts: Normal flow Layout, Float Layout, Absolute Position Layout. To understand those three kinds of layouts, the key point is to understand two concepts: normal document flow and box model. Normal document flow is the default way of arranging the HTML element from top to bottom or left to right in order without overflow and overlap by the value of the property, display. And the Box model means every HTML element is wrapped in a box, controlled by the properties: margin, padding, border, background. Normal flow layout is the whole layout in a single document flow, according to the normal document flow, the element’s layout behave in a normal way, top to bottom and left to right. Float layout is to use property float by its value left, right or none. The keynote is the float property only affect nearby elements’ layout, in order to erase that effect, there are two ways to eliminate that floating effect. clear : both ; // another w...

This article is intended to collect and summarize the topic of Animations in Android. In order to reach an excellent UX design, it is necessary to employ Android’s animation API to improve the details of the UI. Before the details of the Android Animation, I want to recollect the history of Android’s evolvement in Animation API. Before the Android 3.0, it is a wild time, the uncivilized Animation packages dominate the wild field, it is the android.view.animation package. Then the property animator appears at Android 3.0 release, the property Animator is much advanced than Animation, it can animate not only the visible view properties but also any values by ValueAnimator, it is the android.animation.Animator package, much more details can be read from the following sections. Besides the universal Animator, another ViewGroup animation API appeared at Android 3.0, it is the LayoutTransition which was used to animate the layout change event. Then, at Android 3.2, we can animate F...

Recently, I attended an online MOOC course about  html5 canvas drawing . I was surprised how simple of its  drawing API , which has the power to create awesome UI effect. I summarize the 2D drawing API as two fields: regular shape drawing API and transformation API. As for 2D shape drawing in html5 Canvas there are following limited properties and functions: beginPath, endPath, fillStyle, strokeStyle, stroke, fill, fillRect, moveTo, lineTo, arc, font, fillText, strokeText, createLinearGradient, createRadialGradient, addColorStop, drawImage, bezierCurveTo, quadraticCurveTo. To sum up, the above 2D drawing API can do following jobs. moving a point; drawing a line; drawing an arc or circle; drawing a bezier curve; make a path; stroke along the path; fill the closed path with image, colors, gradient effect or patterns; Then, we count the transformation APIs: save, restore, translate, rotate, scale, transform. No need any more illustrations, is it? The transfo...

The multi-threading synchronization questions always concentrate on a few keywords: wait, notify, notifyAll, synchronized, volatile. The following question is the hardest, I ever met. The thread t1 should print integer number from 1–52, the thread t2 should print character from A-Z, the question is how to let the final result to be 12A34B56C… by implement Printer class. (The Printer class is already finished by the way) public class Main { public static void main ( String [ ] args ) { System . out . println ( "Hello World!" ) ; Printer p = new Printer ( ) ; Thread t1 = new NumberPrinter ( p ) ; Thread t2 = new LetterPrinter ( p ) ; t1 . start ( ) ; t2 . start ( ) ; } } public class LetterPrinter extends Thread { private Printer p ; public LetterPrinter ( Printer p ) { this . p = p ; } public void run ( ) { for ( char c = 'A' ; c < = ...

About two years ago, I published my debugging toolkit in Android for Bluetooth LE development, after that, I left that field, wearable-BLE equipment development just quit that job and join a new one. And now at this moment, I quit the job again, to summarize my collections during the past two years. There are two keynotes: my skills sharper a lot at Android App development, second,  Light-BLE  was still my most popular project. During the past one year, there are at least four people contact me for debugs and more stable demos. Finally, I am here to announce the release of the beta-2 version of Light-BLE, it is actually be rewritten. This is the first version release note two years ago. http://zpcat.blogspot.com/2014/03/lightble-practical-app-tool-to-develop.html So, what was changed compared with the two years ago? 1. New Architecture I rewrite this project to compatible with the legendary MVP architecture, which decoupled the View and logical data layer, make...