Wednesday, June 13, 2012

Event Handling

What are events? Why do we need to handle them? Events occur when an user interact with the UI components of our app like buttons. When these events occurs, a function/method is called. As a programmer, it is our responsibility to dump a block of code inside that method/function and make the UI respond to the user, like closing the application when the user presses the "quit" button. Seems like a good idea. Lets do just that.


Create a project. First, we need to include a button in our layout and id it. I do the same in the following code:




In our source code ( java file ), we need to add a variable for this button and add a listener to it, which is done in the following code:



This can also be done another way. Instead of adding OnClickListener on the java file, we can handle events by addding the tag android:onClick="myOnClickMethod". "myOnClickMethod" is a method defined inside our activity class(java file). Any name can be given to the method but it must have an argument of type "View". Take a look at my button in layout and the method myOnClickMethod() in my activity class:

A code snippet for button:







The Activity:


These methods are enough to implement event listeners for 2 or 3 buttons. But what if we need to handle the events of 10 buttons. For this situation, there is a special way of implementing listeners. Lets say we have 4 buttons and a text view as in the layout below. We need to print the event occurred like printing "Button 1 is pressed" when button1 is pressed. What we do is that, we make our activity to implement a class "View.OnClickListener" and then, we implement the common method onClick(), in which we differentiate events occurred by using id of the buttons. This is done in the code given below.


main.xml




BaseActivity.java

Some snaps:


1. The quit button:






2. Button2 event:






3. Button4 event:








OK... thats it for now guys!!! See ya later with more.....

Monday, June 11, 2012

Custom Buttons



In this post, we'll make custom buttons for our app. Its actually pretty simple. We just need to make use of few xml tags to handle images. What happens when we press a button ( a normal button ) ? There is a change in its.... Lets say, it responds to our touch. What actually happens is an animation. When we press a button, the background image of the button changes in such a way that it seems the button responds to our touch. So there are 2 images; one when not pressed and one when pressed. Which image for what and how to set them? We'll be doing it now. At first, lets just make a button with custom background and it doesn't change its background when pressed. We need an image for that. Download the buttons i used, from the link below:



Copy all the images to the drawable folder (-hdpi ). Lets use the quit button for now. Create a new project. Open up main.xml and create a button ( How to create a button?). Add the tag android:background="@drawable/quit" and position the button wherever you want to, in the graphical layout. Thats it, a simple custom button is ready. Run the project and look at the button, click on the button and notice there is no change in it. Here is a code snippet of main.xml:







OK.. Now, lets jump to step 2. Create an android xml file named "quit_button.xml" (any name). In this file, we specify which image to display when button is pressed or not. Check out mine below:




Go to the layout file ( main.xml ); change the background to "@drawable/quit_button". Check it out below:




Run the project and notice the change when the quit button is pressed. Now you can do the same using btn_1.png and btn_2.png. Here are code snippets to displays btn_1 and btn_2....











Check out the snaps:
1. When button is not pressed...








2. When button is pressed...






3. A sample layout from an old project...




Thats it for now guys! In the next post, we'll learn about layouts in android and how to customize them. See ya!!!

Join Us...


Wanna develop cool apps for Android smart-phones and tablets? Cant find a place where u can learn the basics step by step? This is the right place for you to start. All you have to know is the basics of Java. Join us on Facebook and participate in exciting events and learn stuff....




Here... Check out our Group description....






Join us to make cool creative custom apps....

Saturday, June 9, 2012

Building an Image Editor 1

This post is made to help/support the members of the ADI community who are attending the event Image Editor for Android. The event description is as follows:






Yeah! We are gonna do it step by step. As Step1, we'll try to create an Image Viewer app. The app will call the default inbuilt camera application which lets us capture a pic and then shows the pic in the base/home screen of our app. thats it. simple right?... Lets make an outline of our app.





So, how exactly do we access the default camera application? We'll use an intent to trigger it using the parameter "android.provider.MediaStore.ACTION_IMAGE_CAPTURE". An activity is started with this intent. When this activity ends, the image associated with the intent is obtained. This image is set to the ImageView already created in our layout and displayed in our base screen. We'll start the activity by using StartActivityForResult() method, so that we can fetch the image from the resulting intent. Thats enough about it, lets jump to the code. The layout file consists of just an ImageView component and is embedded below:





Now lets look at our Activity:







Check out some of the snaps below:


1. The problem with AVD:




* Note: Click on the picture to view in high resolution.


2. Camera doesn't seem to work:






* Note: Click on the picture to view in high resolution.




3. When uploaded and started in my phone:


















------------> Download Project here <---------------




There are a number of problems in this app like, the picture captured is not saved anywhere, there are no buttons for capturing, no quit button and the image displayed is just a thumbnail of the image captured (low resolution). In the next post, we'll try to capture an image, save it anywhere we want, access it using the file path and we do all this using buttons. Thats it for now. See ya!!!!.....

Friday, June 8, 2012

Editing Base Layout



An android project is basically divided into 2 categories. They are * Source code and * Resources. Lets keep it that simple for now. The resources are classified into text(strings), images, sound, layout etc.. Images are placed under the folder "drawable". Layout is placed under "layout" folder. Colors and Strings are placed under the folder "values". These resources are defined using XML files. The layout of the base screen (the screen that appears when an app is opened) is defined in the file "main.xml" under layout folder. Check out the main.xml file of my project.







Check out the colors.xml file mentioned in the main.xml file...



strings.xml is given below....





Check out some of the snaps below:

1. Our App with red background (#ffff0000) in the AVD:







2. Our App with background as "pic.jpg":






3. A snapshot of main.xml in Graphic Layout mode:




------------> Download Project here <---------------


Thats all for now guys! This post explains how to create the components in a layout and how to customize it. In the next post, we'll try to make these components (buttons, text fields, etc.) to work by adding event listeners to them. Stay tuned for more....



Setting up the Environment

hi again guys!!!

In this post, I'll provide step by step instructions on how to setup the environment for developing Android apps. The 2 softwares you need to download are *Eclipse IDE and *Android SDK. Lets deal with one at a time. Firstly lets try to understand something about Eclipse. What is Eclipse? Eclipse is an IDE which means an Integrated Development Environment where we have various supporting perspectives and components for making our task(developing android apps) easier. Eclipse consists of different plugins and perspectives for different languages like java, JavaScript, C, C++ etc.. So, this is where(Eclipse) we write the code for our app and debug it. I guess thats enough about eclipse. Lets go to Android SDK(Software Development Kit). This kit consists of various api's (Application Programming Interfaces) for various versions of Android OS like gingerbread, Honeycomb, Ice cream Sandwich etc..,  and it also provides an AVD manager. AVD--> Android Virtual Device. This is an emulator that runs our program. Having said that lets move on to installation.



Android SDK:


Download android SDK from here. Install it and open the SDK manager available in the installed directory. This is a time consuming process. It shows the available packages and updates. Install only what is required. Now open the AVD manager available in the same folder. Create a new AVD (Android virtual device) with your custom settings. We are done with it now.


Eclipse IDE:


   Eclipse has a number of stable versions. Go to the website and take a look around. Many developers strongly recommend Eclipse Classic 3.7.2 (Indigo version) , which can be downloaded from here. Choose 32bit or 64bit version based on your OS. It will be downloaded as a zip file. Extract it somewhere, anywhere. Open Eclipse. You are not yet finished with eclipse. You need to install the ADT plugin for eclipse for making android apps.



ADT plugin for Eclipse:


The ADT plugin should be installed as follows:


* Note: Click on the picture to view in high resolution.






Step1:   Help --> Install New Software




Step2: Go to the textfield next to "Works with" label




Step3: Enter https://dl-ssl.google.com/android/eclipse/




Step4: Check Developer tools, click next, and finish the installation.




Step5: After installation is over, restart Eclipse. Now go to Window--> preferences--> Android and select  
            the folder where android SDK is installed and click apply and close the window.




Step6: Go to file--> new --> Android Project. Give a Project name and click next.







Step7: Select the target Android OS version and click next.







Step8: Give a package name as i did in this picture and click finish.





Step9:
Now a sample android project is ready. Lets run it. Right click our sample project in project 

            explorer and select run as --> android application.





Step10: The AVD takes some time to load, so wait and watch. When it finishes loading, our app will be 
              opened. You can see that in the picture.




 
* Note: Click on the picture to view in high resolution. 

Thats it for now guys. In the next post we'll look at the structure of our project and make some modifications to the sample project and see the result. Stay tuned , more is coming......

Started Blogging...




Hi! guys....


this blog is for the convenience of members of the Facebook group "ADI"....


tutorials can be posted here for the benefit of new members...


Lets get busy guys!!!!