android-peoplesconnect: February 2014

Saturday 15 February 2014

PhoneGap HelloWorld Example in Android with Eclipse Step by Step

Hi all...Now am going to show you,How to create your Cross Plot-form (i.e Phone-gap) app with Android.

Phonegap : It is Framework. Phone Gap is an open source platform that allows you to create cross-platform mobile applications with HTML, JavaScript, and CSS. Build app once & run Any where ....

Now am going to show you step by step please follow the steps....

First we need to Download Phonegap From Official Website.You Will get a zip file ,Unzip it.You

will get like below image take Android and paste it in Folder

Create New Project: HelloWorldPhonegap :

Click on Next -->

Click on Finish-->

Creat a Newfolder in Assets and name it as www .

After Completion of this go to Phone gap Unzip Folder which is downloaded before from Official Website.

Go to android folder copy the (A) cordova-2.1.0.js & (B) cordova-2.1.0.jar and (C) XML Folder and Paste it accordingly which is shown in the fig.Below.

Then go to MainActivity and Extends the DriodGap in Place of Activity.

And replace setContentView(R.layout.activity_main) with

Super.loadUrl("file:///android_asset/www/index.html")

Creat a index.html file and Place it in assets/www folder

Go to Manifest File and Place all the permission which are showned below

<supports-screens

android:largeScreens="true"

android:normalScreens="true"

android:smallScreens="true"

android:xlargeScreens="true"

android:resizeable="true"

android:anyDensity="true"

<uses-permission android:name="android.permission.CAMERA" />

<uses-permission android:name="android.permission.VIBRATE" />

<uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />

<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />

<uses-permission android:name="android.permission.ACCESS_LOCATION_EXTRA_COMMANDS" />

<uses-permission android:name="android.permission.INTERNET" />

<uses-permission android:name="android.permission.RECEIVE_SMS" />

<uses-permission android:name="android.permission.RECORD_AUDIO" />

<uses-permission android:name="android.permission.RECORD_VIDEO"/>

<uses-permission android:name="android.permission.MODIFY_AUDIO_SETTINGS" />

<uses-permission android:name="android.permission.READ_CONTACTS" />

<uses-permission android:name="android.permission.WRITE_CONTACTS" />

<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />

<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />

<uses-permission android:name="android.permission.GET_ACCOUNTS" />

<uses-permission android:name="android.permission.BROADCAST_STICKY" />

<uses-feature android:name="android.hardware.camera" />

<uses-feature android:name="android.hardware.camera.autofocus" />

And then run the app :

Done with Phone gap Sample Hello World....

MainActivity.java :

import org.apache.cordova.DroidGap;

import android.os.Bundle;

public class MainActivity extends DroidGap {

@Override

public void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

super.loadUrl("file:///android_asset/www/index.html");

}

}

index.html :

<!DOCTYPE html>

<html>

<head>

PhoneGap Hello World

</head><br>

<a href="" >ABout</a><br>

<a href="" >Services</a><br>

<a href="" >Careers</a><br>

<a href="" >ContactUs</a><br>

</body><br>

@Copy rights apc 2014

</footer>

</html>

Screen Shots :

Source Code : Click here to Download Source Code

Happy Programming...

Cheers....!!!

Sunday 9 February 2014

Rounded Corner Image Example in Android

Hi all ....Now am going to share how to make an bitmap image rounded corner with the help of Android Canvas and Paint.

Step 1: activity_main.xml:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context=".MainActivity"
android:background="#369589" >

<ImageView
android:id="@+id/image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="40dp"
android:adjustViewBounds="true"
android:gravity="center"/>

</RelativeLayout>

Step 2: MainActivity.java:

package com.apc.roundecornerimage;

import android.app.Activity;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.graphics.Canvas;
import android.graphics.Paint;
import android.graphics.PorterDuff.Mode;
import android.graphics.PorterDuffXfermode;
import android.graphics.Rect;
import android.graphics.RectF;
import android.os.Bundle;
import android.widget.ImageView;

public class MainActivity extends Activity {

private int color;
private Paint paint;
private Rect rect;
private RectF rectF;
private Bitmap imageOut;
private Canvas canvas;
private float roundPx;

ImageView image;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);

image=(ImageView)findViewById(R.id.image);

Bitmap bmp=BitmapFactory.decodeResource(getResources(), R.drawable.aps);
image.setImageBitmap(getRoundedRectBitmap(bmp,12));
}

public Bitmap getRoundedRectBitmap(Bitmap bitmap, int pixels)
{
imageOut = Bitmap.createBitmap(bitmap.getWidth(), bitmap.getHeight(), Bitmap.Config.ARGB_8888);
canvas = new Canvas(imageOut);

color = 0xff424242;
paint = new Paint();
rect = new Rect(0, 0, bitmap.getWidth(), bitmap.getHeight());
rectF = new RectF(rect);
roundPx = pixels;

paint.setAntiAlias(true);
canvas.drawARGB(0, 0, 0, 0);
paint.setColor(color);
canvas.drawRoundRect(rectF, roundPx, roundPx, paint);

paint.setXfermode(new PorterDuffXfermode(Mode.SRC_IN));
canvas.drawBitmap(bitmap, rect, rect, paint);

/* paint.setXfermode(new PorterDuffXfermode(Mode.DST_IN));
canvas.drawBitmap(bitmap, rect, rect, paint);*/

return imageOut;
}

}

Screen Shots :

Note : Place an Image in Android -drawable folder

Source Code : Click here to Download Source Code

Happy Programming
Cheers.....!!!