Spanish Visualizar imágenes o fotos

23021959Pepe

Member
Licensed User
Longtime User
Buenas tardes, alguien recuerda algún ejemplo que que exista por algún forum, de como visualizar todas las imágenes que contiene una carpeta y el poder desplazarlas lateralmente para ir viéndolas una a una.
He descargado alguno ejemplos que he encontrado, pero como los foros son en ingles no me enterado de mucho y voy a ir aprobándolos haber si alguno es lo que yo busco.

Saludos
Pepe
 

bgsoft

Well-Known Member
Licensed User
Longtime User
Hola Pepe:

Aqui puedes ver dos ejemplos :
http://www.b4x.com/android/forum/threads/listview-tutorial.6537/#content
http://www.b4x.com/android/forum/threads/customized-listview.34951/

Pero te recomiendo que te lo hagas tu, podras hacerlo a tu estilo y no es complejo, te hago un ejemplo rápido de como hacerlo con un ScrollView, hay que poner mas cosas, pero al menos esto es la base

B4X:
Sub Globals
          
Dim Scroll1 As ScrollView

' .........
' .........
' .........
' .........



Sub Activity_Create(FirstTime As Boolean)
  Scroll1.Initialize2(Activity.Height,"")  
  Scroll1.Color= Colors.Black
  Activity.AddView(Scroll1,0,0,100%x,100%y)
' .........
' .........
' .........




' En algun sub
Dim Ficheros As List
Ficheros = File.ListFiles(NombreCarpeta) 'poner todos los ficheros en la lista
dim Ok as boolean
Dim f As String

For i = 0 To Ficheros.Size - 1
  DoEvents
 
  f = Ficheros.Get(i)

  ' Haz el tipo de filtro de los ficheros que te interese ver (jpg, png, etc)
  If f.ToLowerCase.EndsWith(".jpg") OR f.ToLowerCase.EndsWith(".png") OR f.ToLowerCase.EndsWith(".gif") Then
    Dim b1 As ImageView
    b1.Initialize("ImageView1")
    b1.Color = Colors.Black
    b1.Gravity = Gravity.FILL
    b1.tag =f
  
    ok=true              
    Try
      b1.Bitmap=LoadBitmapSample(NombreCarpeta,f.Get(i),15%x,15%y)
    Catch
      Log("Error en fichero")
      ok=false
    End Try
    if Ok then Scroll1.Panel.AddView(b1,LeftObjeto,TopObjeto,Ancho,Alto)

  doevents
next




Sub ImageView1_Click
  ' llamar a hacer la imagen grande
Dim B As ImageView
B = Sender
NombreUnaImagen = B.Tag

' puedes crear otro activity donde veas la imagen en grande
' te recomiendo la libreria TouchImageView, donde podras hacer zoom con el tipico movimiento de los dedos como en la galeria

StartActivity(VerImagen)


end sub


Saludos
 

23021959Pepe

Member
Licensed User
Longtime User
Hola Jesús, efectivamente tienes toda la razón, por eso lo que busco es poder partir de una base.
Yo siempre he dicho que, como mejor se aprende un lenguaje de programación es, probando y analizando el funcionamiento de los ejemplos.

Saludos
Pepe
 

bgsoft

Well-Known Member
Licensed User
Longtime User

Gustavo

Member
Licensed User
Longtime User
hola bgsof e estado luchando un poco con la scrollview, en base a codigo que publicaste, mas el scrollview.zip, y logra que se vean las imagenes y ademas que haga el scroll, pero me pone 4 imagenes en el scrollview y yo quiero que aparezca de a una solo imagen

B4X:
Sub Globals
    Dim orienta As Phone
    Dim ScrollView1 As ScrollView
    'Dim btnDown As Button
'    Dim btnUp As Button
End Sub

Sub Activity_Create(FirstTime As Boolean)
    orienta.SetScreenOrientation(1)
    If FirstTime Then 'only load the images once.
        ProgressDialogShow("Cargando Imagenes")
        LoadImages
        ProgressDialogHide
    End If
 
    Activity.LoadLayout("8") 'load the layout file
    'ScrollView1.Panel.Height = 100dip * Bitmaps.Size 'Set the inner panel height according to the number of images.
    ScrollView1.Panel.Height = 700dip * Bitmaps.Size 'Set the inner panel height according to the number of images.
    For i = 0 To Bitmaps.Size - 1
        Dim iv As ImageView 'create an ImageView for each bitmap
        iv.Initialize("") 'not interested in any events so we pass empty string.
        Dim bd As BitmapDrawable
        bd.Initialize(Bitmaps.Get(i))
        iv.Background = bd 'set the background of the image view.
        'add the image view to the scroll bar internal panel.
        ScrollView1.Panel.AddView(iv, 5dip, 5dip + i * 200dip, ScrollView1.Width - 10dip, 700dip)
    Next

    'btnUp.Tag = -200dip
    'btnDown.Tag = 200dip
End Sub
Sub LoadImages
    Bitmaps.Initialize
    Dim files As List
    Dim imagesFolder As String
    imagesFolder = File.DirRootExternal & "/sitef/catalogo/"
    If File.Exists(imagesFolder, "") = False Then
        ToastMessageShow("Images folder not found: " & CRLF & imagesFolder, True)
        Return
    End If
    files = File.ListFiles(imagesFolder) 'get all files in this folder
    For i = 0 To files.Size - 1
        DoEvents 'required for the ProgressDialog animation
        Dim f As String
        f = files.Get(i)
        If f.ToLowerCase.EndsWith(".jpg") Then
            Dim b As Bitmap
       
            b.InitializeSample(imagesFolder, f, 100dip, 700dip) 'load the jpeg file and subsample it if it is too large.
            Bitmaps.Add(b) 'add the bitmap to the bitmaps list.
            'If Bitmaps.Size > 50 Then Exit 'limit it to 50 images
        End If
    Next
    'ToastMessageShow("Found " & Bitmaps.Size & " images", True)
End Sub
Sub btn_Click
    Dim v As View
    v = Sender 'this way we can handle both buttons from the same sub.
    ScrollView1.ScrollPosition = ScrollView1.ScrollPosition + v.Tag 'v.tag will be -200 or 200.
   
End Sub

Sub Activity_Resume

End Sub

Sub Activity_Pause (UserClosed As Boolean)

End Sub
No se que estoy haciendo mal, las imagenes son de 1407x2136 pixeles.
Desde ya gracias por tu ayuda
 

bgsoft

Well-Known Member
Licensed User
Longtime User
Hola Gustavo

pero me pone 4 imagenes en el scrollview y yo quiero que aparezca de a una solo imagen

Con esto te refieres que carga 4 imagenes en horizontal? si es asi posiblemente es por el tamaño en ancho que le has dado al scroll a nivel de diseño en el Desing y eso añadido al codigo que no especificas el ancho es el motivo.
Si embargo si te refieres a que quieres ver solo una imagen en el scroll en vez de 4, entonces no necesitas un scroll, si no simplemente una imagen o un bitmap, pero entonces no entenderia para que quieres un scroll :D.

Por otro lado estas cargando la imagen en una lista de imagenes y luego la cargas en el scroll, aparte que es duplicar el codigo es generar el doble de memoria, la "gracia" del LoadBitmapSample es la de cargar la imagen en el dispositivo pero sin cargarla al 100% de su calidad ni de su peso, y luego al tocar en el scrooll hacer una llamada a una imagen que ya la cargue al 100%, por ejemplo a un TouchView. Por eso el código para el LoadBitmapSample no es poner el alto y ancho en dip, si no en tanto por ciento (LoadBitmapSample(NombreCarpeta,f.Get(i),15%x,15%y) ) , con ese código a la que cargues unas pocas imagenes te dara un error de memoria, que ademas no puedes controlar con un try

ScrollView1.Panel.AddView(iv, 5dip, 5dip + i * 200dip, ScrollView1.Width - 10dip, 700dip)

Si te fijas en este codigo hay una incongruencia, le dices que la imagen la cargue en 5dip + i * 200dip, pero luego al decirle el alto le dices que es 700dip, de esta forma tenemos:
i = 0 > 5+0 * 200= 1000
i = 1 > 5+1 * 200= 1200
...
La primera imagen en vez de colocarla en altura a 0, la pones a 1000, y como le dices que el alto es 700 pues ira desde 1000 a 1700 y la siguiente le dices que el top es 1200, asi que estas solapando imagenes que puede que sea el problema de tu consulta.

Como no se exactamente cual es el problema, yo te aconsejo que copies del primer codigo, y luego en el apartado de donde poner la imagen y el tamaño lo tengas muy en cuenta, ya que eso es lo que hara que se vean las imagenes que quieras que aparezcan en horizontal. Por otro lado en el ejemplo cree el scroll en ejecucion para asi darle el ancho que quisieras dependiendo del dispositivo (Activity.AddView(Scroll1,0,0,100%x,100%y) )

Una buena forma es crearte una variable con la altura de la imagen en el scroll, y luego esta variable la empleas para darle la altura:

B4X:
  AltoItem= 100

  AltoImagen = i*AltoItem ' no es lo mismo 0 + 5 que 0 * 5 :D
  ' o tambien esta version
  AltoImagen = AltoImagen + AltoItem + 2dip ' asi dejas una linea de separacion entre imagenes

Saludos
 
Top