activity - nestedscrollview android



Scrollview vertical et horizontal dans android (8)

Je suis vraiment fatigué à la recherche d'une solution pour Scrollview vertical et horizontal.

J'ai lu qu'il n'y a pas de vues / mises en page dans le cadre qui implémentent cette fonctionnalité, mais j'ai besoin de quelque chose comme ceci:

J'ai besoin de définir une disposition dans l'autre, la mise en page enfant doit mettre en œuvre le défilement vertical / horizontal pour le déplacement.

Initialement mis en œuvre un code qui a déplacé la mise en page pixel par pixel, mais je pense que ce n'est pas la bonne façon. Je l'ai essayé avec ScrollView et Horizontal ScrollView mais rien ne fonctionne comme je le veux, car il n'implémente que le défilement vertical ou horizontal.

Canvas n'est pas ma solution car j'ai besoin d'attacher des écouteurs dans des éléments enfants.

Que puis-je faire?

https://ffff65535.com



En mélangeant certaines des suggestions ci-dessus, et a été en mesure d'obtenir une bonne solution:

ScrollView personnalisé:

package com.scrollable.view;

import android.content.Context;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.widget.ScrollView;

public class VScroll extends ScrollView {

    public VScroll(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
    }

    public VScroll(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    public VScroll(Context context) {
        super(context);
    }

    @Override
    public boolean onTouchEvent(MotionEvent ev) {
        return false;
    }
}

HorizontalScrollView personnalisé:

package com.scrollable.view;

import android.content.Context;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.widget.HorizontalScrollView;

public class HScroll extends HorizontalScrollView {

    public HScroll(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
    }

    public HScroll(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    public HScroll(Context context) {
        super(context);
    }

    @Override
    public boolean onTouchEvent(MotionEvent ev) {
        return false;
    }
}

la ScrollableImageActivity:

package com.scrollable.view;

import android.app.Activity;
import android.os.Bundle;
import android.view.MotionEvent;
import android.widget.HorizontalScrollView;
import android.widget.ScrollView;

public class ScrollableImageActivity extends Activity {

    private float mx, my;
    private float curX, curY;

    private ScrollView vScroll;
    private HorizontalScrollView hScroll;

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);

        vScroll = (ScrollView) findViewById(R.id.vScroll);
        hScroll = (HorizontalScrollView) findViewById(R.id.hScroll);

    }

    @Override
    public boolean onTouchEvent(MotionEvent event) {
        float curX, curY;

        switch (event.getAction()) {

            case MotionEvent.ACTION_DOWN:
                mx = event.getX();
                my = event.getY();
                break;
            case MotionEvent.ACTION_MOVE:
                curX = event.getX();
                curY = event.getY();
                vScroll.scrollBy((int) (mx - curX), (int) (my - curY));
                hScroll.scrollBy((int) (mx - curX), (int) (my - curY));
                mx = curX;
                my = curY;
                break;
            case MotionEvent.ACTION_UP:
                curX = event.getX();
                curY = event.getY();
                vScroll.scrollBy((int) (mx - curX), (int) (my - curY));
                hScroll.scrollBy((int) (mx - curX), (int) (my - curY));
                break;
        }

        return true;
    }

}

la disposition:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="fill_parent"
    android:layout_height="fill_parent">
    <com.scrollable.view.VScroll android:layout_height="fill_parent"
        android:layout_width="fill_parent" android:id="@+id/vScroll">
        <com.scrollable.view.HScroll android:id="@+id/hScroll"
            android:layout_width="fill_parent" android:layout_height="fill_parent">
            <ImageView android:layout_width="fill_parent" android:layout_height="fill_parent" android:src="@drawable/bg"></ImageView>
        </com.scrollable.view.HScroll>
    </com.scrollable.view.VScroll>

</LinearLayout>

J'ai trouvé une meilleure solution.

XML: (design.xml)

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent">
  <FrameLayout android:layout_width="90px" android:layout_height="90px">
    <RelativeLayout android:id="@+id/container" android:layout_width="fill_parent" android:layout_height="fill_parent">        
    </RelativeLayout>
</FrameLayout>
</FrameLayout>

Code Java:

public class Example extends Activity {
  private RelativeLayout container;
  private int currentX;
  private int currentY;

  protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.design);

    container = (RelativeLayout)findViewById(R.id.container);

    int top = 0;
    int left = 0;

    ImageView image1 = ...
    RelativeLayout.LayoutParams layoutParams = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT);
    layoutParams.setMargins(left, top, 0, 0);               
    container.addView(image1, layoutParams);

    ImageView image2 = ...
    left+= 100;
    RelativeLayout.LayoutParams layoutParams = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT);
    layoutParams.setMargins(left, top, 0, 0);               
    container.addView(image2, layoutParams);

    ImageView image3 = ...
    left= 0;
    top+= 100;
    RelativeLayout.LayoutParams layoutParams = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT);
    layoutParams.setMargins(left, top, 0, 0);               
    container.addView(image3, layoutParams);

    ImageView image4 = ...
    left+= 100;     
    RelativeLayout.LayoutParams layoutParams = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT);
    layoutParams.setMargins(left, top, 0, 0);               
    container.addView(image4, layoutParams);
  }     

  @Override 
  public boolean onTouchEvent(MotionEvent event) {
    switch (event.getAction()) {
        case MotionEvent.ACTION_DOWN: {
            currentX = (int) event.getRawX();
            currentY = (int) event.getRawY();
            break;
        }

        case MotionEvent.ACTION_MOVE: {
            int x2 = (int) event.getRawX();
            int y2 = (int) event.getRawY();
            container.scrollBy(currentX - x2 , currentY - y2);
            currentX = x2;
            currentY = y2;
            break;
        }   
        case MotionEvent.ACTION_UP: {
            break;
        }
    }
      return true; 
  }
}

Ça marche !!!

Si vous voulez charger une autre disposition ou un autre contrôle, la structure est la même.


J'ai une solution pour votre problème. Vous pouvez vérifier le code ScrollView, il ne gère que le défilement vertical et ignore le code horizontal et modifier cela. Je voulais une vue comme un webview, ainsi modifié ScrollView et cela a bien fonctionné pour moi. Mais cela peut ne pas convenir à vos besoins.

Faites-moi savoir quel type d'interface utilisateur vous ciblez.

Cordialement,

Ravi Pandit


Ma solution basée sur Mahdi Hijazi répond , mais sans aucun point de vue personnalisé:

Disposition:

<HorizontalScrollView xmlns:android="http://schemas.android.com/apk/res/android" 
    android:id="@+id/scrollHorizontal"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <ScrollView 
        android:id="@+id/scrollVertical"
        android:layout_width="wrap_content"
        android:layout_height="match_parent" >

        <WateverViewYouWant/>

    </ScrollView>
</HorizontalScrollView>

Code (onCreate / onCreateView):

    final HorizontalScrollView hScroll = (HorizontalScrollView) value.findViewById(R.id.scrollHorizontal);
    final ScrollView vScroll = (ScrollView) value.findViewById(R.id.scrollVertical);
    vScroll.setOnTouchListener(new View.OnTouchListener() { //inner scroll listener         
        @Override
        public boolean onTouch(View v, MotionEvent event) {
            return false;
        }
    });
    hScroll.setOnTouchListener(new View.OnTouchListener() { //outer scroll listener         
        private float mx, my, curX, curY;
        private boolean started = false;

        @Override
        public boolean onTouch(View v, MotionEvent event) {
            curX = event.getX();
            curY = event.getY();
            int dx = (int) (mx - curX);
            int dy = (int) (my - curY);
            switch (event.getAction()) {
                case MotionEvent.ACTION_MOVE:
                    if (started) {
                        vScroll.scrollBy(0, dy);
                        hScroll.scrollBy(dx, 0);
                    } else {
                        started = true;
                    }
                    mx = curX;
                    my = curY;
                    break;
                case MotionEvent.ACTION_UP: 
                    vScroll.scrollBy(0, dy);
                    hScroll.scrollBy(dx, 0);
                    started = false;
                    break;
            }
            return true;
        }
    });

Vous pouvez changer l'ordre des scrollviews. Changez juste leur ordre dans la disposition et dans le code. Et évidemment, au lieu de WateverViewYouWant vous mettez la mise en page / vues que vous voulez faire défiler les deux directions.


Option n ° 1: Vous pouvez créer une nouvelle conception d'interface utilisateur qui ne nécessite pas de défilement horizontal et vertical simultané.

Option # 2: Vous pouvez obtenir le code source de ScrollView et HorizontalScrollView , apprendre comment l'équipe Android de base les a implémentés et créer votre propre implémentation BiDirectionalScrollView .

Option # 3: Vous pouvez vous débarrasser des dépendances qui vous obligent à utiliser le système de widget et à dessiner directement sur le Canevas.

Option # 4: Si vous tombez sur une application open source qui semble implémenter ce que vous cherchez, regardez pour voir comment ils l'ont fait.


Puisque cela semble être le premier résultat de recherche dans Google pour "Android vertical + horizontal ScrollView", j'ai pensé que je devrais ajouter ceci ici. Matt Clark a construit une vue personnalisée basée sur la source Android, et il semble fonctionner parfaitement: ScrollView à deux dimensions

Attention, la classe de cette page a un bug qui calcule la largeur de la vue. Une correction de Manuel Hilty est dans les commentaires:

Solution: Remplacez l'instruction de la ligne 808 par ce qui suit:

final int childWidthMeasureSpec = MeasureSpec.makeMeasureSpec(lp.leftMargin + lp.rightMargin, MeasureSpec.UNSPECIFIED);


Edit: Le lien ne fonctionne plus mais voici un lien vers une ancienne version du blogpost .


Puisque le lien Scrollview Two Dimensional Scrollview est mort, je n'ai pas pu l'obtenir alors j'ai créé mon propre composant. Il gère le flinging et fonctionne correctement pour moi. La seule restriction est que wrap_content peut ne pas fonctionner correctement pour ce composant.

https://gist.github.com/androidseb/9902093





scrollview