2D Graphic Transformation

In the past posts, I already write articles about 2D graphic drawing API, and also an article about the black magic of the Bitmap operations. In this post, I try to write something about graphic transformation.
As far as I know there are only four transformation APIs, including translate, scale, rotate and matrix. Also, all the platforms have same transformation APIs, if it is a GUI framework. Those four APIs just like a formula, if you understand them in Android, then you have the ability to do programming in IOS and Html5. The translate, scale and rotate are much more usually used and understandable, the difficult is the matrix, it is the general and mathematic representation of all the transformations in a more powerful way.
What’s more, in the past post, I just used the graphic drawing API directly in coding, actually, it is not enough for making a performance customized UI graphic. The more common case is alway drawing by both the drawing API and graphic transformation, combine those two skills, you can create much more excellent graphic showing.
To combine the graphic drawing and transformation, you just need to follow those steps.

  • save the drawing context;
  • use the graphic transformation;
  • drawing the shape in unit size;
  • pop the drawing context;

I provided an example which draws stars in a night sky. You can get the code from following links.
  1. https://github.com/suzp1984/ExApiDemo/blob/master/app/src/main/java/suzp1984/github/io/exapidemo/graphics/StarsView.java
  2. https://github.com/suzp1984/IOS-ApiDemo
  3. https://github.com/suzp1984/web-dev-demos/blob/master/canvas/js/stars.js
The image at the top is the Android version screen shot. And following is the IOS version:



 One thing needs to be careful is that the hardware acceleration should be shut down in android if you want include graphic transformation. One clearly way to do that is add following code int the View construction method.

setLayerType(View.LAYER_TYPE_SOFTWARE, null);





Comments

Post a Comment

Popular posts from this blog

Bluedroid stack in android

Image
Bluedroid stack in android Table of Contents Bluetooth stack in android Bluedroid .VS. Bluez Porting guide of Bluedroid stack 1 Bluetooth stack in android From Android 4.2, google use Bluedroid stack as its default Bluetooth host stack, before android 4.2, its default Bluetooth host stack was Bluez, which is also the Linux distribution's default stack. So why google changed its Bluetooth stack? The reason is maybe that Bluez stack was designed for the desktop environment, so in order to port Bluez into android, android must solve some dependency issues, like porting Dbus, Linux desktop's default IPC, into android. So there are at least five processes to power Bluetooth before android 4.2, they are systems, Bluetooth APP, Bluez, hciattach, and Dbus. The damn thing is that there are bugs between them, so Bluetooth stack is the weakest part in the android system before android 4.2, yeah, it is the usual reason that android system corrupted. So, what's t
Read more

How to setup a NAT server?

Image
How to setup an NAT server? Table of Contents What is NAT? How to setup NAT host? a shell script from vbird's book 1 What is NAT? NAT stands for Network Address Transition, which is the basic function of gateway host. I try to hack Bluetooth tethering module in android this week, it include the Bluetooth Pan profile and the NAT setup process, which means in order to implement the Bluetooth tethering, first, two devices must be connected by Bluetooth Pan profile, and then the server part device acted as gateway host to supply the network forward service. In other words, after Bluetooth Pan profile connected, the server must to setup its NAT rules to forward the IP packages. So how to setup NAT rules? 2 How to setup NAT host? My memory is still fresh that at the start of my Linux journey, I setup my Linux desktop as an NAT host to provide Internet services for my lab's classmates. During the days as a programmer, I once did a job to hacking android&
Read more

Network programming in elisp

  Network API in elisp Table of Contents 1 Introduction 2 A example 3 Http server implemented by elisp 1 Introduction Emacs is not just an editor, Yes, that's true. Emacs lisp can do network connection programming by its network API. But there is something difference with other kinds of programming language. First, elisp do not support multi-thread, pretty cool, huh!! Yeh, Multi-threads programming is a horrible venture for you, right! Second, There is no socket similarly conception in elisp, and elisp provide network programming ability as processes. Elisp can open a network connection by function – open-network-stream .  It can make network connection server listen a special port by function - make-network-process . Both of those function return a process object. Then you can communicate with the process by process's API. 2 A example I write a snippet code to figure out How to use it. ( require ' cl ) ( defvar my-network-client-b
Read more