In Privacy Defense, big businesses, computer criminals, and the government are trying to get to your personal data. You fend them off with the help of education, lawsuits, and the legislative system, represented by Teacher, Judge, and Lawyer towers! We had a blast working on this game – thanks to Seattle GiveCamp!

XML Animations

Here’s what’s included in the package:

• Fade In/Out
  fadein.xml, fadeout.xml
• Push Left In/Out
  push_left_in.xml, push_left_out.xml
• Push Right In/Out
  push_right_in.xml, push_right_out.xml
• Rotate
  rotation.xml

Download the Android XML animation package!

How To Use ‘Em…

To use an animation, place the XML file in your application’s /res/anim/ folder. Read up on how to call the animation via Java on the Android developer site.

Contribute!

If you have an Android animation that you think needs to be included in our list, leave a comment with a link to the source or contact us to have it added to the zip!

I’ll walk you through how to convert Android’s default toggle button (ew) into something custom and more eye pleasing. We’ll work with 9-patches, styles, themes, and XML drawables; no java needed!

Images [Draw 9-Patch]

Android has a very nifty way of allowing a developer to specify how images dynamically scale by converting an image into a “9-patch” drawable. (For more information about 9-patch’s, check out the Android documentation.)

You need to create two images, one for each state of your ToggleButton (“on” and “off”, or “yes” and “no”, etc) and create both images into 9-patch drawables. Call them btn_toggle_off.9.png and btn_toggle_on.9.png, respectively. Both images will be dropped into your /res/drawable-hdpi/ (mdpi or ldpi depending upon the density) folder.

Here’s a screenshot of one toggle image (the “NO” or “OFF” state) as a 9-patch drawable using Android’s draw9patch tool:

The right column of the draw9patch tool shows how the drawable will scale in the wild. As you can see, the transparent padding on the left side of the toggle image allows us to create a 9-patch drawable that only scales the transparency portion, leaving the rest of the button untouched. The scalable section will be reserved for the ToggleButton ON and OFF text.

The other toggle button 9-patch drawable will look almost identical to the one above but instead will have the toggle portion of the button in the ON or YES state.

XML Drawables

We need two XML drawables: one to set the background of our ToggleButton element and another to set the toggle images depending upon whether the button is toggled ON or OFF.

First, let’s handle setting the background; place the following into /res/drawable/btn_toggle_bg.xml:

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
	<item android:id="@+android:id/background" android:drawable="@android:color/transparent" />
	<item android:id="@+android:id/toggle" android:drawable="@drawable/btn_toggle" />
</layer-list>

Next, let’s tell Android when to use the ON and OFF toggle drawables; place the following into /res/drawable/btn_toggle.xml:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
	<item android:state_checked="false" android:drawable="@drawable/btn_toggle_off" />
	<item android:state_checked="true" android:drawable="@drawable/btn_toggle_on" />
</selector>

Styles & Themes

Inside your /res/values/themes.xml file, use the following to overwrite the default style of a ToggleButton:

First, create a custom Widget.Button.Toggle style:

<!-- Overwrite the ToggleButton style -->
<style name="Widget.Button.Toggle" parent="android:Widget">
	<item name="android:background">@drawable/btn_toggle_bg</item>
	<item name="android:textOn">ON</item>
	<item name="android:textOff">OFF</item>
	<item name="android:disabledAlpha">?android:attr/disabledAlpha</item>
</style>

Next, tell your Android theme to use your new style…

<style name="YourThemeName" parent="@android:Theme.Black">
	<!-- Tell Android to use a custom style when creating a ToggleButton -->
	<item name="android:buttonStyleToggle">@style/Widget.Button.Toggle</item>
	<!-- Perhaps more theme items here...? -->
</style>

Per Android standards, you need everything above to be placed within a resources node; I’m assuming that you already know the basics of creating Android themes but if not, brush up on your skills at the Android docs site!

All done!

Once you specify your application to use your custom theme within your the Android manifest (android:theme="@style/YourThemeName") you should see that all default uses of ToggleButton now sport your custom style.

1. Go out to dev.twitter.com and register an app.  Make sure you register as a browser app and set the callback URL to something you own – we won’t actually be using this callback URL, but something needs to be provided.  Twitter will provide you an OAuth Consumer Key and Secret – we’ll make use of these below.  Go ahead and set the access type to Read, Write & Direct Messages (unless you’re aware you’ll be doing less.)
2. Visit twitter4j.org and obtain the latest stable version of Twitter4j (you want the slimmed version for Android.)
3. Go ahead and add the twitter4j-core jar to your project as a library.  If you’re planning to do image uploads (you should, image uploads are cool), you’ll want to include the twitter4j-media jar as well.
4. Add android.permission.INTERNET to your app’s manifest – also open up your strings.xml and add the following:

   <string name="twitter_callback">twitter-callback:///</string>

5. What we’ve got at this point are some credentials for our Twitter app. What we need is to obtain permission from the user for our app to do their bidding.  This is where things get a little tricksy, but it boils down to the following code in the activity where you’re setting up a user’s Twitter access:

   // Twitter mTwitter and RequestToken mRequestToken
   // are private members of this activity
   mTwitter = new TwitterFactory().getInstance();
   mRequestToken = null;
   mTwitter.setOAuthConsumer( OAUTH_CONSUMER_KEY, OAUTH_CONSUMER_SECRET );
   String callbackURL = getResources().getString(R.string.twitter_callback);
   try
   {
        mRequestToken = mTwitter.getOAuthRequestToken(callbackURL);
   }
   catch (TwitterException e)
   {
        e.printStackTrace();
   }
   Intent i = new Intent(mContext, TwitterWebviewActivity.class);
   i.putExtra("URL", mRequestToken.getAuthenticationURL());
   startActivityForResult(i, TWITTER_AUTH);
   

   We’re creating a Twitter object and authenticating our app. We’re then asking Twitter to generate a request for User access and providing a callback URL. We store the request object in the activity, so that when we obtain a response we know they’re a proper pair. The request also has a URL, which we direct the user to such that they can see and respond to our access request.

6. To present the Twitter request to the user, we’re using a webview. The activity’s code is fairly short. The layout looks like the following:

   <?xml version="1.0" encoding="utf-8"?>
   <LinearLayout
   	xmlns:android="http://schemas.android.com/apk/res/android"
   	android:layout_width="fill_parent"
   	android:layout_height="fill_parent">
   	<WebView
   		xmlns:android="http://schemas.android.com/apk/res/android"
   		android:layout_width="fill_parent"
   		android:layout_height="fill_parent"
   		android:id="@+id/webview"/>
   </LinearLayout>
   

   The code for the TwitterWebActivity class is below. It loads the URL we passed in through the intent into the webview and listens in for the callback. Once it sees an attempt to redirect to the callback, it grabs out the parameter we need (oauth_verifier) and returns it to the activity it was called from.

   private Intent mIntent;
   public void onCreate(Bundle savedInstanceState)
   {
   	super.onCreate(savedInstanceState);
   	setContentView(R.layout.twitter_webview);
   	mIntent = getIntent();
   	String url = (String)mIntent.getExtras().get("URL");
   	WebView webView = (WebView)findViewById(R.id.webview);
   	webView.setWebViewClient( new WebViewClient()
   	{
   		@Override
   		public boolean shouldOverrideUrlLoading(WebView view, String url)
   		{
   			if( url.contains( getResources().getString( R.string.twitter_callback ) ) )
   			{
   				Uri uri = Uri.parse( url );
   				String oauthVerifier = uri.getQueryParameter( "oauth_verifier" );
   				mIntent.putExtra( "oauth_verifier", oauthVerifier );
   				setResult( RESULT_OK, mIntent );
   				finish();
   				return true;
   			}
   			return false;
   		}
   	});
   	webView.loadUrl(url);
   }
   

7. Back to our setup activity! In onActivityResult we’re going to look for a requestCode of TWITTER_AUTH and store a few things into the app’s SharedPreferences (in the code below, the SharedPrefs are already open and named settings):

   if (resultCode == Activity.RESULT_OK)
   {
   	String oauthVerifier = (String) data.getExtras().get("oauth_verifier");
   	AccessToken at = null;
   	try
   	{
   		// Pair up our request with the response
   		at = mTwitter.getOAuthAccessToken(mRequestToken, oauthVerifier);
   		settings.edit()
   			.putString( "twitter_access_token", at.getToken() )
   			.putString( "twitter_access_token_secret", at.getTokenSecret() )
   			.commit();
   	}
   	catch (TwitterException e)
   	{
   		e.printStackTrace();
   	}
   }
   

8. If everything above is in place and working as expected, the following code should update your status:

   String accessToken = settings.getString( "access_token", null );
   String accessTokenSecret = settings.getString( "access_token_secret", null );
   Configuration conf = new ConfigurationBuilder()
   	.setOAuthConsumerKey( OAUTH_CONSUMER_KEY )
   	.setOAuthConsumerSecret( OAUTH_CONSUMER_SECRET )
   	.setOAuthAccessToken(accessToken)
   	.setOAuthAccessTokenSecret(accessTokenSecret)
   	.build();
   Twitter t = new TwitterFactory(conf).getInstance();
   t.updateStatus( "@MokaSocial You guys rock!" );
   

9. Sharing an image on TwitPic is simple. Go out to their site and obtain an API key. Change the code where we’re creating the Configuration to the following:

   Configuration conf = new ConfigurationBuilder()
   	.setMediaProviderAPIKey( TWITPIC_API_KEY )
   	.setOAuthConsumerKey( OAUTH_CONSUMER_KEY )
   	.setOAuthConsumerSecret( OAUTH_CONSUMER_SECRET )
   	.setOAuthAccessToken(accessToken)
   	.setOAuthAccessTokenSecret(accessTokenSecret)
   	.build();
   

   Then add the following bit to upload the image and get the URL (in our case, we’ve got the URI of the file we want to upload)

   ImageUpload upload = new ImageUploadFactory(conf).getInstance(MediaProvider.TWITPIC);
   String url = upload.upload( new File(imageUri.getPath()) );
   

Well, that’s all there is to it. A big thanks to the Twitter4j team for the slick library and Danny Gagne for the awesome presentation!

Emory’s loves to make games. And he’s really handy to have around. It took him about two hours in Eclipse to start writing Java. He also plays a mean Artificer. He’s fairly OP at Planning Poker.

Emory drinks drip coffee, and prefers not to use invert mouse for FPS games. His current google-able titles include Drake Savage and Space Johnson, which may or not be ported to mobile versions. His favorite iPhone game is Jet Car Stunts and his favorite PC game is Ultima VII. Top tier!

Anyway, there you have him: Emory. He’s a blast to work with.

Free to Play doesn’t represent some rapidly plumping metastasized future. It represents the flowing and present ultranow.

Head on over to www.AOK.tv and check it out if you haven’t already.