Tips & tricks android developer should know - part 3

Description: In this post I'm gonna demonstrate some useful tips which we could come handy in our app development life cycle

Also check out Part 1 and Part 2.

So let 's get started.

1. Grant all permissions at once in Marshmallow and above.  

GIST Snippet Here

As we know marshmallow compatible apps require permissions. So we normally show permission dialog to the user asking to grant us. That's fine. But every time clicking that 'allow' feels annoying for developers.

So the idea is to allow all the permissions at once without every time clicking the allow button.

Below  shell script will help to make it happen flawlessly.

#!/bin/sh

#add your package_name
PACKAGE=com.app.code2concept

#create array with all the permission you need to enabled    
PKG_ARRAY='android.permission.CALL_PHONE
        android.permission.GET_ACCOUNTS
        android.permission.READ_SMS
        android.permission.READ_CONTACTS
        android.permission.ACCESS_FINE_LOCATION
        android.permission.CAMERA
        android.permission.WRITE_EXTERNAL_STORAGE'

#lets exceute our command
for permissions in $PKG_ARRAY; 
do
 echo $permissions + ' granted'
 adb shell pm grant $PACKAGE $permissions
done

echo 'Bingo its done'

OUTPUT:

$ sh grant_all_permissions.sh
android.permission.CALL_PHONE +  granted
android.permission.GET_ACCOUNTS +  granted
android.permission.READ_SMS +  granted
android.permission.READ_CONTACTS +  granted
android.permission.ACCESS_FINE_LOCATION +  granted
android.permission.CAMERA +  granted
android.permission.WRITE_EXTERNAL_STORAGE +  granted
Bingo its done'

Before


After

2. Battery Historian

Battery historian translate the battery stats into visualization form thereby helping us to figure out whats the cause and how we can optimized our battery usage.

Pre-requisite:
1. 'adb' is configured
2. Devices is detectable using 'adb devices' command
3. Python(2.7)  is install and path is set.

Step 1: Reset the battery stats to fetch fresh info using below

adb shell dumpsys batterystats --reset

Note: Disconnect phone and explore the app for few minutes and connect again

Step 2: Capture 'batterystats' using below command

adb shell dumpsys batterystats > batterystats.txt

Note: The command creates a file name 'batterystats.txt' into the current directory

Step 3: Clone or download the Github repo of 'Battery Historian' from Here. You will find a python script at path '../battery-historian/scripts/historian.py'

Note: You can keep both 'historian.py' and 'batterystats.txt' in the same folder for ease

Step 4: Finally let execute the python script against our 'batterstats.txt' as input as show below

python historian.py batterystats.txt > batterystats.html

This will create 'battertstats.html' fig.1 which we can use to analyse the battery usage as shown HERE.

fig.1

Read More

Android Data binding

Description: In this post I'm gonna illustrate concept of 'Data Binding' in android. So straight away.

Let's get started.

'DataBinding' in android was introduced as an effort to coupled the model i.e data directly into the view, thereby eliminating findViewById()  at much larger extend. Although its not limited to this and can help to remove lots of boilerplate code thereby. Its the direct roadway to implement MVVM pattern in our apps.

Prerequisite:

1. Add below snippets into your 'Module' build.gradle within 'android' section

    dataBinding {
        enabled true
       }

2. Now just add below line within the your 'Project'  build.gradle within 'dependencies' section.
Note: The gradle plugin should be greater or equals v1.5 +

 classpath 'com.android.tools.build:gradle:1.5.0 

Let's start with simple example of how to eliminate findViewById in activity.

1. Eliminate findViewById();

Step 1: Simply create a model with a field name as 'title' and also the POJO for the same.

public class SingleModel {

    private String title;

    public SingleModel() {
    }

    public String getTitle() {
        return title;
    }

    public void setTitle(String title) {
        this.title = title;
    }
}

Step 2: In our activity_main.xml wrap your parent layout within '<layout> ...< /layout>' . As shown below. Create a <data> ...</data> tag with <variable>...</variable> to access its model variables

   <layout xmlns:android="http://schemas.android.com/apk/res/android">

    <data>
        <variable
            name="single"
            type="com.code2concept.databinding.models.SingleModel"/>
    </data>

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerInParent="true"
            android:text="@{single.getTitle()}"/>
    </RelativeLayout>
</layout>

Note: 1. Once you have created a variable into <layout> apt builds the binding file name BR.java(similar concept what R.java does) which and other binding functions.

Step 3: Lets integrate in our MainActivity. 

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        ActivityMainBinding mainActivity = DataBindingUtil.setContentView(this, R.layout.activity_main);

        SingleModel singleModel = new SingleModel();
        singleModel.setTitle("Wow ! Data binding is awesome");
        mainActivity.setVariable(BR.single, singleModel);

    }
}

Bingo ! we have integrated databinding in our app

2. Handle click.

Step 1: Create a <variable> ... </variable> tag with name and type as shown below.

Note: Type can be created from separate class as well. We're gonna implement onClick in Activity.

<layout xmlns:android="http://schemas.android.com/apk/res/android">
    <data>
        <variable
            name="single"
            type="com.code2concept.databinding.models.SingleModel"/>

        <variable
            name="singleClick"
            type="com.code2concept.databinding.MainActivity"/>

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerInParent="true"
            android:onClick="@{singleClick.onClick}"
            android:text="@{single.getTitle()}"/>
    </RelativeLayout>
</layout>

    

Step 2: Finally bind the singleClick to the activity as shown below.

public class MainActivity extends AppCompatActivity implements View.OnClickListener {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        ActivityMainBinding mainActivity = DataBindingUtil.setContentView(this, R.layout.activity_main);

        SingleModel singleModel = new SingleModel();
        singleModel.setTitle("Wow ! Data binding is awesome");
        mainActivity.setVariable(com.code2concept.databinding.BR.single, singleModel);

        //bind click to the  activity
        mainActivity.setSingleClick(this);
    }

    @Override
    public void onClick(View view) {
        Toast.makeText(this, "Single Model view is clicked", Toast.LENGTH_SHORT).show();
    }
}

Great, we have handled onClick event as well

Question: what happens when the content of the view need to be changed in the runtime?.
No need to worry 'DataBinding' helps us effortlessly.

3. NotifyChangeProperty

Step1: Add @Bindable annotation to the getters and notifyPropertyChanged() to the setters as shown below.

public class SingleModel extends BaseObservable {

    private String title;


    @Bindable
    public String getTitle() {
        return title;
    }

    public void setTitle(String title) {
        this.title = title;
        notifyPropertyChanged(BR.title);
    }
}

Step 2: Finally lets change our title on onClick. fig.1

public class MainActivity extends AppCompatActivity implements View.OnClickListener {

    private SingleModel singleModel;
    private ActivityMainBinding mainActivity;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        mainActivity = DataBindingUtil.setContentView(this, R.layout.activity_main);

        singleModel = new SingleModel();
        singleModel.setTitle("Wow ! Data binding is awesome");
        mainActivity.setVariable(BR.singleModel, singleModel);

        //bind click to the  activity
        mainActivity.setSingleClick(this);
    }

    @Override
    public void onClick(View view) {
        singleModel.setTitle("Title is changes successfully");
    }
}

fig.1

Awesome, finally we have integrated databinding in our project ;-). Part 2 coming soon

Read More

Tips & tricks android developer should know - part 2

Description: In the post we'll continue the legacy of  Part 1 :-) . Below are some tips and tricks which would come much handy and useful during our app development cycle.

So lets get started :-)

Note : If you have missed part 1. Please refer here

1. Capture or record screen without any external app.

Often we require to take snapshot of the app's screen or even record a video to show some features to colleagues or QA or Client . It comes handy very often.

Step 1: Simply connect your device. Open Android Monitor from android studio you'll see as fig.1.

fig.1

Step 2: Now, you can open your app and click on the camera icon from android monitor located  to the extreme top-left corner to capture any screen you want. Bingo !!!

For video: Click video icon below the camera icon. Enter the resolution with multiples of 16x. fig.2. That's it. It'll start recording your action's on the app.

fig.2

2. How to find layout boundaries?

Layout boundaries are very useful when we develop our UI components. It gives a real sense to layout, thereby letting us to study arrangement of different widgets in the layout.

Step 1: Open Settings --> Developer Options --> Show layout boundaries. From drawing section

fig.3.LinkedIn app

fig.3. A Simple analysis for pencil icon. (without opening our layout)

1. Edit pencil icon has some padding to itself. 

2. Its align to top-right corner to its parent layout.

Really awesome.

3. Simplest way to decode obfuscated code?

As we know, code are obfuscated when we build our apk with proguard enabled. We often come in contact with obfuscated code in our app while debugging the stacktrace of the crashes.

So decoding is very much needed to study the stackstrace. Android build's a file called as "mapping.txt" which serves as the key ingredient to decode, in combination of "retrace".

In Windows

Step 1: Go to  (android-studio-install-dir-path)\tools\proguard\bin  open "proguardgui.bat"  fig.4

fig.4

Step 2: Click on "ReTrace" fig.5. and upload your "mapping.txt" file from app/build/outputs/mapping/.../mapping.txt   and the obfuscated code file (e.g: crash.txt). You can also simply paste the stackstrace in the box provided.

Note: If you do not find mapping.txt. You have to generate a signed apk with proguard enabled("minifyenabled true" within the app's build.gralde).

fig.5

You can also use command line code to do that.

\tool\proguard\bin> retrace.bat -verbose   (path_to_mapping.txt)\mapping.txt  (path_to_stacktrace)\crash.txt

Thus just applying some simple tricks and tips really make a difference in the speed of development. 

For more updates follow us on -  Twitter

#codingIsAnArt
#coderconsole

Read More

How to create google chrome extension in 3 simple steps?

Description: In this post I'm gonna show you 3 simple steps to create your own google chrome extension.You can simply follow the steps with tips and note listed in between the post.

So lets get started.

Step 1: Create a folder namely('chrome_extension_demo') with 4 files in it index.html, main.js, manifest.json & extension.css.

Step 2: Lets add code into above files.
Tip: you can simply open the folder in any editor like(Sublime or Notepad++ for ease to write code)

• index.html(contains our basic html code with few buttons on it)

<html>
<head>
 <title>Code2Concept extension demo</title>
 <script src="main.js"></script>
 <link rel="stylesheet" type="text/css" href="extension.css">
</head>
<body background="bg.png">
 <h1 align="center" id="code2concept"><a href=""><font color="white">Code2Concept</font></a></h1>
 <center>
  <div class="buttonContainer">
   <div>
    <button id="home" class="button">Home</button>
    <br/>
    <br/>
   </div>
   <div >
    <button id="twitter" class="button">Twitter</button>
    <br/>
    <br/>
   </div>
   <div>
    <button id="my_linkedin" class="button">My LinkedIn</button>
    <br/>
    <br/>
   </div>
   <div>
    <button id="stackoverflow" class="button">Stackoverflow</button>
    <br/>
   </div>
  </div>
  <hr/>
  <h5> <font color="white">This is the demo to create google chrome extension.</font></h5>
 </center>
</body>
</html>

• manifest.json(simple json file which is needed by chrome to add extension)

{
  "manifest_version": 2,

  "name": "Code2Concept extension demo",
  "description": "This is the Code2Concept extension to demostrate chrome extension",
  "version": "1.0",

  "background":{
  "scripts": ["main.js"]
  },
  
  "browser_action": {
   "default_icon": "icon.png",
   "default_popup": "index.html"
  },
  "permissions": [
   "activeTab"
   ]
}

• main.js(javascript code to add listener to our buttons)

document.addEventListener('DOMContentLoaded', function() {

 //home
  var home = document.getElementById('home');
  home.addEventListener('click', function() { 
    openUrl('http://bit.ly/1LqS9ku');
  }, false);

   //twitter
  var twitter = document.getElementById('twitter');
  twitter.addEventListener('click', function(){
    openUrl('http://bit.ly/20XuV1K');
  }, false)

  //stackoverflow.
  var stackoverflow = document.getElementById('stackoverflow');
  stackoverflow.addEventListener('click', function(){
   openUrl('http://bit.ly/1olt4D5');
  }, false)

//my linkedIn public dir.
  var my_linkedin = document.getElementById('my_linkedin');
  my_linkedin.addEventListener('click', function(){
   openUrl('http://bit.ly/1Tn6BBJ');
  }, false)


  //open url function in new tab
  function openUrl(newURL) {
    chrome.tabs.create({ url: newURL});
  }

}, false);

• extension.css(css for buttons)

.button {
 border: 1px solid #13cbbb;
    border-radius: 3px;
    color: #FFFFFF;
    display: inline-block;
    float: center;
    font-size: 12px;
    margin-right: 3.2%;
    background-color: #13cbbb;
    padding: 7px 4.0%;
    width: 100px;
    min-width: 100px;
    max-width: 100px;
}
.button:hover {
 background-color:#13cbbb;
 opacity: 0.7;
}
.button:active {
 position:relative;
 top:1px;
}

.buttonContainer{
    width: 160px;
}

Note: You can download bg.png from here  and  icon.png  from here and place in the folder created in step 1:

Step 3: The most important step is how to add our code in chrome browser. Open chrome settings from hamburger icon on the right of  browser. Settings --> extensions --> load unpacked extension(select your folder created instep 1) --> fig.1

Finally you'll see the your extension add to the chrome as shown in fig.2.

fig.2

• If you find some issue implementing simply download and follow step 3.

• To upload on chrome web store go here since we have developed this into developer mode.

Bingo!!! you have created your first chrome extension successfully.

Read More

Tips & Tricks android developer should know - part 1

Description: In this post I'm gonna demonstrate and show you some tips and tricks which really gonna help to solve some common problems while app development & help increase the speed as well.

So lets get started :-)

1. How to run app on phone without USB cord.(need USB initially to make connection)

Step 1: Connect the device with cord into your system. Ensure that USB debugging is enabled from Developer options. Open cmd(windows) or Terminal(linux) run the command. You'll find the connected device.

adb kill-server && adb devices

Step 2: Run the next command to restart in tcp mode on port 5555

adb tcpip 5555

Step 3: Now disconnect your device from system and note down your ip address of the phone from Setting > About Phone > Status. It could be something like 192.168.0.3.(ip address) Now the run the final command by replacing with your ip address

adb connect 192.168.0.3:5555

Bingo we're done now your devices is connected and you can run it wirelessly :-)

2. How to find SHA1 key from android studio?

SHA1 key is needed in many different app containing maps or social sites authentication or using any google apis and services.Its super usefull. So the simplest way to get that is using android studio.

Step 1: Select the Gradle projects from the right pane and expand Tasks > android > signingReport. (fig.1).

Note: If you do not find your project in Gradle projects sync the project from android studio.

fig.1

Thats it you'll see the SHA1 for our project all the listed at once. Really awesome.

3. Best way to create icons for android app using vector asset.

Many a times in our development we need icons for small things with varied color or shape. Using Vector Asset in android studio we can create our icons with super ease.

Step 1: Right click on app > New > Vector Asset you'll see fig.3. You can choose Material Icons which contains whole lot of icons in different categories.This will create <vector> for the icon  you have selected. (fig.4) in drawable folder

fig.3

Vector Asset for the icon

fig.4

Step 2: Awesome now just we can simply set to background or src of ImageView and other widgets.

Note:
Do checkout how to restore deleted app icons on JoyOfAndroid


Thus just applying some simple tricks and tips really make a difference in the speed of development.

For more updates follow us on -  Twitter

#codingIsAnArt
#coderconsole

Read More

How to schedule script in windows Vista 7,8 or 10 ?

Description: In this post I'm gonna show how we can schedule a script using windows task scheduler for Windows vista, 7 ,8 or 10 ?

So lets get started:

Step 1: Create a file with .vbs extension with below line of code in it.

window = msgbox("Code2Concept demo for script scheduling", 39, "Info")

This is to display our message box when our trigger get fired as per our schedule

Step 2: Open Task Scheduler (fig.1) by searching in windows search or from control panel

fig.1

Step 3: Create new Task (fig.2)with name and description.

fig.2

Step 4: Lets browse and add our script created in Step 1:  from Action tab. Also add Triggers as time to schedule the script to run. (fig.3 & fig.4 respectively).

fig.4

fig.5

Output:

Bingo !!! We are done. You can now view your dialog at specific schedule interval

Read More