|     Inicio    |   |         |  |   FOROS      |  |      |      
   Elastix - VoIP B4A (Basic4Android) App inventor 2 PHP - MySQL
  Estación meteorológica B4J (Basic4Java) ADB Shell - Android Arduino
   AutoIt (Programación) Visual Basic Script (VBS) FireBase (BD autoactualizable) NodeMCU como Arduino
  Teleco - Emisora de A.M. Visual Basic Cosas de Windows Webs interesantes
Translate:
Búsqueda en este sitio:


Nuevo concurso para España, Argentina, Brasil, Chile, Colombia, Ecuador, México, Perú y Portugal.

B4A en español - Juan Antonio Villalpando
(BASIC4Android)

-- Tutorial de B4A --

Volver al índice del tutorial

____________________________

66.- HorizontalScrollView. Tag. Paneles deslizantes.

- horizontalscrollview.zip

- Presentación.

 

- A veces queremos poner varios controles en la pantalla y no tenemos sitio, no caben en la pantalla. Podemos solucionarlo creando varios Layout o varios Activity, pero otra manera más simple de situarlos es mediante un HorizontalScrollView.

- Vamos a crear mediante el Designer un "Layout", con un HorizontalScrollView y tres botones a los que llamaremos btn1, btn2 y btn3.

_______________________
- Designer. Layout.

Designer - Layout

Creamos mediante el Designer un layout.
Lo llamamos Layout.

Situamos:

HorizontalScrollView

Label1

Boton (btn1) ...... Text = Izquierda
Boton (btn2) ...... Text = Centro
Boton (btn3) ...... Text = Derecha

A los Button le damos de nombre:

btn1
btn2
btn3


_______________________
- Código.

- Con esta línea establecemos un HorizontalScrollView que tiene el triple del ancho de la pantalla. (3 * 100%x)

HorizontalScrollView1.Panel.Width = 3 * 100%x

- Con estas líneas establecemos varios Botones:
uno a 50 de la derecha,
otro a 50 + ancho pantalla de la derecha
otro a 50 + doble ancho pantalla de la derecha.

HorizontalScrollView1.Panel.AddView(Boton1, 50, 20, 200, 60)
HorizontalScrollView1.Panel.AddView(Boton2, 50 + 100%x, 20, 200, 60)
HorizontalScrollView1.Panel.AddView(Boton3, 50 + 200%x, 20, 200, 60)

- Cuando pulsamos uno de los tres botones creados en el Layout (btn1, btn2 o btn3), el HorizontalScrollView se situa en la Posición requerida en cada botón.

HorizontalScrollView1.ScrollPosition = 2 * 100%x

- Cuando pulsamos uno de los tres botones que se encuentran en el HorizontalScrollView, saldrá un mensaje en el Label1.

Label1.Text = "Has pulsado en botón 3."

- Podemos desplazar el HorizontalScrollView, mediante los botones anteriores o arrastrando la pantalla.

Copia y pega este código en un nuevo proyecto
Sub Process_Globals
' Juan Antonio Villalpando
' juana1991@yahoo.com
' marzo 2013
' kio4.com
End Sub

Sub Globals
  Dim HorizontalScrollView1 As HorizontalScrollView
  Dim Boton1, Boton2, Boton3 As Button
  Dim Label1 As Label
End Sub

Sub Activity_Create(FirstTime As Boolean)
    Activity.LoadLayout("Layout")
    
    Dim GD As GradientDrawable
    GD.Initialize("TR_BL", Array As Int(Colors.Green, Colors.Red))
    HorizontalScrollView1.Panel.Background = GD
    
    Boton1.Initialize("Boton1")
    Boton1.Text = "Pulsa el Botón1"
    Boton2.Initialize("Boton2")
    Boton2.Text = "Pulsa el Botón2"
    Boton3.Initialize("Boton3")
    Boton3.Text = "Pulsa el Botón3"

    HorizontalScrollView1.Panel.Width = 3 * 100%x
    HorizontalScrollView1.Panel.AddView(Boton1, 50, 20, 300, 200) 
    HorizontalScrollView1.Panel.AddView(Boton2, 50 + 100%x, 20, 300, 200) 
    HorizontalScrollView1.Panel.AddView(Boton3, 50 + 200%x, 20, 300, 200) 

End Sub

Sub Activity_Resume

End Sub

Sub Activity_Pause (UserClosed As Boolean)

End Sub
' Botones del Layout - Izquierda, Centro, Derecha.
Sub btn1_Click HorizontalScrollView1.ScrollPosition = 0 End Sub Sub btn2_Click HorizontalScrollView1.ScrollPosition = 100%x End Sub Sub btn3_Click HorizontalScrollView1.ScrollPosition = 2 * 100%x End Sub
' Botón sobre el HorizontalScrollView
Sub Boton1_Click Label1.Text = "Has pulsado en botón 1." End Sub Sub Boton2_Click Label1.Text = "Has pulsado en botón 2." End Sub Sub Boton3_Click Label1.Text = "Has pulsado en botón 3." End Sub

_______________________________________________
- Veamos otra manera de simplificar el código. EventName. Tag.

- horizontalscrollview_2.zip

(Es conveniente consultar el tutorial 17.- Estudio la propiedad Tag)

 

En el Designer vamos a los Botones y ponemos en los tres la propiedad EventName en boton.

 


También cambiamos la propiedad Tag. Aquí ponemos en cada botón un identificador.


En el btn1 ponemos el Tag = 0
En el btn2 ponemos el Tag = 1
En el btn3 ponemos el Tag = 2

Podemos simplificar los códigos de los botones btn1, btn2 y btn3.
Cuando ejecutemos el EventName: boton (los tres botones tienen EventName a boton)
Se consulta el botón pulsado (Sender) y se toma la Propiedad Tag (0, 1, 2)
Se multiplica la Propiedad Tag por el ancho de pantalla (100%x).

Es decir, hemos englobado a los códigos de los tres botones en uno.

Sub boton_Click
    Dim v As View
    v = Sender
    HorizontalScrollView1.ScrollPosition =  v.Tag * 100%x
End Sub

________________________

Ahora vamos a ver los botones que están en el HorizontalScrollView. Le debemos asignar un EventName (Boton1.Initialize("botonhsv")) común a todos y un Tag (Boton1.Tag = "el_uno") particular a cada uno, esto lo hacemos de la manera que muestro en el código.

Luego creamos una Subrutina para el EventName botonhsv en donde consultamos el Tag del botón pulsado.
Dependiendo de cada Tag hará un Case.

Cuando el View se crea mediante código el EventName se establece en el Designer. EventName = boton.
Cuando el View se crea por código el EventName se establece en el Inititialize:
Boton1.Initialize("botonhsv").

Copia y pega este código.
Sub Process_Globals
' Juan Antonio Villalpando
' juana1991@yahoo.com
' marzo 2013
' kio4.com
End Sub

Sub Globals
  Dim HorizontalScrollView1 As HorizontalScrollView
  Dim Boton1, Boton2, Boton3 As Button
  Dim Label1 As Label
End Sub

Sub Activity_Create(FirstTime As Boolean)
    Activity.LoadLayout("Layout")
    
    Dim GD As GradientDrawable
    GD.Initialize("TR_BL", Array As Int(Colors.Green, Colors.Red))
    HorizontalScrollView1.Panel.Background = GD
    
    Boton1.Initialize("botonhsv")
    Boton1.Text = "Pulsa el Botón1"
    Boton1.Tag = "el_uno"
    Boton2.Initialize("botonhsv")
    Boton2.Text = "Pulsa el Botón2"
    Boton2.Tag = "el_dos"
    Boton3.Initialize("botonhsv")
    Boton3.Text = "Pulsa el Botón3"
    Boton3.Tag = "el_tres"

    ' HorizontalScrollView1.Panel.Height = 400dip
    HorizontalScrollView1.Panel.Width = 3 * 100%x
    HorizontalScrollView1.Panel.AddView(Boton1, 50, 20, 300, 200) 
    HorizontalScrollView1.Panel.AddView(Boton2, 50 + 100%x, 20, 300, 200) 
    HorizontalScrollView1.Panel.AddView(Boton3, 50 + 200%x, 20, 300, 200) 

End Sub

Sub Activity_Resume

End Sub

Sub Activity_Pause (UserClosed As Boolean)

End Sub 

' Botones del Layout - Izquierda, Centro, Derecha. Sub boton_Click Dim v As View v = Sender HorizontalScrollView1.ScrollPosition = v.Tag * 100%x End Sub ' Botón sobre el HorizontalScrollView Sub botonhsv_Click Dim hsv As View hsv = Sender Select hsv.Tag Case "el_uno" Label1.text="Has pulsado el Uno" Case "el_dos" Label1.text="Has pulsado el Dos" Case "el_tres" Label1.text="Has pulsado el Tres" End Select End Sub

_____________________________________
- Módulo de Código SlidingPanels.

- También podemos crear paneles deslizantes con el Módulo de Código SlidingPanels y la librería Animation.

________________________________

- Mi correo:
juana1991@yahoo.com
- KIO4.COM - Política de cookies. Textos e imágenes propiedad del autor:
© Juan A. Villalpando
No se permite la copia de información ni imágenes.
Usamos cookies propias y de terceros que entre otras cosas recogen datos sobre sus hábitos de navegación y realizan análisis de uso de nuestro sitio.
Si continúa navegando consideramos que acepta su uso. Acepto    Más información