Redes Sociais

 Como usar ViewFlipper para diminuir as Activities

16 de outubro de 2019
Como usar ViewFlipper para diminuir as Activities

Nesse tutorial vou descrever Como usar ViewFlipper para diminuir as Activities afinal às vezes precisamos de um aplicativo mais ágil.

Primeiramente vamos criar um projeto vazio(Empty) para começar a programar.

Vamos criar mais 2(dois) layouts(Layout resource file) porque eles vão ser procados no nosso ViewFlipper.

O nome de nossas duas activities vão ser content_entrada1 e content_entrada2.

Os novos layouts devem conter o código conforme o seguinte.

content_entrada_1

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:app="http://schemas.android.com/apk/res-auto">
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        android:layout_margin="20dp"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toBottomOf="parent">
        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="Digite algum texto"
            android:textSize="20sp"
            android:gravity="center"/>
        <EditText
            android:id="@+id/etEnt1"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"/>
        <Button
            android:id="@+id/btnEnt1"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="Enviar"/>
        <TextView
            android:id="@+id/tvResp1"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="Resposta do content 2"
            android:textSize="20sp"
            android:gravity="center"
            android:layout_marginTop="30dp"/>
    </LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>

content_entrada_2

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:app="http://schemas.android.com/apk/res-auto">
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        android:layout_margin="20dp"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toBottomOf="parent">
        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="Digite algum texto"
            android:textSize="20sp"
            android:gravity="center"/>
        <EditText
            android:id="@+id/etEnt2"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"/>
        <Button
            android:id="@+id/btnEnt2"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="Enviar"/>
        <TextView
            android:id="@+id/tvResp2"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="Resposta do content 1"
            android:textSize="20sp"
            android:gravity="center"
            android:layout_marginTop="30dp"/>
    </LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>

Logo após ficar pronta nossos layouts vamos então programar a MainActivity que é onde tudo vai acontecer.

Vamos fazer o layout da MainActivity chamado de activity_main conforme descrito a seguir para que seja incluido os dois outros layouts e também um menu para trocar de layout com o ViewFlipper.

activity_main

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <ViewFlipper
        android:id="@+id/vf"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toTopOf="@+id/layMenu">
        <include layout="@layout/content_entrada_1"/>
        <include layout="@layout/content_entrada_2"/>
    </ViewFlipper>
    <LinearLayout
        android:id="@+id/layMenu"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        app:layout_constraintBottom_toBottomOf="parent">
        <Button
            android:id="@+id/btnMenu1"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:text="Content 1"
            android:layout_weight="1"/>
        <Button
            android:id="@+id/btnMenu2"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:text="Content 2"
            android:layout_weight="1"/>
    </LinearLayout>

</androidx.constraintlayout.widget.ConstraintLayout>

Então agora é a hora de programar nosso aplicativo para que ele envie a mensagem de um layout para o outro e troque o texto.

É bem simples a programação para isso porque apenas utilizamos uma Activity.

MainActivity

package br.com.uware.viewflipper

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import kotlinx.android.synthetic.main.activity_main.*
import kotlinx.android.synthetic.main.content_entrada_1.*
import kotlinx.android.synthetic.main.content_entrada_2.*

class MainActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        // Animação do ViewFlipper
        vf.setOutAnimation(applicationContext, android.R.anim.fade_out)
        vf.setInAnimation(applicationContext, android.R.anim.fade_in)

        btnMenu1.setOnClickListener {
            vf.displayedChild = 0
        }
        btnMenu2.setOnClickListener {
            vf.displayedChild = 1
        }

        btnEnt1.setOnClickListener {
            tvResp2.text = etEnt1.text
        }
        btnEnt2.setOnClickListener {
            tvResp1.text = etEnt2.text
        }
    }
}

O ViewFlipper também é bastante utilizado com imagens e swipe gestures, além disso também podemos utilizar com outros recursos.

Enfim espero poder ter ajudado com esse tutorial Como usar ViewFlipper para diminuir as Activities.

Leia em seguida o nosso tutorial sobre Como usar um Spinner e ArrayAdapter com Kotlin.


Tags:


Desenvolvedor Web e Android ( Kotlin e Java )


Posts relacionados: