web-dev-qa-db-fra.com

Utiliser le "cercle animé" dans une image lors du chargement

J'utilise actuellement dans mon application une liste de diffusion nécessitant peut-être une seconde pour être affichée.

Ce que je fais actuellement utilise la propriété @ id/Android: empty de la listview pour créer un texte "en cours de chargement".

 <TextView Android:id="@id/Android:empty"
           Android:layout_width="match_parent"
           Android:layout_height="match_parent"
           Android:background="#FF0000"
           Android:text="Loading..."/>

Maintenant, je voudrais remplacer cela par le cercle animé utilisé dans une boîte de dialogue de chargement au lieu de ce texte, je suppose que vous savez tous ce que je veux dire:

Edit: Je ne veux pas de dialogue. Je veux montrer cela dans ma mise en page.

http://flexfwd.com/DesktopModules/ATI_Base/resources/images/loading_blue_circle.gif

Merci beaucoup pour votre aide!

androidloadingandroid-asynctaskcircle
193
Waza_Be

Il suffit de placer ce bloc xml dans le fichier de mise en page de votre activité:

<RelativeLayout
    Android:id="@+id/loadingPanel"
    Android:layout_width="match_parent"
    Android:layout_height="match_parent"
    Android:gravity="center" >

    <ProgressBar
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:indeterminate="true" />
</RelativeLayout>

Et quand vous avez fini de charger, appelez cette ligne:

findViewById(R.id.loadingPanel).setVisibility(View.GONE);

Le résultat (et ça tourne aussi): 

enter image description here

371
user1032613

Vous pouvez le faire en utilisant le code XML suivant

<RelativeLayout
    style="@style/GenericProgressBackground"
    Android:id="@+id/loadingPanel"
    >
    <ProgressBar
        style="@style/GenericProgressIndicator"/>
</RelativeLayout>

Avec ce style

<style name="GenericProgressBackground" parent="Android:Theme">
    <item name="Android:layout_width">fill_parent</item>    
    <item name="Android:layout_height">fill_parent</item>
    <item name="Android:background">#DD111111</item>    
    <item name="Android:gravity">center</item>  
</style>
<style name="GenericProgressIndicator" parent="@Android:style/Widget.ProgressBar.Small">
    <item name="Android:layout_width">wrap_content</item>
    <item name="Android:layout_height">wrap_content</item>
    <item name="Android:indeterminate">true</item> 
</style>

Pour utiliser cela, vous devez masquer vos éléments d'interface utilisateur en définissant la valeur de visibilité sur GONE et chaque fois que les données sont chargées, appelez setVisibility(View.VISIBLE) sur toutes vos vues pour les restaurer. N'oubliez pas d'appeler findViewById(R.id.loadingPanel).setVisiblity(View.GONE) pour masquer l'animation de chargement.

Si vous n'avez pas d'événement/fonction de chargement mais souhaitez simplement que le panneau de chargement disparaisse après x secondes, utilisez un Handle pour déclencher le masquage/l'affichage.

141
Kurru

Ceci est généralement appelé dialogue indéterminé barre de progression ou progrès indéterminé.

Combinez cela avec un Thread et un Handler pour obtenir exactement ce que vous voulez. Il existe un certain nombre d'exemples sur la façon de le faire via Google ou ici sur SO. Je recommande fortement de passer du temps à apprendre à utiliser cette combinaison de classes pour effectuer une tâche de ce type. Il est incroyablement utile pour de nombreux types d’applications et vous donnera un bon aperçu de la façon dont les threads et les gestionnaires peuvent fonctionner ensemble.

Je vais vous expliquer comment cela fonctionne:

L'événement de chargement lance la boîte de dialogue:

//maybe in onCreate
showDialog(MY_LOADING_DIALOG);
fooThread = new FooThread(handler);
fooThread.start();

Maintenant le fil fait le travail:

private class FooThread extends Thread {
    Handler mHandler;

    FooThread(Handler h) {
        mHandler = h;
    }

    public void run() { 
        //Do all my work here....you might need a loop for this

        Message msg = mHandler.obtainMessage();
        Bundle b = new Bundle();                
        b.putInt("state", 1);   
        msg.setData(b);
        mHandler.sendMessage(msg);
    }
}

Enfin, récupérez l'état du thread lorsqu'il est terminé:

final Handler handler = new Handler() {
    public void handleMessage(Message msg) {
        int state = msg.getData().getInt("state");
        if (state == 1){
            dismissDialog(MY_LOADING_DIALOG);
            removeDialog(MY_LOADING_DIALOG);
        }
    }
};
10
user432209

Si vous souhaitez ne pas gonfler une autre vue simplement pour indiquer la progression, procédez comme suit:

  1. Créez ProgressBar dans la même présentation XML de la vue liste.
  2. Le centrer
  3. Donnez-lui un identifiant
  4. Associez-le à votre variable d'instance listview en appelant setEmptyView

Android se chargera de la visibilité de la barre de progression.

Par exemple, dans activity_main.xml:

    <?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"
    Android:orientation="vertical"
    tools:context="com.fcchyd.linkletandroid.MainActivity">

    <ListView
        Android:id="@+id/list_view_xml"
        Android:layout_width="match_parent"
        Android:layout_height="match_parent"
        Android:divider="@color/colorDivider"
        Android:dividerHeight="1dp" />

   <ProgressBar
        Android:id="@+id/loading_progress_xml"
        style="?android:attr/progress"
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:layout_centerHorizontal="true"
        Android:layout_centerVertical="true" />

</RelativeLayout>

Et en MainActivity.Java:

package com.fcchyd.linkletandroid;

import Android.os.Bundle;
import Android.support.v7.app.AppCompatActivity;
import Android.util.Log;
import Android.widget.ArrayAdapter;
import Android.widget.ListView;

import Java.util.ArrayList;
import Java.util.List;

import retrofit2.Call;
import retrofit2.Callback;
import retrofit2.Response;
import retrofit2.Retrofit;
import retrofit2.converter.gson.GsonConverterFactory;

public class MainActivity extends AppCompatActivity {

final String debugLogHeader = "Linklet Debug Message";
Call<Links> call;
List<Link> arraylistLink;
ListView linksListV;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    linksListV = (ListView) findViewById(R.id.list_view_xml);
    linksListV.setEmptyView(findViewById(R.id.loading_progress_xml));
    arraylistLink = new ArrayList<>();

    Retrofit retrofit = new Retrofit.Builder()
            .baseUrl("https://api.links.linklet.ml")
            .addConverterFactory(GsonConverterFactory
                    .create())
            .build();

    HttpsInterface HttpsInterface = retrofit
            .create(HttpsInterface.class);

    call = HttpsInterface.httpGETpageNumber(1);

    call.enqueue(new Callback<Links>() {
        @Override
        public void onResponse(Call<Links> call, Response<Links> response) {
            try {
                arraylistLink = response.body().getLinks();

                String[] simpletTitlesArray = new String[arraylistLink.size()];
                for (int i = 0; i < simpletTitlesArray.length; i++) {
                    simpletTitlesArray[i] = arraylistLink.get(i).getTitle();
                }
                ArrayAdapter<String> simpleAdapter = new ArrayAdapter<>(MainActivity.this, Android.R.layout.simple_list_item_1, simpletTitlesArray);
                linksListV.setAdapter(simpleAdapter);
            } catch (Exception e) {
                Log.e("erro", "" + e);
            }
        }

        @Override
        public void onFailure(Call<Links> call, Throwable t) {

        }
    });


}

}

 

1
Md_Zubair Ahmed

Vous pouvez utiliser ce code depuis firebase github samples ..

Vous n'avez pas besoin d'éditer dans les fichiers de modèles ... créez simplement une nouvelle classe "BaseActivity"

package com.example;

import Android.app.ProgressDialog;
import Android.support.annotation.VisibleForTesting;
import Android.support.v7.app.AppCompatActivity;


public class BaseActivity extends AppCompatActivity {

    @VisibleForTesting
    public ProgressDialog mProgressDialog;

    public void showProgressDialog() {
        if (mProgressDialog == null) {
            mProgressDialog = new ProgressDialog(this);
            mProgressDialog.setMessage("Loading ...");
            mProgressDialog.setIndeterminate(true);
        }

        mProgressDialog.show();
    }


    public void hideProgressDialog() {
        if (mProgressDialog != null && mProgressDialog.isShowing()) {
            mProgressDialog.dismiss();
        }
    }

    @Override
    public void onStop() {
        super.onStop();
        hideProgressDialog();
    }

}

Dans votre activité, vous souhaitez utiliser la boîte de dialogue de progression.

public class MyActivity extends BaseActivity

Avant/Après la fonction qui prend du temps 

showProgressDialog();
.... my code that take some time
showProgressDialog();
1
khateeb

Pour ceux qui se développent à Kotlin, il existe une méthode sweet fournie par la bibliothèque Anko qui rend le processus d'affichage de ProgressDialog un jeu d'enfant!

Basé sur ce lien:

val dialog = progressDialog(message = "Please wait a bit…", title = "Fetching data")
dialog.show()
//....
dialog.dismiss()

Cela affichera un dialogue de progression avec le% de progression affiché (pour lequel vous devez également passer le paramètre init pour calculer la progression).

Il existe également la méthode indeterminateProgressDialog(), qui fournit l'animation du cercle en rotation indéfiniment jusqu'à ce qu'elle soit rejetée:

indeterminateProgressDialog("Loading...").show()

Crier à ce blog qui m'a conduit à cette solution. 

0
DarkCygnus