Bilder in Listicons?

Anfängerfragen zum Programmieren mit PureBasic.
Benutzeravatar
Delle
Beiträge: 1130
Registriert: 10.05.2005 22:48

Bilder in Listicons?

Beitrag von Delle »

Hallo,

hat jemand eine Idee wie man so eine Art Tabelle machen kann incl. "Listicon" davor?

Bild

Oder ist das eher ein scrollbarer Container wo manuell alles reingepixelt wurde?

Danke,
Delle
PB 6.21 | Win 11
Benutzeravatar
ts-soft
Beiträge: 22292
Registriert: 08.09.2004 00:57
Computerausstattung: Mainboard: MSI 970A-G43
CPU: AMD FX-6300 Six-Core Processor
GraKa: GeForce GTX 750 Ti, 2 GB
Memory: 16 GB DDR3-1600 - Dual Channel
Wohnort: Berlin

Re: Bilder in Listicons?

Beitrag von ts-soft »

Das ist doch ein ganz normales ListIconGadet? Wo ist denn jetzt das Problem?

Benötigst du mehrere Spalten mit Icons oder ...

Input please :wink:

Gruß
Thomas
PureBasic 5.73 LTS | SpiderBasic 2.30 | Windows 10 Pro (x64) | Linux Mint 20.1 (x64)
Nutella hat nur sehr wenig Vitamine. Deswegen muss man davon relativ viel essen.
Bild
Benutzeravatar
Delle
Beiträge: 1130
Registriert: 10.05.2005 22:48

Re: Bilder in Listicons?

Beitrag von Delle »

Hm naja ich hätte die Optik gerne wie oben auf dem Screenshot.

Mit PB sieht es irgendwie nicht so schön aus:

Bild

1) Die jeweils 2. Zeile ich muss ich sicher manuell einfärben oder?

2) Wenn Item 6 z.B. markiert ist, dann geht die Markierung nicht über die ganze Zeile (trotz #PB_ListIcon_FullRowSelect)

3) Gehen vorn auch größere Icons in z.B. 64x64 Pixel? Meine nicht #PB_ListIcon_LargeIcon!

4) Checkbox geht anscheinend nur vorne?
PB 6.21 | Win 11
Benutzeravatar
ts-soft
Beiträge: 22292
Registriert: 08.09.2004 00:57
Computerausstattung: Mainboard: MSI 970A-G43
CPU: AMD FX-6300 Six-Core Processor
GraKa: GeForce GTX 750 Ti, 2 GB
Memory: 16 GB DDR3-1600 - Dual Channel
Wohnort: Berlin

Re: Bilder in Listicons?

Beitrag von ts-soft »

Ohne API gehen nur 16x16 Icons. FullRowSelect funktioniert bei mir?

Vielleicht guckst Du erst mal in die WinAPI Library von RSBasic, da sind diverse Dinge bei, die Du möchtest.
Ansonsten lohnt ein Blick ins CodeArchiv, da sind auch ca. 30 Beispiele für das ListIconGadget.

Wenn danach noch was fehlen sollte, einfach nochmal nachhaken.

Wenn das alles zu kompliziert ist, gibts noch die Möglichkeit ExGrid von srod zu kaufen, damit
ist dies alles in jedem Falle möglich.

Gruß
Thomas
PureBasic 5.73 LTS | SpiderBasic 2.30 | Windows 10 Pro (x64) | Linux Mint 20.1 (x64)
Nutella hat nur sehr wenig Vitamine. Deswegen muss man davon relativ viel essen.
Bild
Benutzeravatar
Delle
Beiträge: 1130
Registriert: 10.05.2005 22:48

Re: Bilder in Listicons?

Beitrag von Delle »

ts-soft hat geschrieben:Wenn das alles zu kompliziert ist, gibts noch die Möglichkeit ExGrid von srod zu kaufen, damit
ist dies alles in jedem Falle möglich.
Hm dem seine Seiten gehen komischerweise nicht mehr :(

http://www.arctic-reports.com/
http://www.nxsoftware.com
PB 6.21 | Win 11
Benutzeravatar
Kiffi
Beiträge: 10711
Registriert: 08.09.2004 08:21
Wohnort: Amphibios 9

Re: Bilder in Listicons?

Beitrag von Kiffi »

eigentlich kann man sowas in PB recht einfach selber basteln:

Code: Alles auswählen

EnableExplicit

Define newX, newY, newW, newH
Define SampleImage, Counter, WWE
Define SelectedRowIndex

Structure sRow
  ImageGadget.i
  TextGadget1.i
  TextGadget2.i
EndStructure

Global NewList Row.sRow()

#Window = 0 
#ScrollAreaGadget = 0

OpenWindow(#Window, #PB_Ignore, #PB_Ignore, 200, 600, "")

ScrollAreaGadget(#ScrollAreaGadget, 0, 0, WindowWidth(#Window), WindowHeight(#Window), WindowWidth(#Window) - 32, WindowHeight(#Window))

newH = 20

SampleImage = LoadImage(#PB_Any, "C:\Program Files (x86)\PureBasic\Examples\Sources\Data\Drive.bmp")

For Counter = 0 To 50
  
  AddElement(Row())
  
  Row()\ImageGadget = ImageGadget(#PB_Any,   0, newY,  30, newH, ImageID(SampleImage), #PB_Image_Border)
  Row()\TextGadget1 = TextGadget (#PB_Any,  30, newY, 100, newH, " Dies ist Zeile " + Str(Counter), #SS_CENTERIMAGE | #SS_NOTIFY)
  Row()\TextGadget2 = TextGadget (#PB_Any, 131, newY,  50, newH, " holla", #SS_CENTERIMAGE | #SS_NOTIFY)
  
  newY + newH + 1
  
  If ListIndex(Row()) % 2 = 0
    SetGadgetColor(Row()\TextGadget1, #PB_Gadget_BackColor, #White)
    SetGadgetColor(Row()\TextGadget2, #PB_Gadget_BackColor, #White)
  Else
    SetGadgetColor(Row()\TextGadget1, #PB_Gadget_BackColor, #Gray)
    SetGadgetColor(Row()\TextGadget2, #PB_Gadget_BackColor, #Gray)
  EndIf
  
  
Next

CloseGadgetList()

SetGadgetAttribute(#ScrollAreaGadget, #PB_ScrollArea_InnerHeight, newY)

Repeat
  
  WWE = WaitWindowEvent() 
  
  Select WWE
      
    Case #PB_Event_Gadget
      
      ForEach Row()
        
        If EventGadget()=Row()\TextGadget1 Or EventGadget()=Row()\TextGadget2
          
          SelectedRowIndex = ListIndex(Row())
          
          ForEach Row()
            
            If ListIndex(Row()) % 2 <> 0
              SetGadgetColor(Row()\TextGadget1, #PB_Gadget_BackColor, #Gray)
              SetGadgetColor(Row()\TextGadget2, #PB_Gadget_BackColor, #Gray)
            Else
              SetGadgetColor(Row()\TextGadget1, #PB_Gadget_BackColor, #White)
              SetGadgetColor(Row()\TextGadget2, #PB_Gadget_BackColor, #White)
            EndIf
            
            SetGadgetColor(Row()\TextGadget1, #PB_Gadget_FrontColor, #Black)
            SetGadgetColor(Row()\TextGadget2, #PB_Gadget_FrontColor, #Black)
            
          Next
          
          SelectElement(Row(), SelectedRowIndex)
          
          SetGadgetColor(Row()\TextGadget1, #PB_Gadget_BackColor, #Blue)
          SetGadgetColor(Row()\TextGadget2, #PB_Gadget_BackColor, #Blue)
          
          SetGadgetColor(Row()\TextGadget1, #PB_Gadget_FrontColor, #White)
          SetGadgetColor(Row()\TextGadget2, #PB_Gadget_FrontColor, #White)
          Break
          
        EndIf
        
      Next
      
  EndSelect
  
Until WWE = #PB_Event_CloseWindow
... und wenn man mehr als 5 Minuten Arbeit investiert (wie ich grade),
dann kann das auch richtig schick aussehen. ;-)

Grüße ... Kiffi
a²+b²=mc²
Benutzeravatar
Delle
Beiträge: 1130
Registriert: 10.05.2005 22:48

Re: Bilder in Listicons?

Beitrag von Delle »

Grins Kiffi! :D

Die Idee mit ScrollGadget und eigenen Imagebuttons und Checkboxen etc. hatte ich vorhin auch grade :)

Wollte mich dann morgen an die Umsetzung machen... aber scheint ja super zu funzen :)
PB 6.21 | Win 11
Benutzeravatar
ts-soft
Beiträge: 22292
Registriert: 08.09.2004 00:57
Computerausstattung: Mainboard: MSI 970A-G43
CPU: AMD FX-6300 Six-Core Processor
GraKa: GeForce GTX 750 Ti, 2 GB
Memory: 16 GB DDR3-1600 - Dual Channel
Wohnort: Berlin

Re: Bilder in Listicons?

Beitrag von ts-soft »

Ja Peter, sieht richtig gut aus :D

Aber wenn man dann Items entfernen oder hinzufügen möchte wirds evtl. doch noch kompliziert.
Aber von der Idee her, sehr Kreativ :)
PureBasic 5.73 LTS | SpiderBasic 2.30 | Windows 10 Pro (x64) | Linux Mint 20.1 (x64)
Nutella hat nur sehr wenig Vitamine. Deswegen muss man davon relativ viel essen.
Bild
Benutzeravatar
Shardik
Beiträge: 746
Registriert: 25.01.2005 12:19

Re: Bilder in Listicons?

Beitrag von Shardik »

Danke für das Beispiel, Kiffi.

Kleiner Verbesserungsvorschlag, damit Dein Beispiel ohne Änderung auch unter
Windows XP (oder unter Windows 7, wenn es die 64 Bit-Version ist oder PureBasic
in einem anderen Verzeichnis liegt) läuft:

Code: Alles auswählen

; SampleImage = LoadImage(#PB_Any, "C:\Program Files (x86)\PureBasic\Examples\Sources\Data\Drive.bmp")
SampleImage = LoadImage(#PB_Any, #PB_Compiler_Home + "Examples\Sources\Data\Drive.bmp")
Benutzeravatar
NicTheQuick
Ein Admin
Beiträge: 8807
Registriert: 29.08.2004 20:20
Computerausstattung: Ryzen 7 5800X, 64 GB DDR4-3200
Ubuntu 24.04.2 LTS
GeForce RTX 3080 Ti
Wohnort: Saarbrücken

Re: Bilder in Listicons?

Beitrag von NicTheQuick »

Und damit es auch unter Linux läuft:

Code: Alles auswählen

EnableExplicit

Define newX, newY, newW, newH
Define SampleImage, Counter, WWE
Define SelectedRowIndex

Structure sRow
  ImageGadget.i
  TextGadget1.i
  TextGadget2.i
EndStructure

Global NewList Row.sRow()

#Window = 0
#ScrollAreaGadget = 0

OpenWindow(#Window, #PB_Ignore, #PB_Ignore, 200, 600, "")

ScrollAreaGadget(#ScrollAreaGadget, 0, 0, WindowWidth(#Window), WindowHeight(#Window), WindowWidth(#Window) - 32, WindowHeight(#Window))

newH = 20

SampleImage = LoadImage(#PB_Any, #PB_Compiler_Home + "examples/sources/Data/Drive.bmp")

For Counter = 0 To 50
 
  AddElement(Row())
 
  Row()\ImageGadget = ImageGadget(#PB_Any,   0, newY,  30, newH, ImageID(SampleImage), #PB_Image_Border)
  Row()\TextGadget1 = TextGadget (#PB_Any,  30, newY, 100, newH, " Dies ist Zeile " + Str(Counter), #PB_Text_Center)
  Row()\TextGadget2 = TextGadget (#PB_Any, 131, newY,  50, newH, " holla", #PB_Text_Center)
 
  newY + newH + 1
 
  If ListIndex(Row()) % 2 = 0
    SetGadgetColor(Row()\TextGadget1, #PB_Gadget_BackColor, $FFFFFF)
    SetGadgetColor(Row()\TextGadget2, #PB_Gadget_BackColor, $FFFFFF)
  Else
    SetGadgetColor(Row()\TextGadget1, #PB_Gadget_BackColor, $7F7F7F)
    SetGadgetColor(Row()\TextGadget2, #PB_Gadget_BackColor, $7F7F7F)
  EndIf
 
 
Next

CloseGadgetList()

SetGadgetAttribute(#ScrollAreaGadget, #PB_ScrollArea_InnerHeight, newY)

Repeat
 
  WWE = WaitWindowEvent()
 
  Select WWE
     
    Case #PB_Event_Gadget
     
      ForEach Row()
       
        If EventGadget()=Row()\TextGadget1 Or EventGadget()=Row()\TextGadget2
         
          SelectedRowIndex = ListIndex(Row())
         
          ForEach Row()
           
            If ListIndex(Row()) % 2 <> 0
              SetGadgetColor(Row()\TextGadget1, #PB_Gadget_BackColor, $7F7F7F)
              SetGadgetColor(Row()\TextGadget2, #PB_Gadget_BackColor, $7F7F7F)
            Else
              SetGadgetColor(Row()\TextGadget1, #PB_Gadget_BackColor, $FFFFFF)
              SetGadgetColor(Row()\TextGadget2, #PB_Gadget_BackColor, $FFFFFF)
            EndIf
           
            SetGadgetColor(Row()\TextGadget1, #PB_Gadget_FrontColor, 0)
            SetGadgetColor(Row()\TextGadget2, #PB_Gadget_FrontColor, 0)
           
          Next
         
          SelectElement(Row(), SelectedRowIndex)
         
          SetGadgetColor(Row()\TextGadget1, #PB_Gadget_BackColor, $0000FF)
          SetGadgetColor(Row()\TextGadget2, #PB_Gadget_BackColor, $0000FF)
         
          SetGadgetColor(Row()\TextGadget1, #PB_Gadget_FrontColor, $FFFFFF)
          SetGadgetColor(Row()\TextGadget2, #PB_Gadget_FrontColor, $FFFFFF)
          Break
         
        EndIf
       
      Next
     
  EndSelect
 
Until WWE = #PB_Event_CloseWindow 
@Kiffi:
Ich weiß nicht, was #SS_CENTERIMAGE | #SS_NOTIFY beim TextGadget bewirkt, aber ist es nicht einfach das selbe wie #PB_Text_Center?

Farben wie #White, #Grey, #Blue und #Black gibt es auch nicht in der Linux-Version. Deswegen hab ich mal einfach Hexwerte dafür rein geschrieben.
Das Verzeichnis für das Beispielbild musste ich zudem noch an Groß-/Kleinschreibung anpassen und statt \ eben / verwenden.
Antworten