Since the controlling of the ship in JustRoids might seem a bit "cryptic" to anyone not following this tutorial, I think I must explain the concepts of right and left "sweeps", clockwise/counter-clockwise rotation and "thrusts" as thoroughly as possible to avoid disastrous ratings on the Android Market.
Maybe I over-did this part a bit, but I decided to create four different images to illustrate the three sweep-actions and the tap plus four more images to show how the ship responds on the inputs.
I used "Sketch & Paint!" (http://www.onemotion.com/flash/sketch-paint/) for the "free-hand" arrows and the tap-symbol and Inkscape for the images illustrating the ship's reactions:
sweep_right.png:
sweep_left.png:
sweep_up.png:
tap.png:
rotate_clockwise.png:
rotate_counter_clockwise.png:
thrust_right.png:
and fire.png:
All eight images goes into the "res/drawable" folder, so we can refer to them in our updated howto.xml:
<?xml version="1.0" encoding="utf-8"?> <ScrollView xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/scroll" android:layout_width="fill_parent" android:layout_height="wrap_content" > <LinearLayout android:layout_width="fill_parent" android:layout_height="wrap_content" android:orientation="vertical" > <TextView android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_marginBottom="20dip" android:gravity="center_horizontal" android:text="-= How-To =-" android:textSize="40dip" /> <TextView android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_marginBottom="3dip" android:layout_marginLeft="30dip" android:text="The Plot" android:textSize="25dip" /> <TextView android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_marginLeft="30dip" android:layout_marginRight="30dip" android:text=" In this retro style space-shoot'em-up game you control a V-winged long-range scouting ship on a mission a long, long way from home.\n \n An interplanetary highway has been planned right through the sector your are in, but unfortunately an asteroid belt has been detected right in the wrong place - jeopardizing the whole project...\n \n Luckily your ship is equipped with tactical nukes, so can save the situation by taking the asteroids out, one by one.\n \n You have an endless supply of nuclear missiles but in order to get room for that supply, the shield generators had to be removed. Hence your ship is completely unprotected and will be destroyed if it comes too close to an asteroid.\n \n " /> <TextView android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_marginBottom="3dip" android:layout_marginLeft="30dip" android:text="Controls" android:textSize="25dip" /> <TextView android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_marginLeft="30dip" android:layout_marginRight="30dip" android:text=" As your ship is a V-wing Mk I (without the Momentum Eliminator that made Mk II so popular) it's a bit tricky to control.\n \n There are no brakes (or retro rockets) so if you accelerate, the ship will continue in the same direction until you turn it around 180 degrees and accelerate in the opposite direction.\n \n There are four different actions you can perform in order to control your:\n \n " /> <TextView android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_marginBottom="3dip" android:layout_marginLeft="30dip" android:text="Right Sweep" android:textSize="18dip" /> <ImageView android:layout_width="200dip" android:layout_height="wrap_content" android:layout_gravity="center_horizontal" android:adjustViewBounds="true" android:contentDescription="Right Sweep" android:padding="3dip" android:src="@drawable/sweep_right" /> <TextView android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_marginLeft="30dip" android:layout_marginRight="30dip" android:text=" \n If you swipe your finger from the left to the right of your screen, the ship will rotate clockwise:\n " /> <ImageView android:layout_width="200dip" android:layout_height="wrap_content" android:layout_gravity="center_horizontal" android:adjustViewBounds="true" android:contentDescription="Rotate Clockwise" android:padding="3dip" android:src="@drawable/rotate_clockwise" /> <TextView android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_marginBottom="3dip" android:layout_marginLeft="30dip" android:layout_marginTop="20dip" android:text="Left Sweep" android:textSize="18dip" /> <ImageView android:layout_width="200dip" android:layout_height="wrap_content" android:layout_gravity="center_horizontal" android:adjustViewBounds="true" android:contentDescription="Left Sweep" android:padding="3dip" android:src="@drawable/sweep_left" /> <TextView android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_marginLeft="30dip" android:layout_marginRight="30dip" android:text=" \n If you swipe your finger from the right to the left of your screen, the ship will rotate counter-clockwise:\n " /> <ImageView android:layout_width="200dip" android:layout_height="wrap_content" android:layout_gravity="center_horizontal" android:adjustViewBounds="true" android:contentDescription="Rotate Counter-Clockwise" android:padding="3dip" android:src="@drawable/rotate_counter_clockwise" /> <TextView android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_marginBottom="3dip" android:layout_marginLeft="30dip" android:layout_marginTop="20dip" android:text="Up Sweep" android:textSize="18dip" /> <ImageView android:layout_width="wrap_content" android:layout_height="100dip" android:layout_gravity="center_horizontal" android:adjustViewBounds="true" android:contentDescription="Up Sweep" android:padding="3dip" android:src="@drawable/sweep_up" /> <TextView android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_marginLeft="30dip" android:layout_marginRight="30dip" android:text=" \n If you swipe your finger upwards on your screen, the ship will accelerate in the direction it's nose is pointing for the moment:\n " /> <ImageView android:layout_width="200dip" android:layout_height="wrap_content" android:layout_gravity="center_horizontal" android:adjustViewBounds="true" android:contentDescription="Thrust" android:padding="3dip" android:src="@drawable/thrust_right" /> <TextView android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_marginBottom="3dip" android:layout_marginLeft="30dip" android:layout_marginTop="20dip" android:text="Tap" android:textSize="18dip" /> <ImageView android:layout_width="200dip" android:layout_height="wrap_content" android:layout_gravity="center_horizontal" android:adjustViewBounds="true" android:contentDescription="Tap" android:padding="3dip" android:src="@drawable/tap" /> <TextView android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_marginLeft="30dip" android:layout_marginRight="30dip" android:text=" \n If you tap anywhere on the screen, the ship will fire a missile:\n " /> <ImageView android:layout_width="wrap_content" android:layout_height="100dip" android:layout_gravity="center_horizontal" android:adjustViewBounds="true" android:contentDescription="Fire" android:padding="3dip" android:src="@drawable/fire" /> <TextView android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_marginLeft="30dip" android:layout_marginRight="30dip" android:text=" \n That's all info you'll get for now.\n \n Good luck, Commander! " /> </LinearLayout> </ScrollView>
The xml above will give you a fair amount of warnings from Eclipse, as neither "android:text" nor "android:contentDescription" should be given direct text values, but rather references to text resources (as we did with the Main Menu earlier). But this will do for now.
Anyway, the result became as I wanted it to:
That should be the last piece in our game, and in next chapter we will put the ads back in.
Theme by Danetsoft and Danang Probo Sayekti inspired by Maksimer