Nesse tutorial vamos criar um app anti Fake News para nos precaver de não repassar informação equivocadas nesse tempo de pandemia do coronavírus que estamos vivendo em 2020! Como vamos fazer isso? Através de Web Scraping! Vamos obter informações corretas das mais recentes noticias direto do site do Ministério da Saúde do Brasil, além dos detalhes sobre a veracidade da noticia também implementaremos o compartilhamentos dessa noticia para outros apps como: Instagram, whatsapp, entre outros…

Na primeira parte do nosso tutorial de Web Scraping com Jsoup no Android Studio em Kotlin vamos implementar um Splash Screen para carregar nossos primeiros dados através de um AsyncTask e chamar a activity que receberá esses dados.

O que você vai aprender:

1. Criar ícone com Image Asset
2. Inserir imagem da logo do app corretamente
3. Criar Splash Screen usando Window Background
4. Criar style e inseri-lo em uma Activity
5. Usar “uses-permission” para acessar INTERNET
6. Como usar a biblioteca Jsoup no Android Studio
7. Como inspecionar código do site para saber onde estão os dados desejados
8. Usar AsyncTask para carregar dados em background e chamar uma nova Activity após a execução

Vamos implementar as dependências necessárias para esse tutorial:

    implementation 'org.jsoup:jsoup:1.13.1'
    implementation 'androidx.recyclerview:recyclerview:1.2.0-alpha02'
    implementation 'androidx.cardview:cardview:1.0.0'
    implementation 'com.squareup.picasso:picasso:2.71828'

Mudar as cores para deixar nosso app com um ar mais sério:

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="colorPrimary">#212E53</color>
    <color name="colorPrimaryDark">#212E53</color>
    <color name="colorAccent">#FFFFFF</color>
</resources>

Precisamos mudar também o icone do app. Mas antes disso vamos excluir os arquivos ic_launcher_background.xml e ic_launcher_foreground.xml no diretório “drawable”. Então clicaremos no diretório “mipmap” com o botão direito do mouse New -> Image Asset:

Mude o background para color e coloque branco:

E o foreground coloque para clip art, escolha o icone “assignment”, ajuste conforme desejar o tamanho e finalize:

Agora vamos adicionar a image da logo do nosso app. Descompacte o arquivo splash e copie as pastas dentro dele.

Clique com o botão direito em cima da pasta “res” e clicar em Paste para colar.

Vamos iniciar a construção do background da Splash Screen, primeiro crie um novo drawable com o nome “splash_background.xml”:

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:drawable="@android:color/white"/>
    <item>
        <bitmap android:gravity="center"
            android:src="@drawable/splash"/>
    </item>

</layer-list>

Agora crie uma nova Activity Empty coloque o nome de “SplashActivity” e desative a opção “Generate Layout File”.

Implementaremos o Window Background para a Splash Screen, assim o background dela aparece quando o app é iniciado sem dar uma tela branca antes (isso acontece por que ao usar um layout comum o background só aparece depois que a Activity é carregada). Para isso criaremos um novo style só para o “SplashActivity”. Nosso arquivo de “styles.xml” ficará com dois styles assim:

<resources>

    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
    </style>

    <!-- Splash theme. -->
    <style name="Splash" parent="Theme.AppCompat.Light.NoActionBar">
        <item name="android:windowBackground">@drawable/splash_background</item>
        <item name="android:windowNoTitle">true</item>
        <item name="windowActionBar">false</item>
        <item name="android:windowFullscreen">true</item>
        <item name="android:windowContentOverlay">@null</item>
    </style>

</resources>

E em fim fazer esse background aparecer no Splash indo no arquivo “AndroidManifest.xml” e colocando um “theme” só para ele. Aproveitaremos e colocaremos uma “uses-permission” para o app poder acessar a INTERNET e tirar o “intent-filter” do MainActivity e colocar no SplashActivity assim ele será a Activity Principal (a que vai abrir primeiro no app) :

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.portfolio.fakenewsalert">

    <uses-permission android:name="android.permission.INTERNET"/>

    <application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:supportsRtl="true"
        android:theme="@style/AppTheme">
        <activity android:name=".SplashActivity"
            android:theme="@style/Splash">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
        <activity android:name=".MainActivity"/>
    </application>

</manifest>

Continuando, vamos iniciar a implementação do código para fazer o Web Scraping. Crie uma classe “News”:

class News (var image: String, var title: String, var details: String)

Para fazer noss Web Scraping precisamos do:

1. Link da pagina onde esta a informação, no nosso caso será do Ministerio da Saúde
2. Inspecionar os elementos aonde estão as informações que desejamos.

Na nossa SplashActivity crairemos uma classe interna do tipo AsyncTask com duas funções :

1. doInBackground: Que fará toda nossa consulta cm Web Scraping assincronamente em background.
2. onPostExcute: Que retornará ou um resultado ou/e uma ação apos o termino de todo o carregamento feito no “doInBackground” (que é nosso caso inial em que vamos chamar o MainActivity).

Como não mandaremos as informações ainda para o MainActivity, usaremos o “Log” para podermos verificar se estamos recebendo as informações no painel Run (em alguns casos pode estar aparecendo no painel Logcat). Como isso acontece com mais detalhes você também pode ver no vídeo do canal!

import android.content.Intent
import android.os.AsyncTask
import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.util.Log
import org.jsoup.Jsoup
import org.jsoup.nodes.Document
import org.jsoup.select.Elements
import java.io.IOException

class SplashActivity : AppCompatActivity() {

    private var loader: AsyncTask<Void, Void, ArrayList<News>>? = null

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)

        loader = LoadInitNews(this)
        loader!!.execute()
    }


    internal class LoadInitNews(var activity: AppCompatActivity?): AsyncTask<Void, Void, ArrayList<News>>(){

        private var news: ArrayList<News> = ArrayList()

        override fun doInBackground(vararg params: Void?): ArrayList<News> {
            try {
                val url = "https://www.saude.gov.br/fakenews?limitstart=0"
                val doc: Document = Jsoup.connect(url).get()
                //get images inside of the div
                val div: Elements = doc.select("div.tileImage")
                //get titles inside of the H2
                val tagHeading: Elements = doc.select("h2.tileHeadline")

                val size: Int = div.size
                for (index in 0..size){
                    //get image link inside tag "img" with attribute src
                    val imgUrl: String = div.select("img").eq(index).attr("src")
                    //get text title inside tag "a"
                    val title: String = tagHeading.select("a").eq(index).text()
                    //get details news link inside tag "a" with attribute "href"
                    val details: String = tagHeading.select("a").attr("href")

                    Log.i("Result", imgUrl + " " + title + " " + details)
                    news.add(New("https://www.saude.gov.br"+imgUrl, title, details))
                }

            }catch (e: IOException){
                e.printStackTrace()
            }
            return news
        }

        override fun onPostExecute(result: ArrayList<News>?) {
            val intent = Intent(activity, MainActivity::class.java)
            activity!!.startActivity(intent)
            activity!!.finish()
        }
    }
}

Bom, esse é o fim da primeira parte do nosso tutorial. Na segunda parte desse tutorial mandaremos os dados para o MainActivity e carregaremos mais dados em tempo real no recyclerview! Não esqueça que se precisar de mais detalhes do passo a passo de como realizar o Web Scraping desse tutorial não deixe de assistir o védio do canal abaixo.