Comunidad Gambas-es
Scrollview. ¿ Es posible ajustar su tamaño al ancho y alto del total de sus hijos ? - Versión para impresión

+- Comunidad Gambas-es (https://gambas-es.org)
+-- Foro: Gambas (https://gambas-es.org/forum-3.html)
+--- Foro: General (https://gambas-es.org/forum-4.html)
+--- Tema: Scrollview. ¿ Es posible ajustar su tamaño al ancho y alto del total de sus hijos ? (/thread-1701.html)



Scrollview. ¿ Es posible ajustar su tamaño al ancho y alto del total de sus hijos ? - Shell - 06-06-2024

Buenas!.

Tengo un formulario que contiene un scrollview, la propiedad de arrangement del.
formulario está puesta a Fill. A medida que ajuste este los controles que están dentro
del scrollview se distribuyen en este de una forma.

Ahora bien. Si quisiera ajustar su ancho y alto al tamaño que tienen sus hijos instantáneamente, ¿ es posible ?.
He añadido ademas un tamaño de separación entre los pictureboxes.

Tengo esto:

[Imagen: Tfu1NPv.png]

Y lo que quiero es que automáticamente se ajuste por la derecha.
Sin necesidad de hacerlo manualmente con el formulario y el ratón.

Código:
Const MARGEN As Integer = 8
Const NUMPICTUREBOXES As Integer = 8

Private anomimagenes As String[] = ["Gambas3.png", "Python.png"] 'No es necesario del todo, en este caso solo son dos imagenes

Public Sub Form_Open()

  Randomize

  Me.Arrangement = Arrange.Fill ' Según cambio el tamaño del formulario se ajustan los controles que tiene el ScrollView

  With ScrollView1
    .Arrangement = Arrange.Row
    .Background = Color.Black
    .Spacing = True
    .Margin = True
    .Padding = MARGEN
  End With

  InsertarImagenes(anomimagenes)

End

Public Sub InsertarImagenes(simagenes As String[])

  Dim j As Integer
  Dim unpicturebox As PictureBox

  For j = 0 To NUMPICTUREBOXES - 1
    unpicturebox = New PictureBox(ScrollView1) As "Observador"
    With unpicturebox
      .W = 64
      .H = 64
      .Picture = Picture.Load(Application.Path &/ simagenes[Rand(1)])
      .Border = True
      .Background = Color.White
      .Mode = PictureBox.Contain
      .Tag = j
    End With
  Next

 ''FIXME: Ajustar ancho y alto del ScrollView al tamaño de los controles contenidos
  With ScrollView1
    ' Menos 2 debido al contador de Pictureboxes, su indice es NUMPICTUREBOXES
    .W = ((NUMPICTUREBOXES - 1) * 64 + MARGEN * (NUMPICTUREBOXES - 2)) / 2
    .H = ((NUMPICTUREBOXES - 1) * 64 + MARGEN * (NUMPICTUREBOXES - 2)) / 2
  End With
End

Public Sub Observador_MouseDown()

  Dim colorcontrario As Integer
  Dim listadeindices As New Integer[]

  For j As Integer = 0 To ScrollView1.Children.Max
    listadeindices.Add(j)
  Next

  'Por defecto. Intercambiamos el color
  If Last.Background = Color.Green Then
    Last.Background = Color.White
    colorcontrario = Color.Green
  Else
    Last.Background = Color.Green
    colorcontrario = Color.White
  Endif

  'Eliminamos la posibilidad de que se pueda cambiar el color de fondo del picturebox seleccionado
  'Para esto he creado una listadeindices
  listadeindices.Remove(Last.tag)

  'Al resto de los picturebox no seleccionados, se les camnbia el color del fondo
  For j As Integer = 0 To listadeindices.Max
    ScrollView1.Children[listadeindices[j]].Background = colorcontrario
  Next

End

Os subo el código.

Saludos


RE: Scrollview. ¿ Es posible ajustar su tamaño al ancho y alto del total de sus hijos ? - tercoide - 06-06-2024

Estoy lidiando desde hace tiempo con los ScrollView Angry  me han agotado y opte por no usarlos. No se llevan bien con los otros contenedores.


RE: Scrollview. ¿ Es posible ajustar su tamaño al ancho y alto del total de sus hijos ? - Shell - 07-06-2024

(06-06-2024, 22:10)tercoide escribió: Estoy lidiando desde hace tiempo con los ScrollView Angry  me han agotado y opte por no usarlos. No se llevan bien con los otros contenedores.

No siempre es así. Es un control que a veces es necesario. No eres el único que se ha quejado de ScrollView.
Para determinados usos en aplicaciones es muy típico.

La distribución de los controles dentro de este, no es sencilla.

Si se cambia (para ver diferencias), el Scrollview por un Panel, y con este se usa distintos modos de su
propiedad arrangement, el efecto es casi similar.

Por otra parte como hay formas de arrangement que son similares unas con otras, hacen el mismo efecto.
LeftToRight es lo mismo que Row . En este caso Horizontal me creó un efecto distinto, sobre todo con los
colores de fondo.

A veces el contenedor padre que contiene al ScrollView cuando tiene una distribución de controles y si este
ScrollView, tiene  otra distribución , lo efectos pueden ser todo lo contrario a lo que esperamos.

Por cierto, ¿ cómo lo sustituyes ?. En caso de dibujo se puede usar un ScrollArea.

Saludos


RE: Scrollview. ¿ Es posible ajustar su tamaño al ancho y alto del total de sus hijos ? - Shordi - 07-06-2024

Cita:Si quisiera ajustar su ancho y alto al tamaño que tienen sus hijos instantáneamente, ¿ es posible ?.
Tal como lo planteas, no. Hasta donde sé, el Arrangement se "ejecuta" de arriba abajo, es decir primero el formulario y luego los controles contenidos. Si estableces un arrangement al formulario de Fill, el tamaño del scrollview será el mismo que el de el formulario y los controles que contenga el scrollview se ubicarán después. Por tanto lo que especificas en el código de:
[code]
Es visualmente cierto pero lo que haces en realidad es cambiar el tamaño del formulario que cambia el tamaño del scrollview que reajusta sus controles.
No sé qué quieres hacer exactamente, pero yo lo que haría es utilizar un Gridview, no un scrollview.

Saludos.


RE: Scrollview. ¿ Es posible ajustar su tamaño al ancho y alto del total de sus hijos ? - Shell - 07-06-2024

(07-06-2024, 07:37)Shordi escribió: No sé qué quieres hacer exactamente, pero yo lo que haría es utilizar un Gridview, no un scrollview.

No me vale un GridView para este tipo de aplicación. Es una "especie" de visor y organizador de imágenes.

Pero solo estaba interesado ver el funcionamiento del contenedor de las imágenes ( ScrollView en este caso)
y la organización de estas (Pictureboxes con imágenes)  en su contenedor ScrollView.

Que los huecos a cada lado de las pictureboxes hijas fueran iguales.
Que todas las filas se mostrasen igual.

El mayor problema es adaptar el tamaño del form  (que no el scrollview) ?. Smile
Así si "por ejemplo" tengo un padding en el Scrollview de 8, quiero que haya una
fila con tres imágenes en el ScrollView tendría esto:

Tamaño del ancho del scrollview = hueco + imagen + hueco + imagen + hueco + imagen + hueco

A ese tamaño total se tiene que ajustar scrollview, quedando siempre por cada lado un hueco
Que como bien dices es el formulario primero.
Jugaré con eso antes.

Ejemplo, aquí he elegido un tamaño para las imágenes y casualmente ha quedado bien.

[Imagen: gBOLhc0.png]

Peero, si cambio el tamaño de las imágenes ó me da por ajustar el tamaño del
formulario con el ratón, me estropea la distribución de los pictureboxes.

Y como ves, no es exactamente igual el tamaño de los huecos laterales, aunque son muy parecidos.
El derecho es un poco más grande.


Saludos


RE: Scrollview. ¿ Es posible ajustar su tamaño al ancho y alto del total de sus hijos ? - Shordi - 07-06-2024

Cita:No me vale un GridView para este tipo de aplicación. Es una "especie" de visor y organizador de imágenes.
 
En el último vídeo (de momento) de la serie de "Creando una aplicación desde cero" tienes un ejemplo de cómo organizar y ver imágenes con un gridview. Si eso no te vale, no he dicho nada y me callo.
Big Grin


RE: Scrollview. ¿ Es posible ajustar su tamaño al ancho y alto del total de sus hijos ? - Shell - 07-06-2024

(07-06-2024, 17:39)Shordi escribió: En el último vídeo (de momento) de la serie de "Creando una aplicación desde cero" tienes un ejemplo de cómo organizar y ver imágenes con un gridview. Si eso no te vale, no he dicho nada y me callo.

Entiendo el motivo del uso de las imágenes y el gridview. Los menús. Pero no lo he visto aún.

Encontré el problema. Se crea cuando se activa la propiedad margen del control ScrollView,
que tengo que contar con el para distribuir los pictureboxes.  Tengo activo tanto spacing como margin.
Tal como desactivé margin, quedo ajustado a cada lado y ahí fue cuando lo vi.

No puedo poner solucionado por que el título es muy largo. Angel

Saludos