Índice

Introdução
Uso
Atributos

...

Índice

outline	true
exclude	.*ndice
style	none

Objetivo

O objetivo deste guia é mostrar ao usuário como utilizar o componente FluigSdkMediaView e quais os seus atributos.

O FluigSdkMediaView é o principal componente de background personalizado do fluig SDK Android. Este componente deve ser utilizado quando se deseja personalizar o fundo de uma Activity ou Fragment do seu aplicativo.

Este componente é uma subclasse de SurfaceView e, portanto, possui todas as funcionalidades já presentes nesta classe.

...

Bloco de código

collapse

language	xml
title	activity_main.xml		true

<?xml version="1.0" encoding="utf-8"?>
<merge
    xmlns:android="http://schemas.android.com/apk/res/android">
 
    <sdk.fluig.com.ui.components.background.FluigSdkMediaView
        android:layout_width="match_parent"
        android:layout_height="match_parent" />
 
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">
 
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:text="@string/my_text" />
 
    </LinearLayout>

</merge>

Bloco de código

language	java
title	MainActivity.java
collapse	true

import ...
import sdk.fluig.com.ui.components.background.FluigSdkMediaView;

public class MainActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.my_layout);
 
        FluigSdkMediaView mediaView = (...);
        mediaView.setOnLongClickListener(new OnLongClickListener {...});
    }
}

...

Esta seção explica o funcionamento de todos os atributos específicos do FluigSdkMediaView.

Gradient Enabled
Gradient Left Background ColorGradient Right
Background Color End
Image
Solid Color
Video

Nota

Nos XMLs, lembre-se de importar Caso o atributo não seja padrão do SurfaceView, nos XMLs será necessário importar o namespace abaixo.

xmlns:app="http://schemas.android.com/apk/res-auto"

Gradient Enabled

boolean gradientEnabled

Define se o botão usará um gradiente horizontal de duas cores como fundo.

Âncora

	background-color
	background-color

Background Color

int backgroundColor

Atributo padrão do SurfaceView.

Define a cor de fundo do componente. Caso seja usado junto ao backgroundColorEnd, define a cor do lado esquerdo de um gradiente.

Caso não seja definida, a cor padrão utilizada é #ed165a (Image Added)Este atributo pode ser alterado diretamente somente pelo XML. Nas classes Java, basta chamar um dos métodos que alteram a cor do gradiente.

Bloco de código

language	xml
title	example.xml
collapse	true

<sdk.fluig.com.ui.components.background.FluigSdkMediaView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    appandroid:gradient_enabledbackground="true@color/my_left_color" />

Bloco de código

language	java
title	Example.java
collapse	true

FluigSdkMediaView mediaView = (FluigSdkMediaView) findViewById(R.id.my_media_view_id);
 
//para habilitar o gradiente, basta chamar setGradientLeftColor(), setGradientRightColor(), setGradient(), setDefaultGradient()
mediaView.setDefaultGradient();
 
//para desabilitá-lo, basta chamar setSolidColor() ou setDefaultSolidColor()
mediaView.setDefaultSolidColor();

Gradient Left Color

int myLeftColor = ...;
mediaView.setBackgroundColor(myLeftColor);

Âncora

	background-color-end
	background-color-end

Background Color End

int backgroundColorEndint leftColor

Define a cor de fundo do lado esquerdo do direito de um gradiente.

Caso não seja definida, a cor padrão utilizada é #ed165a #f15823 (Image RemovedImage Added).

...

title	Importante

Este atributo é ignorado, caso gradientEnabled não esteja habilitado.

Bloco de código

language	xml
title	example.xml
collapse	true

<sdk.fluig.com.ui.components.background.FluigSdkMediaView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:gradientbackgroundColor_leftColorend="@color/my_leftright_color" />

Bloco de código

language	java
title	Example.java
collapse	true

FluigSdkMediaView mediaView = (FluigSdkMediaView) findViewById(R.id.my_media_view_id);
int myLeftColormyRightColor = ...;
mediaView.setGradientLeftColorsetBackgroundColorEnd(myLeftColor);
 
//é possível alterá-lo com o método setGradient() também
int rightColor = ...;
mediaView.setGradient(myLeftColor, rightColor);

Gradient Right Color

int rightColor

Define a cor de fundo do lado esquerdo do gradiente.

Caso não seja definida, a cor padrão utilizada é #f15823 (Image Removed).

...

title	Importante

myRightColor);

Âncora

	image
	image

Image

Drawable imageDrawable

Define a imagem utilizada como fundo. O componente faz as seguintes modificações na imagem fornecida:

Aplica um clareamento
Desfoca a imagem
Altera o tamanho da imagem para preencher todo o componente, mantendo suas proporções

...

Bloco de código

language	xml
title	example.xml
collapse	true

<sdk.fluig.com.ui.components.background.FluigSdkMediaView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:gradient_rightColorimage="@color@drawable/my_right_colorimage" />

Bloco de código

language	java
title	Example.java
collapse	true

FluigSdkMediaView mediaView = (FluigSdkMediaView) findViewById(R.id.my_media_view_id);
int myRightColor = ...;
mediaView.setGradientRightColor(myRightColormediaView.setImage(R.drawable.my_image);
 
//écaso possíveltenha alterá-louma cominstância o método setGradient() também
int leftColorde Drawable
Drawable myImage = ...;
mediaView.setGradient(leftColor, myRightColorsetImage(myImage);

...

Âncora

	video

	video

...

Video

int solidColorvideoId

Define a cor de fundo do botão para uma única cor.

Caso não seja definida, a cor padrão utilizada é #a0a0a0 (Image Removed).

o vídeo que irá tocar no fundo. O vídeo é ajustado para preencher todo o componente, mantendo sua proporção, e repete indefinidamente.

Painel
Não é aplicado qualquer filtro no vídeo. Portanto, para melhor conforto é recomendado que o vídeo seja em escala de cinza.

Aviso

title	Importante

Escolha um vídeo apropriado para a tela que usará o componente. Caso a tela permita somente orientação retrato, utilize um vídeo que vertical. Não utilize resoluções muito altas, caso contrário poderá ocorrer problemas na reprodução do vídeo

Nota

title	Importante

Este atributo é ignorado, caso gradientEnabled esteja habilitado.

Bloco de código

collapse

language	xml
title	example.xml		true

<sdk.fluig.com.ui.components.background.FluigSdkMediaView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:solidColorvideo="@color@raw/my_colorvideo" />

Bloco de código

collapse

language	java
title	Example.java		true

FluigSdkMediaView mediaView = (FluigSdkMediaView) findViewById(R.id.my_media_view_id);
int myColormyVideoId = ...;
mediaView.setSolidColorsetVideo(myColor);
 
//caso queira usar a cor padrão
mediaView.setDefaultSolidColor();

Video

...

myVideoId);

Árvore de páginas

Versões comparadas

Versão antiga 7

Nova versão Atual

Chave

Índice

Objetivo

Gradient Enabled

Background Color

Gradient Left Color

Background Color End

Gradient Right Color

Image

Video

Video

Árvore de páginas

Histórico da Página

Versões comparadas

Versão antiga 7

Nova versão Atual

Chave

Índice

Objetivo

Gradient Enabled

Background Color

Gradient Left Color

Background Color End

Gradient Right Color

Image

Video

Video