Tuesday, 23 August 2016

Android Material design Notifications

Android Notifications are meant to inform the user about any useful information , which the user can see without open an application.

In other words , we can say that Notifications are short cut method to inform user in an easiest and attractive way.

Now a days there are many anti-access options are available for Android Notifications.

For example :
  1. In device settings , we can restrict the notification content to show when the device is locked.
  2. We can also restrict the device to show the Notifications when device is locked.
There are several things which comes into the Developer mind that
  1. How to create the Notification?
  2. How to show the large text in the Notifications?
  3. How to show some custom images in the Notifications?
  4. How to open a page when user tap on the Notification?
  5. How to clear the Notifications?   and many more......
So today we will dirty our hands with Android Notifications and i hope you will enjoy the session.

Prerequisite :
1. I am always encourage developers to use the Android studio , as this is an very intensive tool for programming and very proactive.

2. Use the design library to use the NotificationCombat class
Please add the following text in your Module's .gradle file under dependencies as follows.

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:design:23.4.0' 
}

After adding above design library , your code environment is ready.

Sample code Snippet :





and for more please download the code.
Happy Coding.....




Sunday, 14 August 2016

Material design Tabs with Viewpager

Tabs are very powerful component of Android , which helps us to show the data in a segregated and arranged manner.

As we have seen that the most of the apps now focusing on the Tabs and View Pager components to make their app more user friendly.

Now a days users want more data on single page or we can say more data in less navigation. So Tabs and View Pager fulfilled the criteria and helps developers to show collective data in a segregated manner to user.

Don't you think its interesting and if you are an Android developer ans still you didn't dirty your hands with Tabs and View Pager, then lets start. So today you will become expert in developing tabs under View pager.

So now let's start learning it.

Prerequisite :
1. I am always encourage developers to use the Android studio , as this is an very intensive tool for programming and very proactive.

2. Use the design library to use the View pager and the Tab layout.

Please add the following text in your Module .gradle file under dependencies as follows.

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:design:23.4.0' 
}

After adding above design library , your code environment is ready and we will now start coding.

The coding is pretty simple as i will explain now.

1. Firstly we need to initialize the View pager
mPager = (ViewPager)findViewById(R.id.viewpager);

2. And then initialize the tabLayout
tabLayout = (TabLayout) findViewById(R.id.sliding_tabs);


3. Now add the required listener, which helps us to track the tabs which are getting scrolled.
mPager.addOnPageChangeListener(new TabLayout.TabLayoutOnPageChangeListener(tabLayout));

4. Now you should add the fragments to the viewpager ad follows. The number of fragments you add, the number of tabs will be generated.
private void initViewPager(ViewPager mPager) { 
   FragmentManager fm = getSupportFragmentManager(); 
   ViewPagerAdapter adapter = new ViewPagerAdapter(fm); 
   adapter.addFragment(new FirstTabFragment(),getString(R.string.first_tab));  adapter.addFragment(new SecTabFragment(), getString(R.string.second_tab));        mPager.setAdapter(adapter); 

where below line adding the fragments to the view pager

adapter.addFragment(new FirstTabFragment(),getString(R.string.first_tab)); 
adapter.addFragment(new SecTabFragment(), getString(R.string.second_tab));

5. Now add the tabLayout to the View pager

tabLayout.setupWithViewPager(mPager);
tabLayout.setOnTabSelectedListener(new TabLayout.OnTabSelectedListener() { 
 @Override public void onTabSelected(TabLayout.Tab tab) { 
  // setting the action bar title with the selected tab 
   setActionBarTitle(tab.getText().toString().trim()); 
   setSelectedTab(tab.getPosition()); 
  }
 @Override public void onTabUnselected(TabLayout.Tab tab) { } 
 @Override public void onTabReselected(TabLayout.Tab tab) { } 
});

The initialization of the view pager includes the initialization of the ViewPager Adapter as well.
class ViewPagerAdapter extends FragmentStatePagerAdapter { 
  private final List mFragmentList = new ArrayList<>(); 
  private final List mFragmentTitleList = new ArrayList<>(); 

  public ViewPagerAdapter(FragmentManager manager) { 
    super(manager); 
  } 

@Override public Fragment getItem(int position) { 
  return mFragmentList.get(position); 
 } 

 @Override public int getCount() { 
     return mFragmentList.size(); 
  } 

  public void addFragment(Fragment fragment, String title) { 
    mFragmentList.add(fragment); mFragmentTitleList.add(title); 
  } 

@Override public CharSequence getPageTitle(int position) { 
   return mFragmentTitleList.get(position); 
  } 
}

Screenhots:

Sunday, 7 August 2016

Custom SnackBar in Android

In ancient days , we were talking about the Toast. Using Toast we were showing the messages , useful information to the user.
But now a days, Toast has been replaced by the SnackBar, a powerful feature using which we can display messages to the user in an unique and attractive style.
Snackbar comes with a default animation from bottom to up and hide from top to bottom.
Like Toast , we can customize the Snackbar as well, which we will disucss now.
Note :
To access the SnackBar , The design library should be added in Android Studio project.
Steps to add the Design Library:
1. In Android Studio, Open you Module.
2. Now open the .gradle file.
3. and then add the design library under dependencies section like below.
Have a look at a design library in Bold
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:design:23.4.0'
}
Snack Bar in Fragment:
When we showing the Snack bar in Fragment, many of us facing an issue as highlighted in below image.

Screenshot_20160807-014106

This situation arises when we are displaying the Snack Bar as below.
Snackbar.make(view.getRootView(), "This is a wrong SnackBar", Snackbar.LENGTH_LONG).show();
And to overcome this problem , the one should use the root layout id in place of view.getRootView() as follows
Snackbar.make(mView.findViewById(R.id.top_layout), "This is a correct SnackBar", Snackbar.LENGTH_LONG).show();
where R.id.top_layout is the parent element of your layout.

Custom Action Bar

In Android applications, we have seen that the Action Bar plays a major role. There are many vital options that we can provide using the Action Bar and moreover this is customizable.
We can provide any User Interface to action bar and make at attractive and user-friendly.
So today we will learn about the customization of the Action Bar.

Prerequisites :
I strongly recommend that you should use the Android Studio,as this is a great tool for developing the Android applications.As for most of the developers its a night mare, But i hope  you should overcome it.
Now we shall begin.Start by creating an Activity which extends AppCompatActivity.

public class MainActivity extends AppCompatActivity{
ActionBar mActionBar = getSupportActionBar();
mActionBar.setElevation(0); // used to remove the shadow under Action Bar
mActionBar.setCustomView(R.layout.custom_action_bar);
}
Where 'custom_action_bar.xml'  is the custom layout for the Action Bar.In this XML file , you can create the User Interface according to the requirement.
Output :
action_bar