sélection images en défilement

Vous débutez et vous avez besoin d'aide ? N'hésitez pas à poser vos questions
Avatar de l’utilisateur
omega
Messages : 633
Inscription : sam. 26/nov./2011 13:04
Localisation : Alger

sélection images en défilement

Message par omega »

Salut tout le monde

Je me suis peut être mal exprimé (en titre) mais je vais essayer d'expliquer mon problème:

Je cherche une solution qui me permet d'afficher une liste d'images (suivies par un texte) sur un gadget qui permet le défilement (comme une ListIconGadgtet par exemple). Je voudrais que l'utilisateur puisse choisir une image en la sélectionnant.

N.B. Je dis bien une liste d'images et non pas icônes !


Merci
Win7 (x64) 64 bits Pb 5.72
Avatar de l’utilisateur
falsam
Messages : 7324
Inscription : dim. 22/août/2010 15:24
Localisation : IDF (Yvelines)
Contact :

Re: sélection images en défilement

Message par falsam »

omega a écrit :Je me suis peut être mal exprimé (en titre)
Pas que dans le titre :wink:
omega a écrit :(suivies par un texte)
Sous le texte ?, à droite du texte ? ....

Un petit code sur la base d'un ScrollAreaGadget() dans lequel on charges quelques images associées à du texte à droite de l'image. Clique sur une image.

Code : Tout sélectionner

Enumeration Font
  #FontText
EndEnumeration

Enumeration Window
  #mainForm
EndEnumeration

Enumeration Gadget
  #Selector
EndEnumeration

Enumeration Image #PB_Compiler_EnumerationValue  Step 100 ;Reservation de 100 images 
  #Image
EndEnumeration

Enumeration Text #PB_Compiler_EnumerationValue  Step 100 ;Reservation de 100 zones de texte
  #Text 
EndEnumeration

Global Dim Images.s(7)

;Plan de l'application
Declare Start()
Declare SelectImage()
Declare Exit()

Start()

Procedure Start()
  Protected Path.s = #PB_Compiler_Home + "Examples/3D/Data/Textures/"
  Protected n, Image
  
  LoadFont(#FontText, "Arial", 11)
  SetGadgetFont(#PB_Default, FontID(#FontText))
  
  UseJPEGImageDecoder()
  UsePNGImageDecoder()
  
  OpenWindow(#mainForm, 0, 0, 800, 600, "Fermer une fenetre", #PB_Window_SystemMenu | #PB_Window_ScreenCentered)
  
  ScrollAreaGadget(#Selector, 5, 5, 400, 590, 370, 600)
  CloseGadgetList()
  
  ;Déclencheur
  BindEvent(#PB_Event_CloseWindow, @Exit())
  
  ;Chargement des images
  Images(0) = Path + "Dirt.jpg"
  Images(1) = Path + "grass.jpg"
  Images(2) = Path + "MRAMOR6X6.jpg"
  Images(3) = Path + "Caisse.png"
  Images(4) = Path + "clouds.jpg"
  Images(5) = Path + "ground_diffuse.png"
  Images(6) = Path + "soil_wall.jpg"
  
  OpenGadgetList(#Selector)
  For n = 0 To ArraySize(Images())-1
    ;Load & resize image
    Image = LoadImage(-1, Images(n))
    ResizeImage(Image, 128, 128)
    
    ;Affiche Image
    ImageGadget(#Image + n , 0, n * 130, 0, 0, ImageID(Image))
    
    ;Affiche Texte
    TextGadget(#Text + n, 140, n * 130, 160, 130, GetFilePart(Images(n)))
    
    ;Declencheur (Evenement image)
    BindGadgetEvent(#Image + n, @SelectImage(), #PB_EventType_LeftClick)
  Next
  CloseGadgetList()  
  
  ;Ajustement du scroller vertical
  SetGadgetAttribute(#Selector, #PB_ScrollArea_InnerHeight , ArraySize(Images()) * 130) 
  
  Repeat : WaitWindowEvent() : ForEver
EndProcedure

Procedure SelectImage()
  Debug "Sélection de l'image " + EventGadget()  
EndProcedure

Procedure Exit()  
  End
EndProcedure
Configuration : Windows 11 Famille 64-bit - PB 6.20 x64 - AMD Ryzen 7 - 16 GO RAM
Vidéo NVIDIA GeForce GTX 1650 Ti - Résolution 1920x1080 - Mise à l'échelle 125%
Avatar de l’utilisateur
falsam
Messages : 7324
Inscription : dim. 22/août/2010 15:24
Localisation : IDF (Yvelines)
Contact :

Re: sélection images en défilement

Message par falsam »

Une autre solution avec des canvas dans un ScrollArea.

Code : Tout sélectionner

EnableExplicit

Enumeration Font
  #FontText
EndEnumeration

Enumeration Window
  #mainForm
EndEnumeration

Enumeration Container 0  ;Reservation de 100 Container
  #Container
EndEnumeration

Enumeration Gadget 101
  #Selector
EndEnumeration

Structure newImage
  id.i
  image.s
EndStructure

Global Dim Images.newImage(7)

Global ContainerWidth = 379
Global ContainerHeight = 128
Global ItemColor = RGB(255, 255, 255)
Global ItemSelectColor = RGB(189, 183, 107)

Global ImageWidth = 128
Global ImageHeigh = 128

;Sommaire
Declare Start()
Declare SelectImage()
Declare Exit()

Start()

Procedure Start()
  Protected Path.s = #PB_Compiler_Home + "Examples/3D/Data/Textures/"
  Protected n, Container, Image
  
  LoadFont(#FontText, "Arial", 11)
  SetGadgetFont(#PB_Default, FontID(#FontText))
  
  UseJPEGImageDecoder()
  UsePNGImageDecoder()
  
  OpenWindow(#mainForm, 0, 0, 800, 600, "Fermer une fenetre", #PB_Window_SystemMenu | #PB_Window_ScreenCentered)
  
  ScrollAreaGadget(#Selector, 5, 5, 400, 590, 379, 600)
  CloseGadgetList()
  
  ;Déclencheur
  BindEvent(#PB_Event_CloseWindow, @Exit())
  
  ;Chargement des images
  Images(0)\image = Path + "Dirt.jpg"
  Images(1)\image = Path + "grass.jpg"
  Images(2)\image = Path + "MRAMOR6X6.jpg"
  Images(3)\image = Path + "Caisse.png"
  Images(4)\image = Path + "clouds.jpg"
  Images(5)\image = Path + "ground_diffuse.png"
  Images(6)\image = Path + "soil_wall.jpg"
  
  For n = 0 To ArraySize(Images())-1
    Images(n)\id = LoadImage(#PB_Any, Images(n)\image)
    ResizeImage(Images(n)\id, ImageWidth, ImageHeigh)
  Next
    
  OpenGadgetList(#Selector)
  For n = 0 To ArraySize(Images())-1    
    Container = #Container + n
    
    ;Affichage container
    CanvasGadget(Container , 0, n * ContainerHeight, ContainerWidth, ContainerHeight)
    StartDrawing(CanvasOutput(Container))
      ;BackGround
      Box(0, 0, ContainerWidth, ContainerHeight, ItemColor)
      
      ;Affiche Image
      DrawImage(ImageID(Images(n)\id), 0, 0)
    
      ;Affiche Texte
      DrawingMode(#PB_2DDrawing_Transparent)
      DrawText(140, 5, GetFilePart(Images(n)\image), RGB(0, 0, 0))
      
      ;Cadre
      DrawingMode(#PB_2DDrawing_Outlined)
      Box(0, 0, ContainerWidth, ContainerHeight, RGB(105, 105, 105))        
    StopDrawing()
    
    ;Declencheur (Evenement image)
    BindGadgetEvent(#Container + n, @SelectImage(), #PB_EventType_LeftClick)    
  Next
  CloseGadgetList()  
  
  ;Ajustement du scroller vertical
  SetGadgetAttribute(#Selector, #PB_ScrollArea_InnerHeight , ArraySize(Images()) * ContainerHeight) 
  
  Repeat : WaitWindowEvent() : ForEver
EndProcedure

Procedure SelectImage()
  Static LastItem 
  Protected SelectItem = EventGadget() 
  
  Debug "Sélection de l'image " + Images(SelectItem)\image
  
  StartDrawing(CanvasOutput(#Container + LastItem))
    Box(0, 0, ContainerWidth, ContainerHeight, ItemColor)  
    DrawImage(ImageID(Images(LastItem)\id), 0, 0)
    DrawingMode(#PB_2DDrawing_Transparent)
    DrawText(140, 5, GetFilePart(Images(LastItem)\image), RGB(0, 0, 0))
    DrawingMode(#PB_2DDrawing_Outlined)
    Box(0, 0, ContainerWidth, ContainerHeight, RGB(105, 105, 105))      
  StopDrawing()

  StartDrawing(CanvasOutput(#Container + SelectItem))
    Box(0, 0, ContainerWidth, ContainerHeight, ItemSelectColor)
    DrawImage(ImageID(Images(SelectItem)\id), 0, 0)
    DrawingMode(#PB_2DDrawing_Transparent)
    DrawText(140, 5, GetFilePart(Images(SelectItem)\image), RGB(0, 0, 0))
    DrawingMode(#PB_2DDrawing_Outlined)
    Box(0, 0, ContainerWidth, ContainerHeight, RGB(105, 105, 105))      
  StopDrawing()
  
  LastItem = SelectItem
EndProcedure

Procedure Exit()  
  End
EndProcedure
Configuration : Windows 11 Famille 64-bit - PB 6.20 x64 - AMD Ryzen 7 - 16 GO RAM
Vidéo NVIDIA GeForce GTX 1650 Ti - Résolution 1920x1080 - Mise à l'échelle 125%
Répondre