Aktuelle Zeit: 16.12.2018 17:37

Alle Zeiten sind UTC + 1 Stunde [ Sommerzeit ]




Ein neues Thema erstellen Auf das Thema antworten  [ 76 Beiträge ]  Gehe zu Seite Vorherige  1, 2, 3, 4, 5 ... 8  Nächste
Autor Nachricht
 Betreff des Beitrags: Re: SpiderBasic Library - Liste individueller Style-Beispiel
BeitragVerfasst: 14.10.2018 21:15 
Offline
Moderator
Benutzeravatar

Registriert: 05.10.2006 18:55
Wohnort: Rupture Farms
Gadget > (Alle Gadgets) > Schatten in unterschiedlichen Farben hinzufügen
Code:
EnableExplicit

Procedure SetGadgetShadow(gadget, x, y, blur, size, color)
  Protected styles.s
  Protected id.s
  Protected hexcolor.s
 
  ;Falls nicht existiert, dann <style type="text/css" id="SBCustomStyles"></style> im Head erstellen, ohne Inline-Styles verwenden zu müssen
  ! if (!document.getElementById('SBCustomStyles')) {
  !   var StyleElement = document.createElement('style');
  !   StyleElement.type = 'text/css';
  !   StyleElement.id = 'SBCustomStyles';
  !   var HeadElement = document.getElementsByTagName('head')[0];
  !   HeadElement.appendChild(StyleElement);
  ! }
 
  ;Falls nicht existiert, dann eine ID im Hauptelement erstellen, um später per CSS besser darauf zugreifen zu können
  ! var GadgetElement = $(spider_GadgetID(v_gadget).div);
  ! if (GadgetElement.attr("id")) {
  !   v_id = GadgetElement.attr("id");
  ! } else {
  !   GadgetElement.attr("id", "SB_Gadget_" + v_gadget);
  !   v_id = GadgetElement.attr("id");
  ! }
 
  ;RGB in Hex konvertieren
  hexcolor = "#" + RSet(Hex(Red(color)), 2, "0") + RSet(Hex(Green(color)), 2, "0") + RSet(Hex(Blue(color)), 2, "0")
 
  styles = "#" + id + " "
 
  Select GadgetType(gadget)
    Case #PB_GadgetType_Panel
      styles + ".dijitTabPaneWrapper, #" + id + " .dijitTabListContainer-top .dijitTab"
    Case #PB_GadgetType_TrackBar
      styles = ""
      styles + ".claro #" + id + " .dijitSliderImageHandle { box-shadow: none; } .dijitSliderBarContainerH, #" + id + " .dijitSliderLeftBumper, #" + id + " .dijitSliderRightBumper, #" + id + " .dijitSliderImageHandle"
  EndSelect
 
  Select GadgetType(gadget)
    Case #PB_GadgetType_Frame,
         #PB_GadgetType_Option,
         #PB_GadgetType_CheckBox,
         #PB_GadgetType_HyperLink,
         #PB_GadgetType_Text
      styles + " { text-shadow: " + x + "px " + y + "px " + blur + "px " + hexcolor + "; }"
    Default
      styles + " { box-shadow: " + x + "px " + y + "px " + blur + "px " + size + "px " + hexcolor + "; }"
  EndSelect
 
  ;Styles hinzufügen
  ! document.getElementById("SBCustomStyles").appendChild(document.createTextNode( v_styles ));
 
EndProcedure

;================================================== Beispielcode ==================================================

If OpenWindow(0, 0, 0, 500, 400, "Window", #PB_Window_ScreenCentered)
  TextGadget(1, 10, 10, 100, 20, "Hello World", 0)
  StringGadget(2, 150, 20, 200, 20, "", 0)
  ButtonGadget(3, 370, 20, 100, 20, "Button", 0)
  TextGadget(4, 10, 30, 100, 40, "PureBaic with CSS is cool :-)", 0)
  CheckBoxGadget(5, 10, 70, 100, 20, "Click me", 0)
  ListIconGadget(6, 150, 60, 320, 200, "Column", 200, 0)
  AddGadgetItem(6, -1, "Item")
  TrackBarGadget(7, 150, 320, 320, 20, 0, 100, 0)
 
  SetGadgetShadow(1, 0, 0, 10, 0, RGB(0, 255, 0))
  SetGadgetShadow(2, 0, 0, 10, 0, RGB(100, 100, 100))
  SetGadgetShadow(3, 0, 0, 10, 0, RGB(100, 100, 100))
  SetGadgetShadow(4, 0, 0, 5, 20, RGB(0, 0, 255))
  SetGadgetShadow(5, 0, 0, 10, 20, RGB(255, 255, 0))
  SetGadgetShadow(6, 0, 0, 10, 0, RGB(100, 100, 100))
  SetGadgetShadow(7, 0, 0, 10, 0, RGB(100, 100, 100))
 
EndIf

_________________
BildBildBildBildBildBild


Nach oben
 Profil  
Mit Zitat antworten  
 Betreff des Beitrags: Re: SpiderBasic Library - Liste individueller Style-Beispiel
BeitragVerfasst: 14.10.2018 22:54 
Offline
Moderator
Benutzeravatar

Registriert: 05.10.2006 18:55
Wohnort: Rupture Farms
Gadget > (Alle Gadgets) > Gadget animiert einblenden und ausblenden
Code:
EnableExplicit

#SB_Gadget_Animation_Linear = 1
#SB_Gadget_Animation_Ease = 2
#SB_Gadget_Animation_EaseIn = 3
#SB_Gadget_Animation_EaseOut = 4
#SB_Gadget_Animation_EaseInOut = 5

Procedure HideGadgetEx(gadget, state)
  Protected id.s
  Protected hasanimation.s
 
  ! var GadgetElement = $(spider_GadgetID(v_gadget).div);
  ! if (GadgetElement.attr("id")) {
  !   v_id = GadgetElement.attr("id");
  !   v_hasanimation = GadgetElement.hasClass("HasAnimation");
  ! }
 
  If id <> "" And hasanimation <> ""
    If state = 1
      ! GadgetElement.addClass("HideGadget");
    Else
      ! GadgetElement.removeClass("HideGadget");
    EndIf
  Else
    HideGadget(gadget, state)
  EndIf
 
EndProcedure

Macro HideGadget(gadget, state)
  HideGadgetEx(gadget, state)
EndMacro

Procedure SetGadgetAnimation(gadget, effect, duration.f, delay.f)
  Protected styles.s
  Protected id.s
  Protected animation_effect.s
 
  ;Falls nicht existiert, dann <style type="text/css" id="SBCustomStyles"></style> im Head erstellen, ohne Inline-Styles verwenden zu müssen
  ! if (!document.getElementById('SBCustomStyles')) {
  !   var StyleElement = document.createElement('style');
  !   StyleElement.type = 'text/css';
  !   StyleElement.id = 'SBCustomStyles';
  !   var HeadElement = document.getElementsByTagName('head')[0];
  !   HeadElement.appendChild(StyleElement);
  ! }
 
  ;Falls nicht existiert, dann eine ID im Hauptelement erstellen, um später per CSS besser darauf zugreifen zu können
  ! var GadgetElement = $(spider_GadgetID(v_gadget).div);
  ! if (GadgetElement.attr("id")) {
  !   v_id = GadgetElement.attr("id");
  ! } else {
  !   GadgetElement.attr("id", "SB_Gadget_" + v_gadget);
  !   v_id = GadgetElement.attr("id");
  ! }
 
  Select effect
    Case #SB_Gadget_Animation_Linear
      animation_effect = "linear"
    Case #SB_Gadget_Animation_Ease
      animation_effect = "ease"
    Case #SB_Gadget_Animation_EaseIn
      animation_effect = "ease-in"
    Case #SB_Gadget_Animation_EaseOut
      animation_effect = "ease-out"
    Case #SB_Gadget_Animation_EaseInOut
      animation_effect = "ease-in-out"
  EndSelect
 
  styles = ""
  styles + "#" + id + " { -webkit-transition: all " + duration + "s " + animation_effect + " " + delay + "s; transition: all " + duration + "s " + animation_effect + " " + delay + "s; opacity: 1; visibility: visible; } "
  styles + "#" + id + " * { -webkit-transition: all " + duration + "s " + animation_effect + " " + delay + "s; transition: all " + duration + "s " + animation_effect + " " + delay + "s; opacity: 1; visibility: visible; } "
  styles + "#" + id + ".HideGadget { opacity: 0; visibility: hidden; }"
 
  ;Styles hinzufügen
  ! document.getElementById("SBCustomStyles").appendChild(document.createTextNode( v_styles ));
  ! GadgetElement.addClass("HasAnimation");
 
EndProcedure

;================================================== Beispielcode ==================================================

Procedure GadgetEvent()
  Select EventGadget()
    Case 2
      HideGadget(1, 0)
    Case 3
      HideGadget(1, 1)
  EndSelect
 
EndProcedure

If OpenWindow(0, 0, 0, 500, 400, "Window", #PB_Window_ScreenCentered)
  ButtonGadget(1, 10, 10, 210, 200, "Button", 0)
  ButtonGadget(2, 10, 220, 100, 100, "Show", 0)
  ButtonGadget(3, 120, 220, 100, 100, "Hide", 0)
 
  SetGadgetAnimation(1, #SB_Gadget_Animation_Linear, 0.5, 0)
 
  BindEvent(#PB_Event_Gadget, @GadgetEvent())
 
EndIf

_________________
BildBildBildBildBildBild


Nach oben
 Profil  
Mit Zitat antworten  
 Betreff des Beitrags: Re: SpiderBasic Library - Liste individueller Style-Beispiel
BeitragVerfasst: 15.10.2018 09:56 
Offline
Moderator
Benutzeravatar

Registriert: 05.10.2006 18:55
Wohnort: Rupture Farms
Gadget > (Alle Gadgets) > Gadget animiert verschieben
Code:
EnableExplicit

#SB_Gadget_Animation_Linear = 1
#SB_Gadget_Animation_Ease = 2
#SB_Gadget_Animation_EaseIn = 3
#SB_Gadget_Animation_EaseOut = 4
#SB_Gadget_Animation_EaseInOut = 5

Procedure SetGadgetAnimation(gadget, effect, duration.f, delay.f)
  Protected styles.s
  Protected id.s
  Protected animation_effect.s
 
  ;Falls nicht existiert, dann <style type="text/css" id="SBCustomStyles"></style> im Head erstellen, ohne Inline-Styles verwenden zu müssen
  ! if (!document.getElementById('SBCustomStyles')) {
  !   var StyleElement = document.createElement('style');
  !   StyleElement.type = 'text/css';
  !   StyleElement.id = 'SBCustomStyles';
  !   var HeadElement = document.getElementsByTagName('head')[0];
  !   HeadElement.appendChild(StyleElement);
  ! }
 
  ;Falls nicht existiert, dann eine ID im Hauptelement erstellen, um später per CSS besser darauf zugreifen zu können
  ! var GadgetElement = $(spider_GadgetID(v_gadget).div);
  ! if (GadgetElement.attr("id")) {
  !   v_id = GadgetElement.attr("id");
  ! } else {
  !   GadgetElement.attr("id", "SB_Gadget_" + v_gadget);
  !   v_id = GadgetElement.attr("id");
  ! }
 
  Select effect
    Case #SB_Gadget_Animation_Linear
      animation_effect = "linear"
    Case #SB_Gadget_Animation_Ease
      animation_effect = "ease"
    Case #SB_Gadget_Animation_EaseIn
      animation_effect = "ease-in"
    Case #SB_Gadget_Animation_EaseOut
      animation_effect = "ease-out"
    Case #SB_Gadget_Animation_EaseInOut
      animation_effect = "ease-in-out"
  EndSelect
 
  styles = ""
  styles + "#" + id + " { -webkit-transition: all " + duration + "s " + animation_effect + " " + delay + "s; transition: all " + duration + "s " + animation_effect + " " + delay + "s; opacity: 1; visibility: visible; } "
  styles + "#" + id + " * { -webkit-transition: all " + duration + "s " + animation_effect + " " + delay + "s; transition: all " + duration + "s " + animation_effect + " " + delay + "s; opacity: 1; visibility: visible; } "
  styles + "#" + id + ".HideGadget { opacity: 0; visibility: hidden; }"
 
  ;Styles hinzufügen
  ! document.getElementById("SBCustomStyles").appendChild(document.createTextNode( v_styles ));
  ! GadgetElement.addClass("HasAnimation");
 
EndProcedure

;================================================== Beispielcode ==================================================

Procedure GadgetEvent()
  Select EventGadget()
    Case 2
      ResizeGadget(1, 280, #PB_Ignore, #PB_Ignore, #PB_Ignore)
  EndSelect
 
EndProcedure

If OpenWindow(0, 0, 0, 500, 400, "Window", #PB_Window_ScreenCentered)
  ButtonGadget(1, 10, 10, 210, 200, "Button", 0)
  ButtonGadget(2, 10, 220, 100, 100, "Move", 0)
 
  SetGadgetAnimation(1, #SB_Gadget_Animation_EaseInOut, 1, 0)
 
  BindEvent(#PB_Event_Gadget, @GadgetEvent())
 
EndIf

_________________
BildBildBildBildBildBild


Nach oben
 Profil  
Mit Zitat antworten  
 Betreff des Beitrags: Re: SpiderBasic Library - Liste individueller Style-Beispiel
BeitragVerfasst: 15.10.2018 09:56 
Offline
Moderator
Benutzeravatar

Registriert: 05.10.2006 18:55
Wohnort: Rupture Farms
Gadget > (Alle Gadgets) > Gadget animiert vergrößern und verkleinern
Code:
EnableExplicit

#SB_Gadget_Animation_Linear = 1
#SB_Gadget_Animation_Ease = 2
#SB_Gadget_Animation_EaseIn = 3
#SB_Gadget_Animation_EaseOut = 4
#SB_Gadget_Animation_EaseInOut = 5

Procedure SetGadgetAnimation(gadget, effect, duration.f, delay.f)
  Protected styles.s
  Protected id.s
  Protected animation_effect.s
 
  ;Falls nicht existiert, dann <style type="text/css" id="SBCustomStyles"></style> im Head erstellen, ohne Inline-Styles verwenden zu müssen
  ! if (!document.getElementById('SBCustomStyles')) {
  !   var StyleElement = document.createElement('style');
  !   StyleElement.type = 'text/css';
  !   StyleElement.id = 'SBCustomStyles';
  !   var HeadElement = document.getElementsByTagName('head')[0];
  !   HeadElement.appendChild(StyleElement);
  ! }
 
  ;Falls nicht existiert, dann eine ID im Hauptelement erstellen, um später per CSS besser darauf zugreifen zu können
  ! var GadgetElement = $(spider_GadgetID(v_gadget).div);
  ! if (GadgetElement.attr("id")) {
  !   v_id = GadgetElement.attr("id");
  ! } else {
  !   GadgetElement.attr("id", "SB_Gadget_" + v_gadget);
  !   v_id = GadgetElement.attr("id");
  ! }
 
  Select effect
    Case #SB_Gadget_Animation_Linear
      animation_effect = "linear"
    Case #SB_Gadget_Animation_Ease
      animation_effect = "ease"
    Case #SB_Gadget_Animation_EaseIn
      animation_effect = "ease-in"
    Case #SB_Gadget_Animation_EaseOut
      animation_effect = "ease-out"
    Case #SB_Gadget_Animation_EaseInOut
      animation_effect = "ease-in-out"
  EndSelect
 
  styles = ""
  styles + "#" + id + " { -webkit-transition: all " + duration + "s " + animation_effect + " " + delay + "s; transition: all " + duration + "s " + animation_effect + " " + delay + "s; opacity: 1; visibility: visible; } "
  styles + "#" + id + " * { -webkit-transition: all " + duration + "s " + animation_effect + " " + delay + "s; transition: all " + duration + "s " + animation_effect + " " + delay + "s; opacity: 1; visibility: visible; } "
  styles + "#" + id + ".HideGadget { opacity: 0; visibility: hidden; }"
 
  ;Styles hinzufügen
  ! document.getElementById("SBCustomStyles").appendChild(document.createTextNode( v_styles ));
  ! GadgetElement.addClass("HasAnimation");
 
EndProcedure

;================================================== Beispielcode ==================================================

Procedure GadgetEvent()
  Select EventGadget()
    Case 2
      ResizeGadget(1, #PB_Ignore, #PB_Ignore, 480, 270)
  EndSelect
 
EndProcedure

If OpenWindow(0, 0, 0, 500, 400, "Window", #PB_Window_ScreenCentered)
  ButtonGadget(1, 10, 10, 100, 100, "Button", 0)
  ButtonGadget(2, 10, 290, 480, 100, "Size", 0)
 
  SetGadgetAnimation(1, #SB_Gadget_Animation_EaseInOut, 1, 0)
 
  BindEvent(#PB_Event_Gadget, @GadgetEvent())
 
EndIf

_________________
BildBildBildBildBildBild


Nach oben
 Profil  
Mit Zitat antworten  
 Betreff des Beitrags: Re: SpiderBasic Library - Liste individueller Style-Beispiel
BeitragVerfasst: 15.10.2018 10:19 
Offline
Moderator
Benutzeravatar

Registriert: 05.10.2006 18:55
Wohnort: Rupture Farms
Gadget > (Alle Gadgets) > Gadget in 3D drehen
Code:
EnableExplicit

Procedure SetGadgetRotate3D(gadget, x, y, z, degree, perspective_width = 0)
  Protected id.s
 
  ;Falls nicht existiert, dann eine ID im Hauptelement erstellen, um später per CSS besser darauf zugreifen zu können
  ! var GadgetElement = $(spider_GadgetID(v_gadget).div);
  ! if (GadgetElement.attr("id")) {
  !   v_id = GadgetElement.attr("id");
  ! } else {
  !   GadgetElement.attr("id", "SB_Gadget_" + v_gadget);
  !   v_id = GadgetElement.attr("id");
  ! }
 
  ;Styles setzen
  ! GadgetElement.css("perspective", v_perspective_width + "px");
  ! GadgetElement.children().css("transform", "rotate3d(" + v_x + ", " + v_y + ", " + v_z + ", " + v_degree + "deg)");
 
EndProcedure

;================================================== Beispielcode ==================================================

Global angle

LoadFont(1, "", 25)

Procedure TimerEvents()
  Select EventTimer()
    Case 1
      angle + 1
      SetGadgetRotate3D(1, 1, 0, 0, angle, 600)
      SetGadgetRotate3D(2, 0, 1, 0, angle)
      SetGadgetRotate3D(3, 0, 0, 1, angle)
      SetGadgetRotate3D(4, 1, 1, 0, angle)
      If angle = 360
        angle = 0
      EndIf
     
  EndSelect
EndProcedure

If OpenWindow(0, 0, 0, 500, 400, "Window", #PB_Window_ScreenCentered)
  ButtonGadget(1, 50, 50, 150, 150, "Button", 0)
  ButtonGadget(2, 300, 50, 150, 150, "Button", 0)
  ButtonGadget(3, 50, 250, 150, 150, "Button", 0)
  ButtonGadget(4, 300, 250, 150, 150, "Button", 0)
 
  SetGadgetFont(1, FontID(1))
  SetGadgetFont(2, FontID(1))
  SetGadgetFont(3, FontID(1))
  SetGadgetFont(4, FontID(1))
 
  AddWindowTimer(0, 1, 50)
  BindEvent(#PB_Event_Timer, @TimerEvents())
 
EndIf

_________________
BildBildBildBildBildBild


Nach oben
 Profil  
Mit Zitat antworten  
 Betreff des Beitrags: Re: SpiderBasic Library - Liste neuer Funktionen
BeitragVerfasst: 15.10.2018 11:21 
Offline
Benutzeravatar

Registriert: 08.09.2004 08:53
@RSBasic: vielen Dank!! Echt Super!!!

Bei SetGadgetItemColor() ist mir aufgefallen, dass das Färben immer langsamer wird:

Code:
EnableExplicit

Procedure SetGadgetItemColor(gadget, item, colortype, color, column)
  Protected styles.s
  Protected id.s
  Protected sb_id.s
  Protected hexcolor.s
 
  ;Falls nicht existiert, dann <style type="text/css" id="SBCustomStyles"></style> im Head erstellen, ohne Inline-Styles verwenden zu müssen
  ! if (!document.getElementById('SBCustomStyles')) {
  !   var StyleElement = document.createElement('style');
  !   StyleElement.type = 'text/css';
  !   StyleElement.id = 'SBCustomStyles';
  !   var HeadElement = document.getElementsByTagName('head')[0];
  !   HeadElement.appendChild(StyleElement);
  ! }
 
  ;Falls nicht existiert, dann eine ID im Hauptelement erstellen, um später per CSS besser darauf zugreifen zu können
  ! var GadgetElement = $(spider_GadgetID(v_gadget).div);
  ! if (GadgetElement.attr("id")) {
  !   v_id = GadgetElement.attr("id");
  ! } else {
  !   GadgetElement.attr("id", "SB_Gadget_" + v_gadget);
  !   v_id = GadgetElement.attr("id");
  ! }
 
  ;RGB in Hex konvertieren
  hexcolor = "#" + RSet(Hex(Red(color)), 2, "0") + RSet(Hex(Green(color)), 2, "0") + RSet(Hex(Blue(color)), 2, "0")
 
  ;SB-Hauptelement ermitteln
  ! v_sb_id = spider_GadgetID(v_gadget).gadget.id;
 
  ;Unterstützte Gadgets und deren Style-Erstellungen
  Select GadgetType(gadget)
    Case #PB_GadgetType_ListIcon
      If item = -1
        Select colortype
          Case #PB_Gadget_FrontColor
            styles = "#" + id + " #" + sb_id + "-header .dgrid-column-" + column + " { color: " + hexcolor + "; }"
          Case #PB_Gadget_BackColor
            styles = "#" + id + " #" + sb_id + "-header .dgrid-column-" + column + " { background-color: " + hexcolor + "; }"
        EndSelect
      Else
        Select colortype
          Case #PB_Gadget_FrontColor
            styles = "#" + id + " #" + sb_id + "-row-" + item + " .dgrid-column-" + column + " { color: " + hexcolor + "; }"
          Case #PB_Gadget_BackColor
            styles = "#" + id + " #" + sb_id + "-row-" + item + " .dgrid-column-" + column + " { background-color: " + hexcolor + "; }"
        EndSelect
      EndIf
    Case #PB_GadgetType_Tree
      item = item + 2
      If column = 0
        Select colortype
          Case #PB_Gadget_FrontColor
            styles = "#" + id + " #" + sb_id + " #dijit__TreeNode_" + item + " > .dijitTreeRow { color: " + hexcolor + "; }"
          Case #PB_Gadget_BackColor
            styles = "#" + id + " #" + sb_id + " #dijit__TreeNode_" + item + " > .dijitTreeRow { background-color: " + hexcolor + "; }"
        EndSelect
      Else
        Select colortype
          Case #PB_Gadget_FrontColor
            styles = "#" + id + " #" + sb_id + " #dijit__TreeNode_" + item + " > .dijitTreeNodeContainer > .dijitTreeNode:nth-child(" + column + ") { color: " + hexcolor + "; }"
          Case #PB_Gadget_BackColor
            styles = "#" + id + " #" + sb_id + " #dijit__TreeNode_" + item + " > .dijitTreeNodeContainer > .dijitTreeNode:nth-child(" + column + ") { background-color: " + hexcolor + "; }"
        EndSelect
      EndIf
  EndSelect
 
  ;Styles hinzufügen
  ! document.getElementById("SBCustomStyles").appendChild(document.createTextNode( v_styles ));
 
EndProcedure

;================================================== Beispielcode ==================================================

Define a, time, n

If OpenWindow(0, 0, 0, 500, 400, "Window", #PB_Window_ScreenCentered)
  ListIconGadget(1, 10, 10, WindowWidth(0)-20, WindowHeight(0)-20, "Spalte 1", 200, #PB_ListIcon_GridLines)
  AddGadgetColumn(1, 1, "Spalte 2", 200)
 
  For a=1 To 250
    AddGadgetItem(1, -1, "Item " + Str(a) + Chr(10) + "More Text")
  Next
 
  SetGadgetItemColor(1, -1, #PB_Gadget_BackColor, RGB(0, 0, 255), 1)
  SetGadgetItemColor(1, -1, #PB_Gadget_FrontColor, RGB(255, 255, 255), 1)
  SetGadgetItemColor(1, 5, #PB_Gadget_FrontColor, RGB(255, 0, 0), 0)
  SetGadgetItemColor(1, 6, #PB_Gadget_FrontColor, RGB(0, 100, 0), 1)
  SetGadgetItemColor(1, 7, #PB_Gadget_BackColor, RGB(100, 100, 100), 0)
  SetGadgetItemColor(1, 7, #PB_Gadget_BackColor, RGB(100, 100, 100), 1)
  SetGadgetItemColor(1, 7, #PB_Gadget_FrontColor, RGB(255, 255, 255), 0)
  SetGadgetItemColor(1, 7, #PB_Gadget_FrontColor, RGB(255, 255, 255), 1)
 
  For n = 1 To 10
 
  time = ElapsedMilliseconds()
 
  For a=1 To 250
    If Random(2, 1) = 1
      SetGadgetItemColor(1, a, #PB_Gadget_BackColor, #Red, 0)
    Else
      SetGadgetItemColor(1, a, #PB_Gadget_BackColor, -1, 0)
    EndIf
  Next
 
  Debug ElapsedMilliseconds() - time
  Next

 
EndIf

_________________
"Papa, ich laufe schneller, dann ist es nicht so weit."


Nach oben
 Profil  
Mit Zitat antworten  
 Betreff des Beitrags: Re: SpiderBasic Library - Liste neuer Funktionen
BeitragVerfasst: 15.10.2018 11:34 
Offline
Moderator
Benutzeravatar

Registriert: 05.10.2006 18:55
Wohnort: Rupture Farms
Das liegt daran, dass er bei jeder einzelnen Zelle, die von dir farbig geändert werden soll, einen neuen CSS-Eintrag im Style-Block im Head-Bereich hinzufügt, was ja normal ist, aber in deinem Beispiel bei 2500 Styles wird die Javascript-Funktion appendChild immer langsamer, da er jedes Mal an das Ende dieses Elements springen muss. Ob es eine schnellere Funktion gibt, ist mir nicht bekannt.

_________________
BildBildBildBildBildBild


Nach oben
 Profil  
Mit Zitat antworten  
 Betreff des Beitrags: Re: SpiderBasic Library - Liste neuer Funktionen
BeitragVerfasst: 15.10.2018 12:46 
Offline
Benutzeravatar

Registriert: 08.09.2004 08:53
Also ist der Code prinzipiell nur für das einmalige Einfärben einer Listbox geeignet? Bestünde denn die Möglichkeit, statt jedes Mal einen Knoten hinzuzufügen, den bereits bestehenden zu ändern?

_________________
"Papa, ich laufe schneller, dann ist es nicht so weit."


Nach oben
 Profil  
Mit Zitat antworten  
 Betreff des Beitrags: Re: SpiderBasic Library - Liste neuer Funktionen
BeitragVerfasst: 15.10.2018 13:27 
Offline
Benutzeravatar

Registriert: 08.03.2013 14:27
Wohnort: ERB
Versehentlich Doppelpost

_________________
PBExpress
Lightweight PureBasic FastCGI Framework

Github: https://github.com/reVerBxTc/PBExpress
Wiki: https://github.com/reVerBxTc/PBExpress/wiki


Zuletzt geändert von TroaX am 15.10.2018 13:31, insgesamt 1-mal geändert.

Nach oben
 Profil  
Mit Zitat antworten  
 Betreff des Beitrags: Re: SpiderBasic Library - Liste neuer Funktionen
BeitragVerfasst: 15.10.2018 13:30 
Offline
Benutzeravatar

Registriert: 08.03.2013 14:27
Wohnort: ERB
Mit CSS 3 wird sowas in der Regel mit den Pseudo-Funktionen (Selektor-Funktionen) zur Kaskaden Navigierung erledigt z.B. :nth-child()

http://maddesigns.de/nth-child-pseudo-s ... 3-550.html

Wenn man das mit Spiderbasic versucht, zu abstrahieren, kann es zu diesem Effekt kommen, weil oftmals durch häufige Methoden-Aufrufe im Javascript dieser Vorgang sehr rechenintensiv wird und somit dieser Prozess sehr lange dauern könnte.

_________________
PBExpress
Lightweight PureBasic FastCGI Framework

Github: https://github.com/reVerBxTc/PBExpress
Wiki: https://github.com/reVerBxTc/PBExpress/wiki


Nach oben
 Profil  
Mit Zitat antworten  
Beiträge der letzten Zeit anzeigen:  Sortiere nach  
Ein neues Thema erstellen Auf das Thema antworten  [ 76 Beiträge ]  Gehe zu Seite Vorherige  1, 2, 3, 4, 5 ... 8  Nächste

Alle Zeiten sind UTC + 1 Stunde [ Sommerzeit ]


Wer ist online?

Mitglieder in diesem Forum: 0 Mitglieder und 0 Gäste


Sie dürfen keine neuen Themen in diesem Forum erstellen.
Sie dürfen keine Antworten zu Themen in diesem Forum erstellen.
Sie dürfen Ihre Beiträge in diesem Forum nicht ändern.
Sie dürfen Ihre Beiträge in diesem Forum nicht löschen.

Suche nach:
Gehe zu:  

 


Powered by phpBB © 2008 phpBB Group | Deutsche Übersetzung durch phpBB.de
subSilver+ theme by Canver Software, sponsor Sanal Modifiye