[Tutorial] Learn to parse HTML Pages on Android with JSoup - Android Software Development

Hello,
I create that thread to offer you a tutorial learning you to parse HTML pages on Android by using the JSoup Library. You can also discover this tutorial in video on Youtube :
When you make Android applications, you can have to parse HTML data or HTML pages got from the Web. One of the most known solution to make that in Java is to use JSoup Library. Like said on the official website of JSoup : "It is a Java library for working with real-world HTML. It provides a very convenient API for extracting and manipulating data, using the best of DOM, CSS, and jquery-like methods."
JSoup can be used in Android applications and we're going to study how to parse an HTML Page on Android with JSoup.
First, you need to add the JSoup dependency in your Gradle build file :
Code:
compile 'org.jsoup:jsoup:1.10.1'
For our example, we are going to download the content of the SSaurel's Blog and display all the links of the main page. To download the content of a website, JSoup offers the connect method and then a get method. This last method works synchronously. So, we should call these methods in a separated Thread. Our application will have just a simple layout with a Button to launch the download of the website and a TextView to display the links.
It will have the following form :
Code:
<?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:id="@+id/activity_main"
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="com.ssaurel.jsouptut.MainActivity">
<Button
android:id="@+id/getBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Get website"
android:layout_marginTop="50dp"
android:layout_centerHorizontal="true"/>
<TextView
android:id="@+id/result"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Result ..."
android:layout_centerHorizontal="true"
android:layout_marginTop="30dp"
android:layout_below="@id/getBtn"
android:textSize="17sp"/>
</RelativeLayout>
In the main Activity of the application, we are going to get instances of the Button and the TextView from our layout. Then, we set a click listener on the Button to start the download of the website when the user will click it.
In the getWebsite() method, we create a new Thread to download the content of the website. We use the connect() method of the Jsoup object to connect the application to the website, then we call the get() method to download the content. These calls return a Document object instance. We have to call the select() method of this instance with the query to get all the links of the content. This query returns an Elements instance and finally, we have just to iterate on the elements contained in this object to display the content of each link to the screen.
At the end of our separated Thread, we refresh the UI with the links got from the website. This refresh is embedded inside a runOnUiThread call because it's forbidden to refresh the UI elements inside a separated thread.
The code of the MainActivity has the following form :
Code:
package com.ssaurel.jsouptut;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.Button;
import android.widget.TextView;
import org.jsoup.Jsoup;
import org.jsoup.nodes.Document;
import org.jsoup.nodes.Element;
import org.jsoup.select.Elements;
import java.io.IOException;
public class MainActivity extends AppCompatActivity {
private Button getBtn;
private TextView result;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
result = (TextView) findViewById(R.id.result);
getBtn = (Button) findViewById(R.id.getBtn);
getBtn.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
getWebsite();
}
});
}
private void getWebsite() {
new Thread(new Runnable() {
@Override
public void run() {
final StringBuilder builder = new StringBuilder();
try {
Document doc = Jsoup.connect("http://www.ssaurel.com/blog").get();
String title = doc.title();
Elements links = doc.select("a[href]");
builder.append(title).append("\n");
for (Element link : links) {
builder.append("\n").append("Link : ").append(link.attr("href"))
.append("\n").append("Text : ").append(link.text());
}
} catch (IOException e) {
builder.append("Error : ").append(e.getMessage()).append("\n");
}
runOnUiThread(new Runnable() {
@Override
public void run() {
result.setText(builder.toString());
}
});
}
}).start();
}
}
Last step is to run the application and to enjoy the final result with all the links of the SSaurel's blog displayed on the screen :
{
"lightbox_close": "Close",
"lightbox_next": "Next",
"lightbox_previous": "Previous",
"lightbox_error": "The requested content cannot be loaded. Please try again later.",
"lightbox_start_slideshow": "Start slideshow",
"lightbox_stop_slideshow": "Stop slideshow",
"lightbox_full_screen": "Full screen",
"lightbox_thumbnails": "Thumbnails",
"lightbox_download": "Download",
"lightbox_share": "Share",
"lightbox_zoom": "Zoom",
"lightbox_new_window": "New window",
"lightbox_toggle_sidebar": "Toggle sidebar"
}
Don't hesitate to try JSoup on your Android application and give me your feedbacks on this tutorial.
Thanks.
Sylvain

Related

Assistance with zRam configuration

I am the developer of the Bionx Catalsyt rom for the Droid Razr and I need some assistance with my toolkit I have developed for my rom (Its open sourced if youd like to contribute) I am relatively new to android app develoment so bare with me.
I need some assistance with zRAM configurations or a dev with some experience with it. I needed zRAM configurations for optimizing kernel usage on the Droid Razr to improve performance so I Ported the zRAM configurations from the CM10 Android Settings in my toolkit which led to me bringing over the Android System Properties (Reflected) and Utils Class for it to function correctly. 2 options are available to users. Configuration which gives users 4 options to choose from (disabled, 10%, 18%, 26%) and the option to enable zRAM or "Purge Memory". When I set a value, it seems not to "stick" or take affect but toggling Purge Settings does take affect. If i looked at a logcat, what values or what exactly would i be searching for to correct this feature or make sure it is taking affect or working at all?
and can any dev take a look at the code and see if I screwed anything up or miss writ something. (I didnt really change anything when it came from cm10, just wanting to port it to be useable on a stock based rom or AOSP)
Source
https://github.com/rgocal/app_packages_BionxDashboard.git
src/com/android/ZRAMconfig is the located class
src/android/os/ is location of imports needed
First, keep in mind you need a kernel with zRam support for those settings to work.
To set the zRam compression to the desired level (let's take 64mb as an example), you want to do something like this in a terminal :
Code:
su
busybox mkswap /dev/block/zram0
busybox swapon /dev/block/zram0
echo $((1024*1024*64)) > /sys/block/zram0/disksize [COLOR="Green"]// Replace 64 with the desired compression level[/COLOR]
So in java, this would translate to something like this :
A simple layout with an EditText for the user to input the desired zRam compression level & a Button to apply the value :
zram.xml
Code:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/ll"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<EditText
android:id="@+id/userInput"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="48dp"
android:layout_marginRight="48dp"
android:layout_marginTop="32dp"
android:ellipsize="end"
android:hint="Enter zRam Compression Level"
android:inputType="number" />
<Button
android:id="@+id/apply"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginTop="8dp"
android:text="Apply"
android:textColor="#33b5e5" />
</LinearLayout>
The corresponding java Class :
Zram.java
Code:
package com.rgocal.zram.settings;
import java.io.DataOutputStream;
import java.io.IOException;
import android.app.Activity;
import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;
import android.widget.EditText;
import android.widget.Toast;
public class Zram extends Activity implements OnClickListener {
private EditText input;
private Button apply;
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.zram);
input = (EditText) findViewById(R.id.userInput);
apply = (Button) findViewById(R.id.apply);
apply.setOnClickListener(this);
}
@Override
public void onClick(View v) {
int value = Integer.parseInt(input.getText().toString());
// Arbitrary value, I don't know the maximum zRam compression (if
// there's one)
if (value > 200) {
Toast.makeText(
this,
"The value you entered is too high and may cause problems! Please reduce it",
Toast.LENGTH_SHORT).show();
} else {
try {
Process process = null;
process = Runtime.getRuntime().exec("su");
DataOutputStream os = new DataOutputStream(
process.getOutputStream());
os.writeBytes("busybox mkswap /dev/block/zram0" + "\n");
os.writeBytes("busybox swapon /dev/block/zram0" + "\n");
os.writeBytes("echo $((1024*1024*" + value
+ ")) > /sys/block/zram0/disksize" + "\n");
os.writeBytes("exit\n");
os.flush();
process.waitFor();
Log.v("zRam", "Compression level set to " + value);
} catch (IOException e) {
e.printStackTrace();
} catch (InterruptedException e) {
e.printStackTrace();
}
}
}
}
Your AndroidManifest.xml :
Code:
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="com.rgocal.zram.settings.Zram"
android:versionCode="1"
android:versionName="1.0" >
<uses-sdk
android:minSdkVersion="8"
android:targetSdkVersion="17" />
<uses-permission android:name="android.permission.ACCESS_SUPERUSER" />
<application
android:allowBackup="true"
android:icon="@drawable/ic_launcher"
android:label="zRam Settings"
android:theme="@style/AppTheme" >
<activity
android:name="com.rgocal.zram.settings.Zram"
android:label="zRam Settings" >
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>
</manifest>
The resulting apk : http://168.144.134.166/downloads/zRamSettings.apk
Screenshot :
{
"lightbox_close": "Close",
"lightbox_next": "Next",
"lightbox_previous": "Previous",
"lightbox_error": "The requested content cannot be loaded. Please try again later.",
"lightbox_start_slideshow": "Start slideshow",
"lightbox_stop_slideshow": "Stop slideshow",
"lightbox_full_screen": "Full screen",
"lightbox_thumbnails": "Thumbnails",
"lightbox_download": "Download",
"lightbox_share": "Share",
"lightbox_zoom": "Zoom",
"lightbox_new_window": "New window",
"lightbox_toggle_sidebar": "Toggle sidebar"
}
I uploaded the full code on my github to make it easier for you to grab it : https://github.com/Androguide/zRamSettings
Hope this gets you going, good luck
Androguide.fr said:
First, keep in mind you need a kernel with zRam support for those settings to work.
[*]The resulting apk : http://168.144.134.166/downloads/zRamSettings.apk
[*]Screenshot :
[/LIST]
I uploaded the full code on my github to make it easier for you to grab it : https://github.com/Androguide/zRamSettings
Hope this gets you going, good luck
Click to expand...
Click to collapse
Like a boss! Thanks!
Our kernel supports zRAM configurations with limitation but with Kexec support, we have more options so I needed some options for both ways
Update: Integrated this activity as a preference screen in my current zRAM configurations so now I have support both ways. Noticed your comment of how we dont know how to calculate a max/min RAM value so I'm looking for that value currently. Now all I need is to find a way to allow the activity to detect whether or not the device supports zRAM configurations and prevent the user from having this options if it isnt so it doesnt apply blank values.

[GUIDE][NOOB Friendly][HOW-TO]Simple Calculator App

HOW-To Make A Simple Android Calculator​
How To Make A Simple Calculator
Step 1
. Select Create New Android Application
{
"lightbox_close": "Close",
"lightbox_next": "Next",
"lightbox_previous": "Previous",
"lightbox_error": "The requested content cannot be loaded. Please try again later.",
"lightbox_start_slideshow": "Start slideshow",
"lightbox_stop_slideshow": "Stop slideshow",
"lightbox_full_screen": "Full screen",
"lightbox_thumbnails": "Thumbnails",
"lightbox_download": "Download",
"lightbox_share": "Share",
"lightbox_zoom": "Zoom",
"lightbox_new_window": "New window",
"lightbox_toggle_sidebar": "Toggle sidebar"
}
Creating XML For Layout
To create a calculator first we need to create the layout of the calculator.
Layout is created using XML file given below
Copy This To Your “activity_main” (Note- If you named the layout activity main or something else please change it to activity_main or it will give a couple of errors)
Code:
<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" >
<EditText
android:id="@+id/result_id"
android:layout_width="fill_parent"
android:layout_height="120dp"
/>
<Button
android:id="@+id/Btn7_id"
android:layout_width="70dp"
android:layout_height="60dp"
android:layout_below="@id/result_id"
android:text="7"
android:onClick="btn7Clicked"
/>
<Button
android:id="@+id/Btn8_id"
android:layout_width="70dp"
android:layout_height="60dp"
android:layout_below="@id/result_id"
android:layout_toRightOf="@id/Btn7_id"
android:text="8"
android:onClick="btn8Clicked"
/>
<Button
android:id="@+id/Btn9_id"
android:layout_width="70dp"
android:layout_height="60dp"
android:layout_below="@id/result_id"
android:layout_toRightOf="@id/Btn8_id"
android:text="9"
android:onClick="btn9Clicked"
/>
<Button
android:id="@+id/Btnclear_id"
android:layout_width="90dp"
android:layout_height="60dp"
android:layout_below="@id/result_id"
android:layout_toRightOf="@id/Btn9_id"
android:text="clear"
android:onClick="btnclearClicked"
/>
<Button
android:id="@+id/Btn4_id"
android:layout_width="70dp"
android:layout_height="60dp"
android:layout_below="@id/Btn7_id"
android:text="4"
android:onClick="btn4Clicked"
/> <Button
android:id="@+id/Btn5_id"
android:layout_width="70dp"
android:layout_height="60dp"
android:layout_below="@id/Btn8_id"
android:layout_toRightOf="@id/Btn4_id"
android:text="5"
android:onClick="btn5Clicked"
/> <Button
android:id="@+id/Btn6_id"
android:layout_width="70dp"
android:layout_height="60dp"
android:layout_below="@id/Btn9_id"
android:layout_toRightOf="@id/Btn5_id"
android:text="6"
android:onClick="btn6Clicked"
/>
<Button
android:id="@+id/Btnplus_id"
android:layout_width="90dp"
android:layout_height="60dp"
android:layout_below="@id/Btnclear_id"
android:layout_toRightOf="@id/Btn6_id"
android:text="+"
android:onClick="btnplusClicked"
/>
<Button
android:id="@+id/Btn1_id"
android:layout_width="70dp"
android:layout_height="60dp"
android:layout_below="@id/Btn4_id"
android:text="1"
android:onClick="btn1Clicked"
/>
<Button
android:id="@+id/Btn2_id"
android:layout_width="70dp"
android:layout_height="60dp"
android:layout_below="@id/Btn5_id"
android:layout_toRightOf="@id/Btn1_id"
android:text="2"
android:onClick="btn2Clicked"
/>
<Button
android:id="@+id/Btn3_id"
android:layout_width="70dp"
android:layout_height="60dp"
android:layout_below="@id/Btn6_id"
android:layout_toRightOf="@id/Btn2_id"
android:text="3"
android:onClick="btn3Clicked"
/>
<Button
android:id="@+id/Btnminus_id"
android:layout_width="90dp"
android:layout_height="60dp"
android:layout_below="@id/Btnplus_id"
android:layout_toRightOf="@id/Btn3_id"
android:text="-"
android:onClick="btnminusClicked"
/>
<Button
android:id="@+id/Btnequal_id"
android:layout_width="110dp"
android:layout_height="60dp"
android:layout_below="@id/Btn1_id"
android:text="="
android:onClick="btnequalClicked"
/>
<Button
android:id="@+id/Btndivide_id"
android:layout_width="90dp"
android:layout_height="60dp"
android:layout_below="@id/Btn1_id"
android:layout_toRightOf="@id/Btnequal_id"
android:text="/"
android:onClick="btndivideClicked"
/>
<Button
android:id="@+id/Btnmulti_id"
android:layout_width="90dp"
android:layout_height="60dp"
android:layout_below="@id/Btnminus_id"
android:layout_toRightOf="@id/Btndivide_id"
android:text="*"
android:onClick="btnmultiClicked"
/>
</RelativeLayout>
The Graphical Layout Will look Like this
Then You have to Make The Buttons work and calculate your numbers
Simply find your MainActivity.java (It Is place under package name)
Copy This to your java file :
Code:
package com.dc.simplecalculator;
import android.os.Bundle;
import android.app.Activity;
import android.view.Menu;
import android.view.View;
import android.widget.Button;
import android.widget.EditText;
public class MainActivity extends Activity {
public String str ="";
Character op = 'q';
int i,num,numtemp;
EditText showResult;
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
showResult = (EditText)findViewById(R.id.result_id);
}
public void btn1Clicked(View v){
insert(1);
}
public void btn2Clicked(View v){
insert(2);
}
public void btn3Clicked(View v){
insert(3);
}
public void btn4Clicked(View v){
insert(4);
}
public void btn5Clicked(View v){
insert(5);
}
public void btn6Clicked(View v){
insert(6);
}
public void btn7Clicked(View v){
insert(7);
}
public void btn8Clicked(View v){
insert(8);
}
public void btn9Clicked(View v){
insert(9);
}
public void btnplusClicked(View v){
perform();
op = '+';
}
public void btnminusClicked(View v){
perform();
op = '-';
}
public void btndivideClicked(View v){
perform();
op = '/';
}
public void btnmultiClicked(View v){
perform();
op = '*';
}
public void btnequalClicked(View v){
calculate();
}
public void btnclearClicked(View v){
reset();
}
private void reset() {
// TODO Auto-generated method stub
str ="";
op ='q';
num = 0;
numtemp = 0;
showResult.setText("");
}
private void insert(int j) {
// TODO Auto-generated method stub
str = str+Integer.toString(j);
num = Integer.valueOf(str).intValue();
showResult.setText(str);
}
private void perform() {
// TODO Auto-generated method stub
str = "";
numtemp = num;
}
private void calculate() {
// TODO Auto-generated method stub
if(op == '+')
num = numtemp+num;
else if(op == '-')
num = numtemp-num;
else if(op == '/')
num = numtemp/num;
else if(op == '*')
num = numtemp*num;
showResult.setText(""+num);
}
}
Next Step!
Testing Your App, Fingers Crossed
Simply Click On Run>Run As Android Application
Congo! You Just Made A Simple Calc App……
Exporting Your App
Open Android Manifest.xml
Select use Export Wizard
That’s All….
If you have any queries post in this thread I will try my best to solve it…
Sucess!
Have A Good Day!
​
Reserved

[Tutorial] Create a Blur Effect on Android with RenderScript

Hello,
I create that thread to present you a tutorial aiming to learn you how to create a Blur Effect on Android with the RenderScript Library. You can discover the tutorial in video on Youtube too :
Create a Blur Effect on Android with RenderScript
In image processing, a Blur Effect, also known as Gaussian Blur, is the result of blurring an image by applying a Gaussian function. The Blur Effect is widely used in graphics software. In that tutorial, you're going to learn how to apply a Blur Effect on Android by using the RenderScript Library.
1. Configure your environment to use RenderScript
First step is to configure your development environment to enable RenderScript in your Android project. Note that your need the following Android SDK using these APIs:
Android SDK Tools revision 22.2 or higher
Android SDK Build-tools revision 18.1.0 or higher
You need to open your build.gradle and then add the following RenderScript properties :
Code:
android {
compileSdkVersion 23
buildToolsVersion "23.0.3"
defaultConfig {
minSdkVersion 9
targetSdkVersion 19
renderscriptTargetApi 18
renderscriptSupportModeEnabled true
}
}
2. Implement the Blur Effect with RenderScript
Note that we will use the RenderScript API in V8. This version is located in the android.support.v8.renderscript.* packages. So, be sure to import the correct classes in your code. We are going to create a BlurBuilder class with a static blur method taking the Bitmap to blur and returning the blurred Bitmap. We will use a blur radius constant to define which radius we want to apply on the original image.
Code for the BlurBuilder class should be like that :
Code:
package com.ssaurel.blureffect;
import android.content.Context;
import android.graphics.Bitmap;
import android.support.v8.renderscript.Allocation;
import android.support.v8.renderscript.Element;
import android.support.v8.renderscript.RenderScript;
import android.support.v8.renderscript.ScriptIntrinsicBlur;
/**
* Created by ssaurel on 29/09/2016.
*/
public class BlurBuilder {
private static final float BITMAP_SCALE = 0.6f;
private static final float BLUR_RADIUS = 15f;
public static Bitmap blur(Context context, Bitmap image) {
int width = Math.round(image.getWidth() * BITMAP_SCALE);
int height = Math.round(image.getHeight() * BITMAP_SCALE);
Bitmap inputBitmap = Bitmap.createScaledBitmap(image, width, height, false);
Bitmap outputBitmap = Bitmap.createBitmap(inputBitmap);
RenderScript rs = RenderScript.create(context);
ScriptIntrinsicBlur intrinsicBlur = ScriptIntrinsicBlur.create(rs, Element.U8_4(rs));
Allocation tmpIn = Allocation.createFromBitmap(rs, inputBitmap);
Allocation tmpOut = Allocation.createFromBitmap(rs, outputBitmap);
intrinsicBlur.setRadius(BLUR_RADIUS);
intrinsicBlur.setInput(tmpIn);
intrinsicBlur.forEach(tmpOut);
tmpOut.copyTo(outputBitmap);
return outputBitmap;
}
}
Like you can see, we choose to apply a scale on the original bitmap but it's not mandatory. Then, we create a RenderScript instance. The RenderScript V8 API offers us a ScriptIntrinsicBlur class that implements a Blur Effect with RenderScript. We use it with the RenderScript instance in parameter. Then, we need to allocate memory for the input Bitmap and the ouput Bitmap. Last step is to configure the Blur Effect by applying the radius parameter.
Finally, we get the blurred image in result and we returned it.
3. Define images in your main layout
To see our Blur Effect in action, we need to create a layout with two images. The first will be used to show an initial image and the second to show the blurred image. We will use the following layout :
Code:
<?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"
tools:context="com.ssaurel.blureffect.MainActivity">
<ImageView
android:layout_width="256dp"
android:layout_height="256dp"
android:id="@+id/originalImage"
android:layout_marginTop="20dp"
android:layout_centerHorizontal="true"
android:src="@drawable/logo_ssaurel"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/resultImage"
android:layout_below="@id/originalImage"
android:layout_centerHorizontal="true"/>
</RelativeLayout>
4. Apply the Blur Effect
Now, it's time to apply the Blur Effect in the Main Activity of our application :
Code:
package com.ssaurel.blureffect;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.widget.ImageView;
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
ImageView resultImage = (ImageView) findViewById(R.id.resultImage);
Bitmap resultBmp = BlurBuilder.blur(this, BitmapFactory.decodeResource(getResources(), R.drawable.logo_ssaurel));
resultImage.setImageBitmap(resultBmp);
}
}
We get our initial image as a Bitmap with the static method decodeResource of the BitmapFactory class, then we apply the Blur Effect on it. Finally, we set the blurred bitmap on the result image view.
5. Blur Effect Result
Now, you can enjoy the result of your Blur Effect :
{
"lightbox_close": "Close",
"lightbox_next": "Next",
"lightbox_previous": "Previous",
"lightbox_error": "The requested content cannot be loaded. Please try again later.",
"lightbox_start_slideshow": "Start slideshow",
"lightbox_stop_slideshow": "Stop slideshow",
"lightbox_full_screen": "Full screen",
"lightbox_thumbnails": "Thumbnails",
"lightbox_download": "Download",
"lightbox_share": "Share",
"lightbox_zoom": "Zoom",
"lightbox_new_window": "New window",
"lightbox_toggle_sidebar": "Toggle sidebar"
}
Don't hesitate to try to create this Blur Effect and give me your feedbacks.
Thanks.
Sylvain

[Tutorial] Learn to create a BMI Calculator for Android

Hello,
I create that thread to present you a tutorial aiming to learn you how to create a Body Mass Index Calculator for Android. This tutorial is ideal for beginners that want to discover how to create a first application. You can discover the tutorial in video on Youtube :
Create a Body Mass Index Calculator for Android
The Body Mass Index (BMI) or Quetelet index is a value derived from the mass weight and height of an individual. The BMI is defined as the body mass divided by the square of the body height, and is universally expressed in units of kg/m². By analyzing the BMI value, we can determine a diagnostic. First step for the application is to define a layout letting users to enter weight and height values to calculate the BMI index. Besides, we will need a button to launch the BMI calculation and also a TextView to display the result.
The layout will have the following form :
Code:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/activity_main"
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"
android:orientation="vertical"
tools:context="com.ssaurel.bmicalculator.MainActivity">
<TextView
android:text="@string/weight"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:gravity="center_horizontal"
android:layout_marginTop="50dp"
android:textSize="20sp"/>
<EditText
android:id="@+id/weight"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginTop="10dp"
android:ems="6"
android:inputType="number|numberDecimal"
android:textSize="20sp"/>
<TextView
android:text="@string/height"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:gravity="center_horizontal"
android:layout_marginTop="50dp"
android:textSize="20sp"/>
<EditText
android:id="@+id/height"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginTop="10dp"
android:ems="6"
android:inputType="number|numberDecimal"
android:textSize="20sp"/>
<Button
android:id="@+id/calc"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginTop="25dp"
android:onClick="calculateBMI"
android:text="@string/calculateBMI"
/>
<TextView
android:id="@+id/result"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:gravity="center_horizontal"
android:layout_marginTop="25dp"
android:textSize="20sp"/>
</LinearLayout>
Now, we can write the Java code in our Main Activity :
Code:
package com.ssaurel.bmicalculator;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.EditText;
import android.widget.TextView;
public class MainActivity extends AppCompatActivity {
private EditText height;
private EditText weight;
private TextView result;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
height = (EditText) findViewById(R.id.height);
weight = (EditText) findViewById(R.id.weight);
result = (TextView) findViewById(R.id.result);
}
public void calculateBMI(View v) {
String heightStr = height.getText().toString();
String weightStr = weight.getText().toString();
if (heightStr != null && !"".equals(heightStr)
&& weightStr != null && !"".equals(weightStr)) {
float heightValue = Float.parseFloat(heightStr) / 100;
float weightValue = Float.parseFloat(weightStr);
float bmi = weightValue / (heightValue * heightValue);
displayBMI(bmi);
}
}
private void displayBMI(float bmi) {
String bmiLabel = "";
if (Float.compare(bmi, 15f) <= 0) {
bmiLabel = getString(R.string.very_severely_underweight);
} else if (Float.compare(bmi, 15f) > 0 && Float.compare(bmi, 16f) <= 0) {
bmiLabel = getString(R.string.severely_underweight);
} else if (Float.compare(bmi, 16f) > 0 && Float.compare(bmi, 18.5f) <= 0) {
bmiLabel = getString(R.string.underweight);
} else if (Float.compare(bmi, 18.5f) > 0 && Float.compare(bmi, 25f) <= 0) {
bmiLabel = getString(R.string.normal);
} else if (Float.compare(bmi, 25f) > 0 && Float.compare(bmi, 30f) <= 0) {
bmiLabel = getString(R.string.overweight);
} else if (Float.compare(bmi, 30f) > 0 && Float.compare(bmi, 35f) <= 0) {
bmiLabel = getString(R.string.obese_class_i);
} else if (Float.compare(bmi, 35f) > 0 && Float.compare(bmi, 40f) <= 0) {
bmiLabel = getString(R.string.obese_class_ii);
} else {
bmiLabel = getString(R.string.obese_class_iii);
}
bmiLabel = bmi + "\n\n" + bmiLabel;
result.setText(bmiLabel);
}
}
When a user click on the calculate BMI button, the calculateBMI method is called. We get the values entered by the user for the weight and the height. The height is entered in centimeter. For the formula, we need to have a height in meter. So, we divide the value entered by 100. Then, we apply the formula to calculate the BMI :
float bmi = weightValue / (heightValue * heightValue);
With the BMI value, we can display the result on the user interface. We define the displayBMI method for that. To determine the diagnostic associated to the BMI value, we are going to use the following table :
{
"lightbox_close": "Close",
"lightbox_next": "Next",
"lightbox_previous": "Previous",
"lightbox_error": "The requested content cannot be loaded. Please try again later.",
"lightbox_start_slideshow": "Start slideshow",
"lightbox_stop_slideshow": "Stop slideshow",
"lightbox_full_screen": "Full screen",
"lightbox_thumbnails": "Thumbnails",
"lightbox_download": "Download",
"lightbox_share": "Share",
"lightbox_zoom": "Zoom",
"lightbox_new_window": "New window",
"lightbox_toggle_sidebar": "Toggle sidebar"
}
The last step is just to display the BMI value and the diagnostic in the result TextView. After that, you can try the application and enjoy the BMI Calculator in action :
Don't hesitate to try this tutorial and give me your feedbacks.
Thanks.
Sylvain
Hello,
Some users asked me to publish the BMI Calculator Application made in the tutorial.
I made some UI refinements and I published the BMI Calculator on the Google Play Store : https://play.google.com/store/apps/details?id=com.ssaurel.bmicalculator
Don't hesitate to give it a try and give me your feedbacks.
Sylvain

[Tutorial] Learn to use WebSockets on Android with OkHttp

Hello,
I create that post to present you a tutorial aiming to learn you to use WebSockets on Android with OkHttp. Like you should know, WebSocket is a computer communications protocol, providing full-duplex communication channels over a single TCP connection. It is supported in HTML 5. Since the version 3.5 of the OkHttp library, you can also use WebSockets connection in your Android applications. In this tutorial, you are going to learn how to create a simple chat application with the Echo WebSocket Server which is available at the following address : http://www.websocket.org/echo.html .
Note that you can also discover this tutorial in video on Youtube :
First step is to add the OkHttp dependency in your Gradle build file
Code:
compile 'com.squareup.okhttp3:okhttp:3.6.0'
Don’t forget to add the Internet permission in your Android manifest since the application will use the network to create a WebSocket connection to the Echo WebSocket server. For this tutorial, we will need a simple layout with a Button to start the connection and the exchange with the server and a TextView which will be used as a console output for the messages received from the server :
Code:
<?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:id="@+id/activity_main"
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="com.ssaurel.websocket.MainActivity">
<Button
android:id="@+id/start"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:text="Start !"
android:layout_marginTop="40dp"
android:textSize="17sp"/>
<TextView
android:id="@+id/output"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/start"
android:layout_centerHorizontal="true"
android:textSize="16sp"
android:layout_marginTop="30dp"/>
</RelativeLayout>
Then, we can write the Java code of the application. The main part will be the method used to create the connection to the WebSocket connection and the WebSocketListener object used to exchange with the server :
Code:
private final class EchoWebSocketListener extends WebSocketListener {
private static final int NORMAL_CLOSURE_STATUS = 1000;
@Override
public void onOpen(WebSocket webSocket, Response response) {
webSocket.send("Hello, it's SSaurel !");
webSocket.send("What's up ?");
webSocket.send(ByteString.decodeHex("deadbeef"));
webSocket.close(NORMAL_CLOSURE_STATUS, "Goodbye !");
}
@Override
public void onMessage(WebSocket webSocket, String text) {
output("Receiving : " + text);
}
@Override
public void onMessage(WebSocket webSocket, ByteString bytes) {
output("Receiving bytes : " + bytes.hex());
}
@Override
public void onClosing(WebSocket webSocket, int code, String reason) {
webSocket.close(NORMAL_CLOSURE_STATUS, null);
output("Closing : " + code + " / " + reason);
}
@Override
public void onFailure(WebSocket webSocket, Throwable t, Response response) {
output("Error : " + t.getMessage());
}
}
We send messages to the server in the onOpen method. The messages received from the Echo WebSocket server are displayed inside the onMessage method. Note that you can send text or hexadecimal messages. Lastly, we close the connection by using the close method of the WebSocket object. To create the WebSocket connection with OkHttp, we need to build a Request object with the URL of the Echo WebSocket server in parameter, then calling the newWebSocket method of the OkHttpClient object.
The code will have the following form :
Code:
package com.ssaurel.websocket;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.Button;
import android.widget.TextView;
import okhttp3.OkHttpClient;
import okhttp3.Request;
import okhttp3.Response;
import okhttp3.WebSocket;
import okhttp3.WebSocketListener;
import okio.ByteString;
public class MainActivity extends AppCompatActivity {
private Button start;
private TextView output;
private OkHttpClient client;
private final class EchoWebSocketListener extends WebSocketListener {
private static final int NORMAL_CLOSURE_STATUS = 1000;
@Override
public void onOpen(WebSocket webSocket, Response response) {
webSocket.send("Hello, it's SSaurel !");
webSocket.send("What's up ?");
webSocket.send(ByteString.decodeHex("deadbeef"));
webSocket.close(NORMAL_CLOSURE_STATUS, "Goodbye !");
}
@Override
public void onMessage(WebSocket webSocket, String text) {
output("Receiving : " + text);
}
@Override
public void onMessage(WebSocket webSocket, ByteString bytes) {
output("Receiving bytes : " + bytes.hex());
}
@Override
public void onClosing(WebSocket webSocket, int code, String reason) {
webSocket.close(NORMAL_CLOSURE_STATUS, null);
output("Closing : " + code + " / " + reason);
}
@Override
public void onFailure(WebSocket webSocket, Throwable t, Response response) {
output("Error : " + t.getMessage());
}
}
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
start = (Button) findViewById(R.id.start);
output = (TextView) findViewById(R.id.output);
client = new OkHttpClient();
start.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
start();
}
});
}
private void start() {
Request request = new Request.Builder().url("ws://echo.websocket.org").build();
EchoWebSocketListener listener = new EchoWebSocketListener();
WebSocket ws = client.newWebSocket(request, listener);
client.dispatcher().executorService().shutdown();
}
private void output(final String txt) {
runOnUiThread(new Runnable() {
@Override
public void run() {
output.setText(output.getText().toString() + "\n\n" + txt);
}
});
}
}
Finally, you have just to run your application and enjoy the result :
{
"lightbox_close": "Close",
"lightbox_next": "Next",
"lightbox_previous": "Previous",
"lightbox_error": "The requested content cannot be loaded. Please try again later.",
"lightbox_start_slideshow": "Start slideshow",
"lightbox_stop_slideshow": "Stop slideshow",
"lightbox_full_screen": "Full screen",
"lightbox_thumbnails": "Thumbnails",
"lightbox_download": "Download",
"lightbox_share": "Share",
"lightbox_zoom": "Zoom",
"lightbox_new_window": "New window",
"lightbox_toggle_sidebar": "Toggle sidebar"
}
Don't hesitate to give it a try and give me your feedbacks.
Thanks.
Sylvain
Hi want to fetch data on my Android app from bitfinex websocket api. Can you explain how to do it here? In detail would be great and if you don't have time, some general advice would be appreciated too.
Thank you

Categories

Resources