android:rotationX - Rotate a TextView/EditText on the x axis

How to Rotate a TextView/EditText on the x axis

added in API Level 11

rotation of the TextView/EditText around the x axis, in degrees. Rotates both the text and the TextView object.

To imagine how the rotationX works, take a spiral notebook and turn it on its side with the spiral on the bottom. Hold it directly in front of you, vertically, with the spiral on bottom. You will see it looks like an exact rectangle. This is how a rotationX = 0 looks like.

Now slowly rotate the notebook backwards, while keeping the spiral edge in the same location. Move it about 45 degrees backwards. The paper will look like a trapezoid from your perspective. The back edge will look shorter and the sides will move inward. (Like looking at railroad tracks, the tracks look like they are moving inwards towards each other.) This looks like a trapezoid.

The closer you move it to 89 degrees, the smaller in height the trapezoid will get and the closer the sides will appear.

At 90 degrees you would not be able to see what is on the paper, looking directly at it. It would be completely sideways.

Now, past 90 degrees, imagine that notebooks spiral is a clear piece of plastic with text on it. When the notebook is turned past 90 degrees, the text will turn upside, and appear backwards to you. However, now it looks like a inverted trapezoid, up until 180 degrees.

At 180 degrees, it will be a square and the text upside down and backwards.

181 degrees to 269 degrees, the text will appear upside down and backwards, in a trapezoid form.

At 270 degrees,  is like 90 degrees, it will be completely horizontal and you would not be able to see it.

271 to 359 degrees, text is right side up again, with a trapezoid. The lower the number, the small in height the trapezoid will appear.
 
If set to (175-185) degrees, will make the text upsize down, and backwards. To read the text you would need a mirror.

1. Add a TextView in your main.xml file.

2. Ensure to change the minSDKVersion to 11, or greater.

3. In the main.xml file, add the code below. This will rotate the TextView 45 degrees.

  <TextView
        ...
       android:rotationX = "45"
  />

4. Compile and run!

Related Articles:
Resources:
http://developer.android.com/reference/android/view/View.html#attr_android:rotationX
http://developer.android.com/reference/android/R.attr.html#rotationX
Labels: , ,