Android login form material design

Android login form material design
It is important for any app to have good and consistent user interface. Well formed UI design not only attract users it also shows professionality of your application.This tutorial depict Android login form material design.
The android login form contains two text fields, one is for inputting username and another one is to enter password and the button at the bottom.
Android login form material design
دانلود سورس کد آموزش Android login form material design
Android login form
Involves 4 main files shown below.
MainActivity.java
On SIGNIN button click checkLogin() function is triggered in your android login form. Which validate for correct username and password. The checkLogin() method is specified in onClick attribute of button in activity_main.xml file.
If username and password is valid then proceed to next step else set error message for respective fields.
package com.guru.login;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.view.Window;
import android.view.WindowManager;
import android.widget.EditText;
import java.util.regex.Matcher;
import java.util.regex.Pattern;
public class MainActivity extends AppCompatActivity {
private EditText emailEditText;
private EditText passEditText;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// Address the email and password field
emailEditText = (EditText) findViewById(R.id.username);
passEditText = (EditText) findViewById(R.id.password);
}
public void checkLogin(View arg0) {
final String email = emailEditText.getText().toString();
if (!isValidEmail(email)) {
//Set error message for email field
emailEditText.setError("Invalid Email");
}
final String pass = passEditText.getText().toString();
if (!isValidPassword(pass)) {
//Set error message for password field
passEditText.setError("Password cannot be empty");
}
if(isValidEmail(email) && isValidPassword(pass))
{
// Validation Completed
}
}
// validating email id
private boolean isValidEmail(String email) {
String EMAIL_PATTERN = "^[_A-Za-z0-9-\\+]+(\\.[_A-Za-z0-9-]+)*@"
+ "[A-Za-z0-9-]+(\\.[A-Za-z0-9]+)*(\\.[A-Za-z]{2,})$";
Pattern pattern = Pattern.compile(EMAIL_PATTERN);
Matcher matcher = pattern.matcher(email);
return matcher.matches();
}
// validating password
private boolean isValidPassword(String pass) {
if (pass != null && pass.length() >= 4) {
return true;
}
return false;
}
}
activity_main.xml
The xml file for MainActivity.java.
The all images required for android login form present in the path Your Android Project\app\src\main\res\mipmap-hdpi
Define xml file selector_xml_btn_yellow for background attribute of button. The content for xml file is specified below.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="@mipmap/back_login"
android:padding="40dp">
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="textEmailAddress"
android:ems="10"
android:id="@+id/username"
android:drawableLeft="@mipmap/account"
android:hint="Username"
android:layout_marginTop="170dp"
android:textColor="#FFF"
android:paddingLeft="0dp"
android:drawablePadding="5dp"
android:textColorHint="#999"/>
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="textPassword"
android:ems="10"
android:id="@+id/password"
android:drawableLeft="@mipmap/lock"
android:hint="Password"
android:layout_marginTop="10dp"
android:textColor="#FFF"
android:paddingLeft="0dp"
android:drawablePadding="5dp"
android:textColorHint="#999"/>
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="30dp"
android:text="SignIn"
android:id="@+id/button"
android:background="@drawable/selector_xml_btn_yellow"
android:layout_gravity="center_horizontal"
android:onClick="checkLogin"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="Forgot password?"
android:id="@+id/textView3"
android:layout_gravity="center_horizontal"
android:layout_marginTop="40dp"
android:textColor="#FFF"
/>
</LinearLayout>
selector_xml_btn_yellow.xml
Create this file in Your Android Project\app\src\main\res\drawable folder.
Specifies the background color, corner radius, color of text with respect to button state.
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true" >
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<corners android:radius="5dp" />
<solid android:color="#D5AA00" />
</shape>
</item>
<item >
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<corners android:radius="5dp" />
<solid android:color="#FFCC00" />
</shape>
</item>
</selector>
styles.xml
Location: Your Android Project\app\src\main\res\values\styles.xml
Specify AppTheme as Theme.AppCompat.Light.NoActionBar
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">@color/colorPrimary</item>
<item name="colorPrimaryDark">@color/colorPrimaryDark</item>
<item name="colorAccent">@color/colorAccent</item>
</style>
</resources>
Android login form material design
Chrome Custom Tabs Android Example

Chrome Custom Tabs Android Example
آموزش ایجاد کاستوم تب اندروید
Define custom color for chrome tabs(toolbar) and transition for chrome to meet your UI guideline when launching chrome browser from your app.
You may have situation where you need to launch webpage(ex: help page) from your app but launching browser having different aesthetic may degrade your UI(look and feel). So the better approach is to customize your browser according to your guideline. In this case Chrome Custom Tabs comes into picture.
Chrome tabs customization using CustomTabsIntent will let you do many thing like Defining overflow menu, action button, animation etc. In this example you likely to find, how to apply custom animation and change toolbar/actionbar color of chrome
Chrome Custom Tabs Android Example
دانلود سورس آموزش ایجاد کاستوم تب اندروید
Chrome Custom Tabs Implementation
Let’s see the files and methods require to build our Chrome Custom Tabs.
Chrome Custom Tabs Android Example
Adding Dependencies
Open your gradle.build(Module:app)
file and add below highlighted code under dependencies.
dependencies {
compile fileTree(dir: 'libs', include: ['*.jar'])
testCompile 'junit:junit:4.12'
compile 'com.android.support:appcompat-v7:23.4.0'
compile 'com.android.support:customtabs:23.4.0'
}
Note: You may need to replace the version of customtabs dependency as your appcompat version, in my case version is 23.4.0.
Defining Custom Transition for chrome
The below files should be placed under res→anim resource directory. If you don’t find any anim folder inside res directory, then add it by Right clicking on res directory(Right click on res→New→Android Resource Directory).
Entry Transition
The below two file defines entry transition for Activity and chrome browser(Activity slides from on-screen to off-screen and at the same time chrome browser slides from off-screen to on-screen).
left_to_right_start.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate android:fromXDelta="100%"
android:fromYDelta="0%"
android:toXDelta="0%"
android:toYDelta="0%"
android:duration="500"/>
</set>
right_to_left_start.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:duration="500"
android:fromXDelta="0%"
android:fromYDelta="0%"
android:toXDelta="-100%"
android:toYDelta="0%" />
</set>
Exit Transition
The below two file defines exit transition for Activity and chrome browser(Activity slides from off-screen to on-screen and at the same time browser slides from on-screen to off-screen).
left_to_right_end.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate android:fromXDelta="0%"
android:fromYDelta="0%"
android:toXDelta="100%"
android:toYDelta="0%"
android:duration="500"/>
</set>
right_to_left_end.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:duration="500"
android:fromXDelta="-100%"
android:fromYDelta="0%"
android:toXDelta="0%"
android:toYDelta="0%" />
</set>
Creating Activity and it’s layout file
Let’s create activity MainActivity.java
and i’ts layout file activity_main.xml
.
MainActivity.java
Code on onCreate()
method will do following jobs.
- Create CustomTabsIntent and set start and exit animation from above xml files using
CustomTabsIntent.builder()
. - Define chrome Toolbar color same as your App’s toolbar color.
Finally, on button click launch chrome with applied configuration.
File Location: App→java→Your package
package com.androidcss.chromecustomtabs;
import android.net.Uri;
import android.support.customtabs.CustomTabsIntent;
import android.support.v4.content.ContextCompat;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
public class MainActivity extends AppCompatActivity {
// website to be visited
static final String SITE_URL = "http://androidcss.com/";
// Define variables for custom tabs and its builder
CustomTabsIntent customTabsIntent;
CustomTabsIntent.Builder intentBuilder;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// Initialize intentBuilder
intentBuilder = new CustomTabsIntent.Builder();
// Set toolbar(tab) color of your chrome browser
intentBuilder.setToolbarColor(ContextCompat.getColor(this, R.color.colorPrimary));
// Define entry and exit animation
intentBuilder.setExitAnimations(this, R.anim.right_to_left_end, R.anim.left_to_right_end);
intentBuilder.setStartAnimations(this, R.anim.left_to_right_start, R.anim.right_to_left_start);
intentBuilder.setSecondaryToolbarColor(ContextCompat.getColor(this, R.color.colorPrimary));
// build it by setting up all
customTabsIntent = intentBuilder.build();
}
// triggers when button clicked
public void ButtonClicked(View arg0) {
// go to website defined above
customTabsIntent.launchUrl(this, Uri.parse(SITE_URL));
}
}
activity_main.xml
Layout file for MainActivity.java
.
File Location: App→res→values
<?xml version="1.0" encoding="utf-8"?>
<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:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
android:paddingBottom="@dimen/activity_vertical_margin" tools:context=".MainActivity">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Go To androidcss.com"
android:id="@+id/button"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="41dp"
android:onClick="ButtonClicked"/>
</RelativeLayout>
Android Navigation Drawer Menu on top of Actionbar / Toolbar

Android Navigation Drawer Menu on top of Actionbar / Toolbar
در این آموزش نحوه Navigation Drawer برای منوهای اندروید رو آموزش میدیم.
Apps like gmail, you see when click on menu icon, a nice Navigation Drawer slides from left on top of Actionbar. Let’s see example layout.
The basic idea behind android navigation drawer on top of action bar is creating custom Actionbar and treat it as child of our main layout. Finally, build Navigation Drawer Layout on top of that. Browse below for project files.
آموزش Navigation Drawer اندروید
دانلود سورس آموزش
MainActivity.java
Setup custom toolbar and navigation drawer layout.
File Location: App→java→Your package
package com.androidcss.drawerexample;
import android.support.v4.widget.DrawerLayout;
import android.support.v7.app.ActionBarDrawerToggle;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.support.v7.widget.Toolbar;
import android.view.View;
public class MainActivity extends AppCompatActivity {
public static DrawerLayout mDrawerLayout;
private Toolbar mToolbar;
private ActionBarDrawerToggle mDrawerToggle;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// Setup Actionbar / Toolbar
mToolbar = (Toolbar) findViewById(R.id.action_bar);
setSupportActionBar(mToolbar);
getSupportActionBar().setDisplayShowHomeEnabled(true);
getSupportActionBar().setLogo(R.mipmap.ic_launcher);
getSupportActionBar().setDisplayShowTitleEnabled(false);
// Setup Navigation Drawer Layout
mDrawerLayout=(DrawerLayout) findViewById(R.id.drawer_layout);
mDrawerToggle = new ActionBarDrawerToggle(this, mDrawerLayout, mToolbar, R.string.drawer_open, R.string.drawer_close) {
@Override
public void onDrawerOpened(View drawerView) {
super.onDrawerOpened(drawerView);
}
@Override
public void onDrawerClosed(View drawerView) {
super.onDrawerClosed(drawerView);
}
};
mDrawerLayout.setDrawerListener(mDrawerToggle);
mDrawerLayout.post(new Runnable() {
@Override
public void run() {
mDrawerToggle.syncState();
}
});
}
}
Related files for MainActivity.java
Here are the files which participates in MainActivity.java
activity_main.xml
XML layout file for MainActivity.java
File location: App→res→Layout.
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<include
android:id="@+id/action_bar"
layout="@layout/action_bar" />
</RelativeLayout>
<fragment
android:id="@+id/fragment_navigation_drawer"
android:name="com.androidcss.drawerexample.FragmentNavigationDrawer"
android:layout_width="280dp"
android:layout_height="match_parent"
android:layout_gravity="start"
app:layout="@layout/fragment_navigation_drawer"
tools:layout="@layout/fragment_navigation_drawer" />
</android.support.v4.widget.DrawerLayout>
action_bar.xml
This xml layout file contains custom toolbar which is supported in support library version 7 and we are included this file in activity_main.xml
.
File Location: App→res→Layout.
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/colorPrimary"/>
strings.xml
Setting Up Drawer layout requires two string constants, specify them in your strings.xml
. The code marked below.
File location: App→res→Values.
<resources>
<string name="app_name">Drawer Example</string>
<string name="drawer_open">Drawer Opened</string>
<string name="drawer_close">Drawer Closed</string>
</resources>
آموزش Navigation Drawer اندروید
styles.xml
When i run my app, the menu icon(3 lines bar) is shown in grey color and i thought which does not look good so i changed it to white by adding following lines of marked code to my styles.xml
file.
Make sure you are chosen the theme which as no action bar, i highlighted the theme below.
File location: App→res→Values.
<resources>
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<item name="colorPrimary">@color/colorPrimary</item>
<item name="colorPrimaryDark">@color/colorPrimaryDark</item>
<item name="colorAccent">@color/colorAccent</item>
<item name="drawerArrowStyle">@style/BarStyle</item>
</style>
<style name="BarStyle" parent="Widget.AppCompat.DrawerArrowToggle">
<item name="color">@android:color/white</item>
</style>
</resources>
FragmentNavigationDrawer.java
Create fragment and interpret layout.
File Location: App→java→Your package
package com.androidcss.drawerexample;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
public class FragmentNavigationDrawer extends Fragment {
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
}
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
return inflater.inflate(R.layout.fragment_navigation_drawer, container, false);
}
}
Related Files for FragmentNavigationDrawer.java
Here are the files which participates in FragmentNavigationDrawer.java
fragment_navigation_drawer.xml
XML design layout file for FragmentNavigationDrawer.java
While designing this layout i have not considered any material design guidelines, this is a tutorial on how to make drawer menu on top of actionbar, i just considered having a background with menu using LinearLayout. I hope, you consider material design guidelines from google and use ListView or RecyclerView for large menu.
File location: App→res→Layout.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@android:color/white"
android:orientation="vertical">
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:id="@+id/topBlock"
android:layout_width="match_parent"
android:layout_height="140dp"
android:layout_marginBottom="10dp"
android:background="@drawable/background"
android:orientation="vertical"
android:paddingBottom="20dp"
android:paddingLeft="10dp"
android:paddingRight="10dp"
android:paddingTop="20dp">
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:padding="16dp">
<ImageView
android:id="@+id/listIcon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginRight="16dp"
android:src="@mipmap/ic_marine" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_gravity="center_vertical"
android:text="Android Dev"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textColor="#666" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:padding="16dp">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginRight="16dp"
android:src="@mipmap/ic_backwater" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_gravity="center_vertical"
android:text="PHP and Mysql"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textColor="#666" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:padding="16dp">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginRight="16dp"
android:src="@mipmap/ic_shellfish" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_gravity="center_vertical"
android:text="HTML and CSS"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textColor="#666" />
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:padding="16dp">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginRight="16dp"
android:src="@mipmap/ic_dryfish" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_gravity="center_vertical"
android:text="AndEngine Dev"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textColor="#666" />
</LinearLayout>
</LinearLayout>
</ScrollView>
</LinearLayout>
background.xml
On our drawer fragment you see a nice AndroidCSS text and logo right? Yes, it is a image and SettingUp background image for LinearLayout in fragment_navigation_drawer.xml
is done by this XML file.
File location: App→res→drawable
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item android:bottom="1dp">
<shape android:shape="rectangle">
<stroke android:width="1dp" android:color="#DDD" />
<solid android:color="#EEE" />
</shape>
</item>
<item >
<bitmap
xmlns:android="http://schemas.android.com/apk/res/android"
android:src="@drawable/logo"
android:tileMode="disabled"
android:dither="true"/>
</item>
</layer-list>
Android JSON Parsing and display with RecyclerView

در این آموزش نحوه نمایش اطلاعات JSON سرور در RecyclerView رو مرور میکنیم.
This tutorial demonstrates how to do Android JSON Parsing and display with RecyclerView or ListView. The data may be from JSON file or PHP.
To fetch JSON data in android i used java’s builtin class called AsyncTask and HttpUrlConnection and Android JSON Parsing will be done by using JSONArray and JSONObject class and finally, to display data i used RecyclerView(Supported in android suport library v7). Let’s get started.
Download Code From Github
Android JSON Parsing and display with RecyclerView
JSON
The below is an example of fish data i’m using which has some basic info like image url, fish name, category, size and price.
example.json
[{"fish_img":"1.jpg","fish_name":"Indian Mackerel","cat_name":"Marine Fish","size_name":"Medium","price":"100"}, {"fish_img":"2.jpg","fish_name":"Manthal Repti","cat_name":"Marine Fish","size_name":"Small","price":"200"}, {"fish_img":"3.jpg","fish_name":"Baby Sole Fish","cat_name":"Marine Fish","size_name":"Small","price":"600"}, {"fish_img":"4.jpg","fish_name":"Silver Pomfret","cat_name":"Marine Fish","size_name":"Large","price":"300"}, {"fish_img":"5.jpg","fish_name":"Squid","cat_name":"Shell Fish","size_name":"Small","price":"800"}, {"fish_img":"6.jpg","fish_name":"Clam Meat","cat_name":"Shell Fish","size_name":"Small","price":"350"}, {"fish_img":"7.jpg","fish_name":"Indian Prawns","cat_name":"Shell Fish","size_name":"Medium","price":"270"}, {"fish_img":"8.jpg","fish_name":"Mud Crab","cat_name":"Shell Fish","size_name":"Medium","price":"490"}, {"fish_img":"9.jpg","fish_name":"Grey Mullet","cat_name":"Backwater Fish","size_name":"Small","price":"670"}, {"fish_img":"10.jpg","fish_name":"Baasa","cat_name":"Backwater Fish","size_name":"Large","price":"230"}, {"fish_img":"11.jpg","fish_name":"Pearl Spot","cat_name":"Backwater Fish","size_name":"Small","price":"340"}, {"fish_img":"12.jpg","fish_name":"Anchovy","cat_name":"Marine Fish","size_name":"Small","price":"130"}, {"fish_img":"13.jpg","fish_name":"Sole Fish","cat_name":"Marine Fish","size_name":"Medium","price":"250"}, {"fish_img":"14.jpg","fish_name":"Silver Croaker","cat_name":"Marine Fish","size_name":"Small","price":"220"}]
Android
The files and steps used in this tutorial as follow.
Adding Dependencies
Open your build.gradle(Module: app) file and add the following dependencies highlighted below and sync your project gradle.
dependencies {
compile fileTree(dir: 'libs', include: ['*.jar'])
testCompile 'junit:junit:4.12'
compile 'com.android.support:appcompat-v7:23.3.0'
compile 'com.android.support:recyclerview-v7:23.3.0'
compile 'com.github.bumptech.glide:glide:3.5.2'
}
Note: You may need to replace the version of dependency files added except glide dependency, in my case version is 23.3.0. You can find your build tool version on top of same page.
MainActivity.java: Fetch JSON and Android JSON Parsing
The step by step procedure as follow
- Immediate after creation of activity an call to AsyncFetch class is made to carry out Asynchronous task.
- onPreExecute(), invoked on the UI thread before the task is executed. Here We are displaying loading message.
- doInBackground(Params…), invoked on the background thread immediately after
onPreExecute() finishes executing. The recieving of data from JSON file using HttpURLConnection class has done in this function. - onPostExecute(Result), invoked on the UI thread after the background computation finishes. Here we are extracting data recieved from JSON file and Android JSON Parsing will be done.
- Finally, the data is passed to adapter to display it on RecyclerView.
package com.androidcss.jsonexample;
import android.app.ProgressDialog;
import android.os.AsyncTask;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.RecyclerView;
import android.widget.Toast;
import org.json.JSONArray;
import org.json.JSONException;
import org.json.JSONObject;
import java.io.BufferedReader;
import java.io.IOException;
import java.io.InputStream;
import java.io.InputStreamReader;
import java.net.HttpURLConnection;
import java.net.MalformedURLException;
import java.net.URL;
import java.util.ArrayList;
import java.util.List;
public class MainActivity extends AppCompatActivity {
// CONNECTION_TIMEOUT and READ_TIMEOUT are in milliseconds
public static final int CONNECTION_TIMEOUT = 10000;
public static final int READ_TIMEOUT = 15000;
private RecyclerView mRVFishPrice;
private AdapterFish mAdapter;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
//Make call to AsyncTask
new AsyncFetch().execute();
}
private class AsyncFetch extends AsyncTask<String, String, String> {
ProgressDialog pdLoading = new ProgressDialog(MainActivity.this);
HttpURLConnection conn;
URL url = null;
@Override
protected void onPreExecute() {
super.onPreExecute();
//this method will be running on UI thread
pdLoading.setMessage("\tLoading...");
pdLoading.setCancelable(false);
pdLoading.show();
}
@Override
protected String doInBackground(String... params) {
try {
// Enter URL address where your json file resides
// Even you can make call to php file which returns json data
url = new URL("http://192.168.1.7/test/example.json");
} catch (MalformedURLException e) {
// TODO Auto-generated catch block
e.printStackTrace();
return e.toString();
}
try {
// Setup HttpURLConnection class to send and receive data from php and mysql
conn = (HttpURLConnection) url.openConnection();
conn.setReadTimeout(READ_TIMEOUT);
conn.setConnectTimeout(CONNECTION_TIMEOUT);
conn.setRequestMethod("GET");
// setDoOutput to true as we recieve data from json file
conn.setDoOutput(true);
} catch (IOException e1) {
// TODO Auto-generated catch block
e1.printStackTrace();
return e1.toString();
}
try {
int response_code = conn.getResponseCode();
// Check if successful connection made
if (response_code == HttpURLConnection.HTTP_OK) {
// Read data sent from server
InputStream input = conn.getInputStream();
BufferedReader reader = new BufferedReader(new InputStreamReader(input));
StringBuilder result = new StringBuilder();
String line;
while ((line = reader.readLine()) != null) {
result.append(line);
}
// Pass data to onPostExecute method
return (result.toString());
} else {
return ("unsuccessful");
}
} catch (IOException e) {
e.printStackTrace();
return e.toString();
} finally {
conn.disconnect();
}
}
@Override
protected void onPostExecute(String result) {
//this method will be running on UI thread
pdLoading.dismiss();
List<DataFish> data=new ArrayList<>();
pdLoading.dismiss();
try {
JSONArray jArray = new JSONArray(result);
// Extract data from json and store into ArrayList as class objects
for(int i=0;i<jArray.length();i++){
JSONObject json_data = jArray.getJSONObject(i);
DataFish fishData = new DataFish();
fishData.fishImage= json_data.getString("fish_img");
fishData.fishName= json_data.getString("fish_name");
fishData.catName= json_data.getString("cat_name");
fishData.sizeName= json_data.getString("size_name");
fishData.price= json_data.getInt("price");
data.add(fishData);
}
// Setup and Handover data to recyclerview
mRVFishPrice = (RecyclerView)findViewById(R.id.fishPriceList);
mAdapter = new AdapterFish(MainActivity.this, data);
mRVFishPrice.setAdapter(mAdapter);
mRVFishPrice.setLayoutManager(new LinearLayoutManager(MainActivity.this));
} catch (JSONException e) {
Toast.makeText(MainActivity.this, e.toString(), Toast.LENGTH_LONG).show();
}
}
}
}
DataFish.java
package com.androidcss.jsonexample;
public class DataFish {
public String fishImage;
public String fishName;
public String catName;
public String sizeName;
public int price;
}
AdapterFish.java
Here Binding data to views and recycling of views will be done when user scroll through RecyclerView.
package com.androidcss.jsonexample;
import android.content.Context;
import android.support.v4.content.ContextCompat;
import android.support.v7.widget.RecyclerView;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.TextView;
import com.bumptech.glide.Glide;
import java.util.Collections;
import java.util.List;
public class AdapterFish extends RecyclerView.Adapter<RecyclerView.ViewHolder> {
private Context context;
private LayoutInflater inflater;
List<DataFish> data= Collections.emptyList();
DataFish current;
int currentPos=0;
// create constructor to innitilize context and data sent from MainActivity
public AdapterFish(Context context, List<DataFish> data){
this.context=context;
inflater= LayoutInflater.from(context);
this.data=data;
}
// Inflate the layout when viewholder created
@Override
public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
View view=inflater.inflate(R.layout.container_fish, parent,false);
MyHolder holder=new MyHolder(view);
return holder;
}
// Bind data
@Override
public void onBindViewHolder(RecyclerView.ViewHolder holder, int position) {
// Get current position of item in recyclerview to bind data and assign values from list
MyHolder myHolder= (MyHolder) holder;
DataFish current=data.get(position);
myHolder.textFishName.setText(current.fishName);
myHolder.textSize.setText("Size: " + current.sizeName);
myHolder.textType.setText("Category: " + current.catName);
myHolder.textPrice.setText("Rs. " + current.price + "\\Kg");
myHolder.textPrice.setTextColor(ContextCompat.getColor(context, R.color.colorAccent));
// load image into imageview using glide
Glide.with(context).load("http://192.168.1.7/test/images/" + current.fishImage)
.placeholder(R.drawable.ic_img_error)
.error(R.drawable.ic_img_error)
.into(myHolder.ivFish);
}
// return total item from List
@Override
public int getItemCount() {
return data.size();
}
class MyHolder extends RecyclerView.ViewHolder{
TextView textFishName;
ImageView ivFish;
TextView textSize;
TextView textType;
TextView textPrice;
// create constructor to get widget reference
public MyHolder(View itemView) {
super(itemView);
textFishName= (TextView) itemView.findViewById(R.id.textFishName);
ivFish= (ImageView) itemView.findViewById(R.id.ivFish);
textSize = (TextView) itemView.findViewById(R.id.textSize);
textType = (TextView) itemView.findViewById(R.id.textType);
textPrice = (TextView) itemView.findViewById(R.id.textPrice);
}
}
}
activity_main.xml
The xml file for MainActivity.java
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.v7.widget.RecyclerView
android:id="@+id/fishPriceList"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingTop="10dp"
android:layout_weight="1"
/>
</LinearLayout>
container_fish.xml
The xml file for AdapterFish.java
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:clickable="true"
android:orientation="horizontal"
android:padding="10dp">
<ImageView
android:layout_width="60dp"
android:scaleType="fitXY"
android:layout_height="40dp"
android:id="@+id/ivFish"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="fish name"
android:id="@+id/textFishName"
android:layout_marginLeft="5dp"
android:layout_toRightOf="@id/ivFish"
android:layout_toLeftOf="@+id/textPrice"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceSmall"
android:text="price"
android:id="@+id/textPrice"
android:textColor="@color/colorAccent"
android:layout_alignParentRight="true"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceSmall"
android:text="Small Text"
android:id="@+id/textSize"
android:layout_marginLeft="5dp"
android:layout_below="@id/textFishName"
android:layout_toRightOf="@id/ivFish"
android:layout_toEndOf="@id/ivFish"
android:textColor="#666"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceSmall"
android:text="sd"
android:id="@+id/textType"
android:layout_marginLeft="5dp"
android:layout_below="@id/textSize"
android:layout_toRightOf="@id/ivFish"
android:textColor="#666"/>
</RelativeLayout>
AndroidManifest.xml
Don’t forget to add uses-permission for internet to your AndroidManifest.xml file, otherwise it will give access denied error.
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="com.androidcss.jsonexample" >
<uses-permission android:name="android.permission.INTERNET"/>
<application
android:allowBackup="true"
android:icon="@mipmap/ic_launcher"
android:label="@string/app_name"
android:supportsRtl="true"
android:theme="@style/AppTheme" >
<activity android:name=".MainActivity" >
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>
</manifest>
Android JSON Parsing and display with RecyclerView
Android Pull to Refresh RecyclerView with JSON PHP

Android Pull to Refresh RecyclerView with JSON PHP
در این آموزش نحوه swipe کردن RecyclerView با استفاده از اطلاعات json رو مرور میکنیم.
Pull down to fetch fresh data from PHP or JSON file into RecyclerView using Android Swipe Refresh Layout and AsyncTask.
When you swipe down to screen, you likely to see rounded button with refresh icon spinning indicating data is loading on background. In android it’s easy to implement that android pull to refresh layout. Let’s see how to do that.
از اینجا میتونین قطعه کد این آموزش رو دانلود کنین
Android Pull to Refresh RecyclerView with JSON PHP
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.v4.widget.SwipeRefreshLayout
android:id="@+id/swifeRefresh"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v7.widget.RecyclerView
android:id="@+id/fishPriceList"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
/>
</android.support.v4.widget.SwipeRefreshLayout>
</LinearLayout>
MainActivity.java
Define the variable for SwipeRefreshLayout view on top of the class.
SwipeRefreshLayout mSwipeRefreshLayout;
Copy the below highlighted code into your oncreate()
method of MainActivity.java class. Here we are getting reference to SwipeRefreshLayout widget and setting listener to listen for swipe down refresh and when user swipe down to screen, call AsyncTask to fetch fresh data.
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// Swipe Refresh Layout
mSwipeRefreshLayout = (SwipeRefreshLayout)findViewById(R.id.swifeRefresh);
mSwipeRefreshLayout.setOnRefreshListener(new SwipeRefreshLayout.OnRefreshListener() {
@Override
public void onRefresh() {
new AsyncFetch().execute();
}
});
//Make call to AsyncTask
new AsyncFetch().execute();
}
We have made Swipe layout visible when user swipes the screen. It continues to visible even after data loaded so we need to hide the layout after our data loaded from server. At the end of your onPostExecute(String result)
method add below code to hide SwipeRefreshLayout.
mSwipeRefreshLayout.setRefreshing(false);
Finally, to test your application remove some rows from json file or add some rows it. Now, in your phone, swipe vertically down to see updated data.
Android Pull to Refresh RecyclerView with JSON PHP
دانلود سورس ارتباط با دیتابیس اندروید Android Recycler View using Retrofit & Glide

دانلود سورس ارتباط با دیتابیس اندروید Android Recycler View using Retrofit & Glide
This is an Implementation of RecyclerView using Retrofit & Glide to Create a simple Movie List with an Asp.Net(C#), Web Api and Azure Blob Storage Backend.
Find the source code on Github”
https://github.com/lambda2016/Retrofit-RecyclerVew
Api: http://orionadmin.azurewebsites.net/api/movies
دانلود سورس ارتباط با دیتابیس اندروید Android Recycler View using Retrofit & Glide
دانلود سورس اپ آزمون اندروید Android Online Quiz with Php and MYSQL

دانلود سورس اپ آزمون اندروید Android Online Quiz with Php and MYSQL
This is android quiz application that makes use of remote mysql database to store all information and questions related to this quiz.
It supports the following features

Android Online Quiz App Features
1. User Registration
2. User Login
3. Quiz Categories
4. Quiz Subcategory
5. User Profile Page
6. Quiz Score Board
7. Quiz Settings
8. Quiz Question
9. Quiz Timer Support
10. Material Design
11. Remote Online Database
12. Online web based admin panel
13. Clean and beautiful code
14. Settings
15. Rate App
ADMIN PANEL FEATURES
Manage User
Add, Edit and Delete Category
Add, Edit and Delete Subcategory
Add, Edit and Delete Questions
Manage Score
Manage Settings
PACKAGE INCLUDES
1 Android Java Source code
2. Web Admin Panel (Php and MYSQL)
3. Database file (.sql file)
4. Documentation
ADMIN PANEL DEMO
Please note that in order not to over load my server, I have disabled all form submission buttons. But feel free to navigate through the admin panel to see all the features the admin panel has.
login email – admin@yahoo.com
login password – admin
OTHER INTERESTING POSTS:
1. User Registration
2. User Login
3. Quiz Categories
4. Quiz Subcategory
5. User Profile Page
6. Quiz Score Board
7. Quiz Settings
8. Quiz Question
9. Quiz Timer Support
10. Material Design
11. Remote Online Database
12. Online web based admin panel
13. Clean and beautiful code
14. Settings
15. Rate App
دانلود سورس اپ آزمون اندروید Android Online Quiz with Php and MYSQL
دانلود سورس اپ فروشگاهی اندروید Android E-Commerce Shopping App

دانلود سورس اپ فروشگاهی اندروید Android E-Commerce Shopping App
Android Ecommerce Shopping App with Pay Pal Integration.
You can also look at the tutorial on how you can create your own android shopping app and integrate Paypal as a payment method.
The complete source code for this tutorial is attached below.
The Premium version (Paid) of this android ecommerce app has the following features listed below
- Material Design
- Product Categories
- Detailed Product Page
- Best Selling Product
- Products on Promotion
- Notification
- Order History
- Favorite Products
- Store Information
- Settings
- Navigation Drawer
- User Profile
- Shopping Cart
- Tax
- Shipping Cost
- Discount
- Pay on Delivery
- Pay Pal
- Stripe Payment Gateway (Credit Card)
دانلود سورس اپ فروشگاهی اندروید Android E-Commerce Shopping App
دانلود از گوگل پلی Google Play APK Downloader

دانلود از گوگل پلی Google Play APK Downloader
100% responsive. Built with material skinned Bootstrap.
Visitors can paste Google Play Store URL or app id for download.
Uses cURL extansion. So fast.
Visitors can download with direct link or QR Code.
Very simple installation.
Fully documented.