Viral Android – Tutorials, Examples, UX/UI Design

Android RecyclerView is used to create advance lists and cards or grids with material design concept in your android application. Android RecyclerView and CardView widgets can be used together. The RecyclerView is a advanced and flexible version of list view. By using RecyclerView and CardView widgets you can make more material design style app. If you want to add ListView or GridView inside NestedScrollView design support library, you may face many problems. So if you want to add lists, cards, grids with material header view, coordinator layout, I recommend you to use RecyclerView. You can customize your cards, lists in your own ways.

In this tutorial, you will learn to display grids item in your android application with image and text using android RecyclerView. For that you need to create java file like DataAdapter, AndroidVersion and ItemClickListener.

Related:
Android Material Design GridView Tutorial
Android Fragments Tutorial with Example
Start New Activity from Android ListView onItemClick

Android Example: Custom Grid RecyclerView with Images and Text

Let’s start by creating new android project called Android RecyclerView Example. After creating new project open build.gradle file and add compile com.android.support:recyclerview-v7:23.2.0 and compile com.android.support:design:23.0.0 dependencies. Bulid.gradle file will look like below.

build.gradle

XML Layout File

Open your main XML layout file and add android.support.v7.widget.RecyclerView inside android.support.design.widget.CoordinatorLayout with id. This will look like below.

res/layout/activity_main.xml

Now you need to create a new XML layout file for grids or lists item. Create row_layout.xml file in res/layout and add ImageView and TextView inside LinearLayout or RelativeLayout with different id. Following is the complete content of row_layout.xml file.

res/layout/row_layout.xml

Java Activity File

Open main java activity file and add following code. Here I have added text for grid title, images for grid items. Create ArrayList and add onItemTouchListener and onItemClickListener in recycler view. Following is the complete code of java activity file.

src/MainActivity.java

Again create a new java file called AndroidDataAdapter and extend into RecyclerView.Adapter<AndroidDataAdapter.ViewHolder>. Defile private variable from ArrayList and Context. In ViewHolder class you need to connect to grid row layout image and text like below. Following is the complete code of AndroidDataAdapter.java file.

src/AndroidDataAdapter.java

Again, create a new java file AndroidVersion.java and add following code.

src/ AndroidVersion.java

Handle RecyclerView Item Click Event

Finally, create a new java file called RecyclerItemClickListener.java to handle recycler item click listener and implements it to RecyclerView.OnItemTouchListener. Defile private variable to RecyclerView.OnItemTouchListener and add the following code. We have already added toast message when android recyclerView item click in mRecyclerView.addOnItemTouchListener of MainActivity.java file. Following is the complete java code of RecyclerItemClickListener.java file.

src/RecyclerItemClickListener.java

Run your Android RecyclerView Example application which will look like above screenshot. If you click grid items, a toast message will appear with grid position

Advance Examples GridView ListView Material-Design Tips-And-Tricks Tutorial

Tweet Share Share Share Share Share

Android Button Selector Example

Pacific P. Regmi November 28, 2018

Button Development Examples Tips-And-Tricks Tutorial XML

Tweet Share Share Share Share Share

Load Images Using Picasso Library in Android

Pacific P. Regmi November 16, 2018

Android SDK does not have a good way to get images from web and display it to android app. Almost every popular android application display images from website, web server or anywhere from the internet. To solve this problem, numbers of third party libraries are available. In this tutorial, you will learn to load images from internet using Picasso image loader library; this is one of the best and powerful image downloading and caching android library. Using this library, we can easily fill an ImageView with an image from the internet.

Picasso library have lots of features like load images from web, resizing images, cropping images, place holder and displaying error images. Picasso from Square is open source and one of the popular& easiest libraries used to download and cache images from web in android. You can also load images without using any libraries in android application, check out my tutorial: Load Image from URL (Internet) in Android.

Related:
Check Internet Connection in Android
Turn ON and OFF WiFi Connection Programmatically in Android
How to Get Current GPS Location Programmatically in Android

Android Example: View Images from Web using Picasso Image Loader Library

Create a new android project with the project name Picasso Image Loader Library. You can setup Picasso image downloader and caching library with gradle dependency or mavne. Open your app build.gradle file and add compile 'com.squareup.picasso:picasso:2.5.2' as application dependencies which will look like below.

build.gradle

XML Layout File

Open XML layout file and add ImageView with different id. Here I have added many ImageView and TextView to make look like news reader app with in LinearLayout and ScrollView. Just copy and paste following XML code in your layout file.

res/layout/activity_main.xml

Java Activity File

In java file, defile variables for different ImageView, add images URL like strings. Link to your layout image view with findViewById and load the images in ImageView from web using Picasso library like Picasso.with(this).load(imageURL4).resize(250, 200).into(image1);. Following is the complete code of java activity file.

src/MainActivity.java

Before running your application don’t forgot to add user permission android.permission.INTERNET in AndroidManifest.xml file. Android manifest file will look like below.

AndroidManifest.xml

Picasso image downloading android library offers much more than just downloading image. You can resize images, display error image when image is unable to download, rotate, place holder, transform before image is displayed in ImageView.

Picasso.with(this)
.load("Image URL")
.error(R.drawable.error_image) // optional
.placeholder(R.drawable.placeholder_image) // optional
.resize(200, 200) // optional
.rotate(60) // optional
.into(imageview1);

Output:

Android Example: Create a Music Player Android Application XML UI Design

You have done all things. Now, run your Load Images Using Picasso Library in Android application, you will see images in ImageView which are loaded from internet. Make sure your phone or emulator have WiFi or mobile network turned on.

Advance Development Examples ImageView Libraries Tips-And-Tricks Tutorial

Tweet Share Share Share Share Share

Few Tools That Assist In Building Innovative Mobile Applications

Viral Android November 16, 2018

To rule the digital market, you need to come up with a robust, scalable and feature-rich mobile application which should be compatible with Android and iOS. The reason you should develop an app compatible with these two platforms is because they both have a huge user base and will offer a proper market for your app.

The Android and iOS operating systems have their pros and cons but in this post, we won't be discussing Android application development services or iOS development. Here you will be reading about few app development tools that will come in handy while building an innovative application. It will be good that you create an app that functions on both the platforms as it will not only help you in earn good amount of users but will also fetch you several monetary benefits.

Related:
5 Questions to Ask Before Hiring Mobile App Developers
Integrating Google Firebase Analytics to your Android Project
Android App Security is Enhanced on Google Play Reveals

Given below are the few useful tools that will help you create a fully-functional mobile app:

Shoutem

Launched in the year 2011, this app maker is quite refined compared to the other software. Shoutem comes loaded with plenty of powerful development options such as smooth image integration and adding location-based directory which helps in building different apps that use geographical locations and photos.

Apart from that, Shoutem also helps Android apps developer to add different monetization elements like advertising support, integration of Shopify etc. As it's a paid software so the pricing starts from $19 for the basic version and if you wish to publish your app on Google Play or Apple's App store then you need to pay $49 for the advanced plan.

AppYourself

With this, you can develop apps compatible with iOS, Windows Phone OS, Android. You can also use it for creating pure HTML5 apps. Apart from being feature-rich this software also allows developers to build a responsive website which can be synced with the app content. Right now, this feature is in the beta phase, and the company promised to launch the full version soon.

AppYourself comes with four pricing tiers: The Web Only- €5, Basic- €15, Premium- €30 and the Enterprise Version that has a price tag of €50 & €200 and also offers a free setup. Well, you can use this software for as long as you want but to publish your app you need to purchase one of their premium

Mobile Roadie

This app maker is one of the big players in the market. It is used for building robust enterprise apps and companies like Disney, TED.org, Cirque Du Soleil and Universal Studios got their apps developed using this software. Coming at the price point the Core version of Mobile Roadie has a price tag of $149 and the Pro version has a hefty price of $799.

As this software focuses on larger companies so small or part-time app developers don't use it much. Mobile Roadie offers great templates and gives several options to tweak them as per the requirements. Moreover, there's a huge support community where you can get in touch with other developers or designers using this app builder.

Mobincube

Compared to Mobile Roadie, the Mobincube positions itself as the website builder which can be used by everyone. This software comes with an Admob platform that assists in running adverts in the app. Mobincube is quite affordable and a developer has to pay $9.99 for the basic version. Another good thing about their plans is that it allows developers to go native or they can publish their app on any app store.

Mobincube is still in development phase, so you might face few technical issues or bugs while using the editor. From simple to complex, a developer can create any page type using this software. After some recent changes, you can now add HTML modules, user account registration screens, advanced forms, embedded HTML5 games and much more.

MobAppCreator

It is a newly launched software and mainly focuses on building native apps i.e. apps which can only be published on one platform. The developers of this software claim to have almost 41,000,000 apps views and rising. There are not many pre-designed templates in the app builder but the editor is very user-friendly, offers a simple interface and no technical jargons are involved.
MobAppCreator comes with a 14-day trial version which offers proper access to all the tools. The cheapest plan starts at $32.50 per month and it comes with few additional templates. And they have their own separate online store module available for the South American market.

GoodBarber

This app builder comes loaded with beautiful themes and amazing features like social networking, iBeacons, Geofencing, chat system, etc. With GoodBarber you can get your native iOS and Android app developed at just €16 per month. There's an extensive showcase of apps which were developed using this software.

Apart from that, a user can also integrate different eCommerce features like Amazon, Shopify and Etsy. Their app editor is easy to use and even an amateur developer can use it to create a basic app. The only drawback of this system is they don't have their own online store.

Como DIY

This app maker claims that it has been used to build around 1 million apps which make it another big player in the market. They offer a spectrum of app building blocks like loyalty card feature, user reviews, events, appointment scheduling and eCommerce. Most of the restaurants, bands and museums use this software to developer their apps. It has seven unique templates that can be combined with six navigational styles.

Como DIY recently updated their pricing structure: now there is only one pricing tier which is $57 monthly, $48 yearly and $41 bi-yearly. Along with cost-effective prices, they also offer a 6-month "Success Guarantee plan" which means that Como DIY will give you six months for free if you are not able to achieve any profitable or meaningful business results with the app developed using this platform.

Wrapping Up

In this post, you will come across seven best app building software's that will surely make your app development process hassle-free. This is true that you don't need to an expert in scripting languages however if you actually want your app to get published on Android or iOS app store then you will be needing a basic coding & image editing skills. High quality graphics, features and functionalities are some of the key components that enhance the user base of an app.

Author Bio:

Xicom Technologies Ltd, is an USA based, Software and mobile application development company. We have 350+ experts who are available on the full-time, part-time and hourly basis. You can hire their developers at just $25 per hour.

Android app AppBuilder Developers Development

Tweet Share Share Share Share Share

Android Swipe Down to Refresh Layout Example

Pacific P. Regmi November 03, 2018

Development Examples Layout Material-Design Tutorial UI Widget XML

Tweet Share Share Share Share Share

Integrating Google Firebase Analytics to your Android Project

Pacific P. Regmi November 03, 2018

Firebase is a cloud service provider and backend as a server for mobile and web app. Firebase was founded in 2011 and launched with a real time cloud database in April 2012. Firebase has many features; most of them are free while some are paid. Firebase include mobile app analytics (Android, iOS, etc), cloud messaging, firebase auth, storage, hosting, remote config, test lab for android, crash reporting, send notification to the users, app indexing, dynamic links and send personalized email and SMS invitation, measuring the impact of invitation.

In this tutorial, you will learn to integrate or add Google firebase analytics to your android project. Firebase analytics collects usage and behavior data for your application or game. If you already integrate any of the firebase services in your android app or game then adding firebase analytic is very easy. If not, don’t worry. In this tutorial, I will show you step-by-step guide to integrate Google firebase and firebase analytic in your android application with simple example and you can download this sample project source code from GitHub at last.

Related:
Android Push Notification Tutorial Using Firebase
How to Integrate Google AdMob in Android
Google Maps Android API Getting Started Tutorial : Part 1

Integrating Google Firebase Analytics to your Android Project: Get Started with Firebase Analytics for Android

Before starting to add google firebase analytic to your android project, make sure your device is running Android 2.3 (Gingerbread) or newer, and Google Play services 9.2.1 or newer and Android Studio 1.5 or higher.

1. Create a new Android Project using Android Studio

Create a new android project with the package name: Add Firebase Analytics to Android Project and select minimum SDK: API 9 Android 2.3 (Gingerbread) or higher.

2. Install the Firebase ADK to your Android Project

To integrate the firebase libraries into your own android project, you need to perform certain tasks.

2.1. Open your project level (top level) build.gradle file and add classpath 'com.google.gms:google-services:3.0.0' as a dependencies. Your project level build.gradle file will look like below.

Project level build.gradle file

2.2. Now open your app level build.gradle file and add compile 'com.google.firebase:firebase-core:9.2.1' as app dependencies and apply plugin: 'com.google.gms.google-services' at the bottom. Your app level build.gradle file will look like below.

App level build.gradle file

3. Adding Internet Permission in your Application AndroidManifest.xml File

In your app’s AndroidManifest.xml file you need to add internet user permission. Open AndroidManifest.xml file and add android.permission.INTERNET which is look like below.

AndroidManifest.xml

4. Add Your App to Your Firebase Project in the Firebase Console

4.1. Go to Google Firebase Developer Console

4.2. Create new project.
4.3. A dialog box will appear, add project name: Google Firebase Analytics and choose your country and click Create Project button.
4.4. After creating new project in Google firebase developer console, new screen will appear like below.

4.5. Click add firebase to your android app. Here you need to provide your app package name.
4.6. Add project package name in the box and click Add App button. A file google-services.json is downloaded. Click Continue and Finish button.

5. Adding google-services.json File to Your Project

5.1. Go to android studio. Switch to the project view in Android Studio.
5.2. Add google-services.json file that you just downloaded to your android app directory like the screenshot below.

6. Adding Firebase Analytics for Android to Your Android App

In android studio, again open app level build.gradle file and add compile 'com.google.android.gms:play-services-analytics:9.2.1' as app dependencies. Following is the final content of app level build.gradle file.

App level build.gradle file

7. Check Your App Report in Google Firebase Analytics

7.1. Go to Firebase Developers Console.
7.2. Choose your app
7.3. Click Analytics from left menu. For the first time, it will look like below.

After some hours or day you can see your app’s complete reports like below.

That’s all. You have done all things. Now you can see your application’s complete report in Google firebase analytic. It’s very easy and simple to integrate.

8. Java Activity File and XML Layout File

Following is the content of XML layout file.

res/activity_main.xml

Following is the complete content of java activity file.

src/MainActivity.java

Download Complete Project Source Code

You can download complete example project source code from GitHub.

Advance Analytics AndroidStudio API Examples Firebase Integration Java SDK Tips-And-Tricks Tutorial

Viral Android – Tutorials, Examples, UX/UI Design

Top Featured

Recent Posts

Show and Clear Android Notification Example

Android RecyclerView Example

Android Button Selector Example

Load Images Using Picasso Library in Android

Few Tools That Assist In Building Innovative Mobile Applications

Android Swipe Down to Refresh Layout Example

Integrating Google Firebase Analytics to your Android Project

UI Design

Tips and Tricks

Top Featured

Android Example: How to Show and Clear Notification in Android App

Android Example: Custom Grid RecyclerView with Images and Text

Android Example: How to Make Button Selector in Android

Android Example: View Images from Web using Picasso Image Loader Library

Android Example: How to Implement Swipe to Refresh in Android

Integrating Google Firebase Analytics to your Android Project: Get Started with Firebase Analytics for Android

1. Create a new Android Project using Android Studio

2. Install the Firebase ADK to your Android Project

3. Adding Internet Permission in your Application AndroidManifest.xml File

4. Add Your App to Your Firebase Project in the Firebase Console

5. Adding google-services.json File to Your Project

6. Adding Firebase Analytics for Android to Your Android App

7. Check Your App Report in Google Firebase Analytics

8. Java Activity File and XML Layout File

Download Complete Project Source Code

UI Design

Tips and Tricks