Scrollview vertical y horizontal en android

Estoy muy cansado buscando una solución para Scrollview vertical y horizontal.

He leído que no hay ninguna vista / disposición en el marco que implementa esta característica, pero necesito algo como esto:

Necesito definir un diseño dentro de otro, el diseño del niño debe implementar desplazamiento vertical / horizontal para mover.

Inicialmente implementado un código que movió la disposición píxel por píxel, pero creo que no es el camino correcto. Lo intenté con ScrollView y ScrollView horizontal, pero nada funciona como yo lo quiero, porque sólo implementa desplazamiento vertical u horizontal.

La lona no es mi solución porque necesito atar oyentes en los elementos del niño de someones.

¿Que puedo hacer?

Mezclando algunas de las sugerencias anteriores, y fue capaz de obtener una buena solución:

ScrollView personalizado:

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; } } 

Custom HorizontalScrollView:

 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; } } 

El 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; } } 

El diseño:

 <?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> 

Dado que este parece ser el primer resultado de búsqueda en Google para "Android vertical + horizontal ScrollView", pensé que debería añadir esto aquí. Matt Clark ha creado una vista personalizada basada en la fuente de Android, y parece funcionar perfectamente: ScrollView de dos dimensiones

Tenga en cuenta que la clase en esa página tiene un error calculando el ancho horizonal de la vista. Una corrección de Manuel Hilty está en los comentarios:

Solución: Reemplace la declaración en la línea 808 por lo siguiente:

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

Editar: El enlace ya no funciona, pero aquí hay un enlace a una versión antigua de la blogpost .

Encontré una solución mejor.

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> 

Código 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; } } 

Eso es obras!

Si desea cargar otro diseño o control, la estructura es la misma.

Lo uso y funciona bien:

 <?xml version="1.0" encoding="utf-8"?> <ScrollView android:id="@+id/ScrollView02" android:layout_width="wrap_content" android:layout_height="wrap_content" xmlns:android="http://schemas.android.com/apk/res/android"> <HorizontalScrollView android:id="@+id/HorizontalScrollView01" android:layout_width="wrap_content" android:layout_height="wrap_content"> <ImageView android:id="@+id/ImageView01" android:src="@drawable/pic" android:isScrollContainer="true" android:layout_height="fill_parent" android:layout_width="fill_parent" android:adjustViewBounds="true"> </ImageView> </HorizontalScrollView> </ScrollView> 

El enlace fuente está aquí: Android-spa

Mi solución basada en Mahdi Hijazi responder , pero sin ninguna vista personalizada:

Diseño:

 <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> 

Código (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; } }); 

Puede cambiar el orden de las vistas de desplazamiento. Simplemente cambie su orden en el diseño y en el código. Y, obviamente, en lugar de WateverViewYouWant poner el diseño / vistas que desea desplazarse en ambas direcciones.

Opción # 1: Puede crear un nuevo diseño de interfaz de usuario que no requiera el desplazamiento horizontal y vertical simultáneo.

Opción # 2: Puede obtener el código fuente de ScrollView y HorizontalScrollView , aprender cómo el equipo principal de Android implementó éstos y crear su propia implementación BiDirectionalScrollView .

Opción # 3: Puede deshacerse de las dependencias que requieren que utilice el sistema widget y dibujar directamente a la lona.

Opción # 4: Si tropiezas con una aplicación de código abierto que parece implementar lo que buscas, mira para ver cómo lo hicieron.

Prueba esto

 <?xml version="1.0" encoding="utf-8"?> <ScrollView android:id="@+id/Sview" android:layout_width="wrap_content" android:layout_height="wrap_content" xmlns:android="http://schemas.android.com/apk/res/android"> <HorizontalScrollView android:id="@+id/hview" android:layout_width="wrap_content" android:layout_height="wrap_content"> <ImageView ....... [here xml code for image] </ImageView> </HorizontalScrollView> </ScrollView> 

Ya que el enlace de Scrollview de dos dimensiones está muerto, no pude conseguirlo, así que creé mi propio componente. Maneja el lanzamiento y funciona correctamente para mí. La única restricción es que wrap_content podría no funcionar correctamente para ese componente.

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

Tengo una solución para su problema. Puede comprobar el código ScrollView que maneja sólo el desplazamiento vertical e ignora el horizontal y modificarlo. Quería una vista como una webview, por lo que ScrollView modificado y funcionó bien para mí. Pero esto puede no satisfacer sus necesidades.

Déjeme saber qué clase de UI usted apunta para.

Saludos,

Ravi Pandit

Jugar con el código, puede poner un HorizontalScrollView en un ScrollView. De esta manera, puede tener el método de desplazamiento dos en la misma vista.

Fuente: http://androiddevblog.blogspot.com/2009/12/creating-two-dimensions-scroll-view.html

Espero que esto pueda ayudarte.

Para configurar las barras de desplazamiento vertical y horizontal, consulte http://android-code-crumbs.blogspot.com/

  • Android: ScrollView no se desplaza
  • Ver dentro de ScrollView no ocupa todo el lugar
  • Android WebView: deshabilitar el degradado del borde amarillo de desplazamiento
  • Lista colgadaElector en ListView
  • Android - EditText multilínea forzada a llenar la altura
  • Cómo detener ScrollView desde el desplazamiento hasta la parte inferior de la página cargada actual en WebView
  • Gridlayout + ScrollView
  • Android: especifica la altura y el ancho de ScrollView
  • Mantener la posición de desplazamiento ScrollView para contenido dinámico
  • Habilitar desplazamiento dentro de EditText que está en ScrollView
  • Custom ViewPager dentro de ObservableScrollView no se mide correctamente la altura
  • FlipAndroid es un fan de Google para Android, Todo sobre Android Phones, Android Wear, Android Dev y Aplicaciones para Android Aplicaciones.