AQuery Button Listener

In this post we will be creating simple Android application using AQuery library to demonstrate how easy it is to write Android code with AQuery library.

Are you new to AQuery library? then take a look at Introduction to AQuery – Android Query which will be helpful for you to understand lot about it.

I picked the Button Listener – Make the cat start Meowing application (which plays ‘Meow’ sound when user clicks/taps on the screen) to illustrate how the application can also be created using AQuery library with minimal number of lines.

Video Demo


You must first understand how to handle button click event using AQuery library before we start creating application.

Here is the code snippet written using the library which sets button’s text as ‘Hello World’ when it is clicked:

private AQuery aq;
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.test);    
        aq = new AQuery(this);                 
        aq.id(R.id.button).clicked(this, "buttonClicked");
}

public void buttonClicked(View button){
        //update the text
        aq.id(R.id.text).text("Hello World");
}

Steps to handle button click event in AQuery

  1. Instantiate AQuery class inside onCreate( ) method. [Make sure you placed AQuery library under lib folder and imported AQery package in your activity class]
    private AQuery aq;
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.test);
        aq = new AQuery(this);
  2. Find the button using id( ) method by passing ID of the button.
    aq.id(R.id.button);
  3. Invoke clicked() method which takes two parameters. Parameter 1 – Handler object, Parameter 2 – Callback method.
            
    aq.id(R.id.button).clicked(this, "buttonClicked");
  4. Define callback method.
    public void buttonClicked(View button){
            //update the text using text method
            aq.id(R.id.text).text("Hello World");
    }

Quick Links

Project Structure

  • Create new android project [File >> New >> Android Application Project] with project name AQueryIntroduction
  • Choose Build SDK and minimum required SDK [I chose version 4.1 and 2.2]
  • Enter package name as ‘com.prgguru.example’
  • Click next and select BlankActivity
  • Click next and provide Activity name and Layout name as ‘AQueryIntroduction’ and ‘main’ respectively.

Code Listings

Open main.xml, now you can view the layout as either XML or in graphical view and just replace the XML with below one:

<?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"
    android:orientation="vertical" >

    <Button
        android:id="@+id/button1"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@drawable/kitty" />

</LinearLayout>

Place kitty image under drawable folder which is set as background of button. [Right click on the link and save the image]

Also place “Meow” audio file under the /res/raw/ folder , if raw folder doesn’t exist create one and place the audio file. Right click and save the Meow audio file.

AQueryIntroduction.java
Open AQueryIntroduction.java and replace it with below code. Each line is added with comment and I hope it is self understandable. If you still have any doubt/question, discuss it right away in the comment section.

package com.prgguru.example;

import android.app.Activity;
import android.media.MediaPlayer;
import android.os.Bundle;
import android.view.View;
import android.widget.Toast;

import com.androidquery.AQuery;

public class AQueryIntroduction extends Activity {
	//AQuery object
	private AQuery aq;
	//Mediaplayer object
	private MediaPlayer mPlayer;

	@Override
	public void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.main);
		//Instantiate AQuery object
		aq = new AQuery(this);
		//Instantiate Mediaplayer object with media resource
		mPlayer = MediaPlayer.create(AQueryIntroduction.this, R.raw.meow);
		//Invoke clicked method with current handler object and buttonClicked as parameters
		aq.id(R.id.button1).clicked(this, "buttonClicked");
	}
	
	//AQuery callback method for button click handler
	public void buttonClicked(View b) {
		//Play Meow sound		
		mPlayer.start();
		//Display toast message with text Meow 🙂
		Toast.makeText(aq.getContext(), "Meow :)", Toast.LENGTH_SHORT).show();
	}
	
	//When activity is closed
	protected void onDestroy() {
		super.onDestroy();
		// TODO Auto-generated method stub
		if (mPlayer != null) {
			mPlayer.release();
			mPlayer = null;
		}
	}
}

Include AQuery.jar
Download AQuery jar from here and place it under lib folder.

[pglinkadssmall1]

Demo

That’s all. It’s time to test our code.

Run the application using emulator or device by right clicking on the project >> Run as >> Android applicaiton >> Choose emulator or device.

Tap the cat, it will sound “Meow” . 🙂

Download Source Code

Entire project is zipped and is available for download. Unzip the downloaded project and to import the project into eclipse, launch eclipse >> File >> Import.. >> Choose downloaded project(How to import android project in eclipse). If you just want to run the application in your mobile and see the output but don’t want to hit your head with source code, download application(apk) file and install it in your mobile device.

Download Source Code Download Application(apk)

*apk in Android  is the installation file simliar to exe in windows.

[pglinkadssmall]

If you feel this article is helpful and interesting please spread a word about it to your friends and colleagues by sharing the article in Facebook or Twitter.

You are always welcome to provide your comments and feedback from comment box.

Reference

AQuery documentation
[pgwriteforus]
[pgfeedback]

Related Articles

Author: Udhay

Share This Post On
468 ad
Join now to get more access to our Android Tutorials

Join now to get more access to our Android Tutorials

Once you Join, you will receive Mail containing latest Android Tutorials once a month !!

I promise I wont spam you !!

You have Successfully Subscribed!

Pin It on Pinterest

Shares