- Presentación.
- Los Paneles se utilizan, entre otras cosas, para situar un conjunto de controles que pueden aparecer y desaparecer, desplazarse, anularse...
- Si ponemos un Panel sobre otro y actuamos sobre la propiedad visible, podemos tener varios ventanas o formularios en la pantalla.
NOTA: más adelante veremos un efecto parecido con el intercambio de Activity en vez del intercambio de Paneles. Ver Dos Activity
1.- Dos Paneles.
____________________________
- Designer. Layout.
Creamos los controles
|
|
Insertamos mediante
Designer / Add View
Button1 Parent = Panel1
Button2 Parent = Panel1
Button3 Parent = Activity
Button4 Parent = Activity
Panel1 Parent = Activity Color = Blue
Panel2 Parent = Activity Color = Yellow
Hacemos que:
- el Panel1 y el Panel2 pertenezcan al Actitivy
- el Button1 y el Button2 pertenezcan al Panel1
- el Button3 y el Button4 pertenezcan al Activity
Es decir, los controles anteriores pueden pertenecer al Activity (que es la "pantalla"), al Panel1 o al Panel2. De manera que estos elementos se pueden gestionar como un conjunto.
Para hacer que pertenezcan modificamos la propiedad Parent.
El Parent es el lugar donde está el control puede estar en al Activity o en el Panel.
Guardamos el Designer:
File / Save : Layout
|
Ahora vamos al código del programa, pero antes seguimos en el Designer y marcamos:
Tools / Generate members
Button1 Click
Button2 Click
Button3 Click
Button4 Click
Esto lo hacemos para que en el código aparezca:
Sub Button1_Click
End Sub
Que es donde pondremos el algoritmo del cálculo.
(En realidad podríamos poner las dos líneas anteriores escrita manualmente, sin tener que hacerlo mediante el Generate members)
____________________________
- Código (copia y pega).
Código del programa en Basic4Android
|
'Activity module
Sub Process_Globals
' Juan Antonio Villalpando
' juana1991@yahoo.com
End Sub
Sub Globals
Dim Panel1, Panel2 As Panel
End Sub
Sub Activity_Create(FirstTime As Boolean)
Activity.LoadLayout("Layout") ' Cargamos el Designer
End Sub
Sub Button1_Click
Panel1.Color=Colors.Red
End Sub
Sub Button2_Click
Panel1.Color=Colors.Yellow
End Sub
Sub Button3_Click
Panel1.Visible=True
End Sub
Sub Button4_Click
Panel1.Visible=False
End Sub
|
____________________________
- Comentarios.
Al pulsar el Botón1 o el Botón2, su Panel1 cambia de color al Rojo o al Amarillo.
Al pulsar el Botón3 o el Botón4, el Panel1 se hace visible o invisible.
Ver en foros.
___________________
2.- Varios Paneles.
- Bajar Paneles_2.zip
En este caso vamos a realizar una aplicación donde aparezca a la izquierda una columna con las opciones 1, 2 y 3.
Y según pulsemos las Label 1, 2 y 3 iremos al Panel 1, 2 o 3.
Creamos los controles
|
Parent es el lugar donde se asientan los demás Views.
|
Creamos un Panel, y lo situamos en la parte izquierda de la pantalla.
Ponemos el Panel de color naranja. Le cambiamos el nombre y lo llamamos Panel0
Insertamos en el Panel0 tres Label:
Label1, Label2 y Label3 (ponemos como Texto de las Label 1, 2 y 3)
(El Color de texto de las Label Rojo).
Cuando hemos creado el Panel0, resulta que los demás Views que pongamos pueder ir sobre el Activity o sobre el Panel0.
Para que estén sobre el Panel0 debemos poner su propiedad Parent en Panel0
|
Creamos los controles
|
Parent es el lugar donde se asientan los demás Views.
|
Agregamos otro Panel como indica la imagen de la izquierda, lo llamaremos Panel1.
Lo ponemos de Color amarillo.
Agregamos un Button1, en la parte superior.
Nos aseguramos que el Button1 tiene como Parent el Panel1
IMPORTANTE
El Parent del Button1 es el Panel1
El Parent del Panel1 es el Activity
|
Creamos los controles
|
Parent es el lugar donde se asientan los demás Views.
|
Agregamos otro Panel como indica la imagen de la izquierda, lo llamaremos Panel2.
Lo ponemos de Color azul .
Agregamos un Button2, en la parte enmedio.
Nos aseguramos que el Button2 tiene como Parent el Panel2
IMPORTANTE
El Parent del Button2 es el Panel2
El Parent del Panel2 es el Activity
________________________________
- IMPORTANTE
El Panel2 se ha situado sobre el Panel1, ¿cómo puedo volver a ver el Panel1 para cambiarlo?
Para que un Panel que haya pasado a la parte de atrás, vuelva a aparecer, en el Designer localizamos el Panel1, pulsamos con el botón derecho del ratón: Bring To Front (Traer al frente), de esta manera podemos volver a editar el Panel1.
|
Creamos los controles
|
Parent es el lugar donde se asientan los demás Views.
|
Agregamos otro Panel como indica la imagen de la izquierda, lo llamaremos Panel3.
Lo ponemos de Color verde .
Agregamos un Button3, en la parte inferior.
Nos aseguramos que el Button3 tiene como Parent el Panel3
IMPORTANTE
El Parent del Button3 es el Panel3
El Parent del Panel3 es el Activity
________________________________
IMPORTANTE
El Panel3 se ha situado sobre el Panel1, ¿cómo puedo volver a ver el Panel1 para cambiarlo?
Para que un Panel que haya pasado a la parte de atrás, vuelva a aparecer, en el Designer localizamos el Panel1, pulsamos con el botón derecho del ratón: Bring To Front (Traer al frente), de esta manera podemos volver a editar el Panel1.
|
Guardamos todo el "Layout" y pegamos este código...
____________________________
- Código (copia y pega).
Código del programa en Basic4Android
|
Sub Process_Globals
' Juan Antonio Villalpando
' juana1991@yahoo.com
End Sub
Sub Globals
Dim Panel1, Panel2, Panel3 As Panel
End Sub
Sub Activity_Create(FirstTime As Boolean)
Activity.LoadLayout("Layout")
End Sub
Sub Activity_Resume
End Sub
Sub Activity_Pause (UserClosed As Boolean)
End Sub
Sub Label1_Click
Panel1.visible=True
Panel2.visible=False
Panel3.visible=False
End Sub
Sub Label2_Click
Panel1.visible=False
Panel2.visible=True
Panel3.visible=False
End Sub
Sub Label3_Click
Panel1.visible=False
Panel2.visible=False
Panel3.visible=True
End Sub
|
- En la aplicación anterior, en vez de Label_Click podríamos haber puesto Botones en el Panel izquierdo.
- Hay otras formas de tener varios recuadros.
- Se pueden crear varios "Layout1", "Layout2" y "Layout3" y en vez de ocultar/poner Paneles se cargan Layout.
Sub Label1_Click
Activity.LoadLayout("Layout1")
End Sub
Sub Label2_Click
Activity.LoadLayout("Layout2")
End Sub
Sub Label3_Click
Activity.LoadLayout("Layout3")
End Sub
- Se pueden tener varias Activity cada una con su propio "Layout"
___________________
- En este tutorial de los Foros se pueden ver otra formas de trabajar con varios Paneles y Activity
https://www.b4x.com/android/forum/threads/different-examples-with-2-layouts.8416/#post47102
- Varios ejemplos de ScrollView de los Foros
https://www.b4x.com/android/forum/threads/scrollview-examples-summary.8423/#post47137
________________________________
