Presentation pour un menu style FrontEnd ou mediacenter

Partagez votre expérience de PureBasic avec les autres utilisateurs.
Avatar de l’utilisateur
Thyphoon
Messages : 2706
Inscription : mer. 25/août/2004 6:31
Localisation : Eragny
Contact :

Presentation pour un menu style FrontEnd ou mediacenter

Message par Thyphoon »

J'ai essayé de vous ressortir ce que j'ai codé pour faire des menu qui défile genre (FrontEnd ou MediaCenter)
Il suffit de définir un chemin part quelques point et de donner quelques paramètres pour avoir une présentation sympa !
j'ai supprimer ici le "easing" car ça faisait un code beaucoup trop long, mais il est très facile a implémenter (si certain son demandeur je vous donnerais tout ça)
Actuellement le chemin utilise une CatMull Rom, mais on doit pouvoir utiliser une courbe de Bezier (sauf que pour l'instant ça ne marche pas)

Un exemple vaut mieux qu'un long discourt ! et comme d'habitude toute critique/amélioration/idée est la bienvenu
Utiliser les touches Gauche et Droite pour faire défiler !
Edit:Le code est pas super propre, mais comme je manque de temps,c'est ça ou sinon je posterais jamais rien ... :P

Code : Tout sélectionner

#AppName="Demo"
;On initialise
If InitSprite()=0
  MessageRequester("Error", "Can't Initialize DirectX Sprite", 0)
  End
EndIf
If InitKeyboard()=0
  MessageRequester("Error", "Can't Initialize DirectX input", 0)
  End
EndIf
If InitSprite3D()=0
  MessageRequester("Error", "Can't Initialize DirectX 3D", 0)
EndIf


Structure Prefs
  ScreenWidth.l
  ScreenHeight.l
  FullScreen.b
EndStructure

Global Prefs.Prefs

Prefs\ScreenWidth.l=800
Prefs\ScreenHeight.l=600
Prefs\FullScreen.b=#False

;ExamineDesktops ()
;X_ecran= DesktopWidth (0)
;y_ecran= DesktopHeight (0)

Select Prefs\FullScreen
  Case #True ; Ouverture en plein ecran
    OpenScreen(Prefs\ScreenWidth, Prefs\ScreenHeight,32,#AppName)
  Case #False ; Ouverture dans une Fenêtre
    #W_Screen=0
    OpenWindow(#W_Screen, 0, 0, Prefs\ScreenWidth, Prefs\ScreenHeight, #AppName, #PB_Window_ScreenCentered)
    OpenWindowedScreen(WindowID(#W_Screen), 0, 0, Prefs\ScreenWidth, Prefs\ScreenHeight, 1, 0, 0)
EndSelect

;Move
; t doit varier de 0 a 1 (0 étant le point de départ et 1 le point d'arrivé)
; CATMULL ROM FUNCTIONALITY
Procedure CatmullRomSpline(t.f, *result.point, *p0.point, *p1.point, *p2.point, *p3.point)

   t2.f = t * t
   t3.f = t2 * t
   *result\x = 0.5 *(( 2.0 * *p1\x) +(- *p0\x + *p2\x) * t +(2.0 * *p0\x - 5.0 * *p1\x + 4 * *p2\x - *p3\x) * t2 +(- *p0\x + 3.0 * *p1\x - 3.0 * *p2\x + *p3\x) * t3)
   *result\y = 0.5 *(( 2.0 * *p1\y) +(- *p0\y + *p2\y) * t +(2.0 * *p0\y - 5.0 * *p1\y + 4 * *p2\y - *p3\y) * t2 +(- *p0\y + 3.0 * *p1\y - 3.0 * *p2\y + *p3\y) * t3)
 EndProcedure
 
 Procedure beziersSpline(t.f, *result.point, *p1.point, *p0.point, *p3.point, *p2.point)
   a.f = (1 - t)
   b.f = a * a
   c.f = a * a * a
   d.f = t * t
   e.f = d * t
   *result\x = *p0\x * c + 3 * *p1\x * b * t + 3 * *p2\x * a * d + *p3\x * e
   *result\y = *p0\y * c + 3 * *p1\y * b * t + 3 * *p2\y * a * d + *p3\y * e
EndProcedure

; Structure d'un Chemin

Structure wayPoint
  x.w 
  y.w
  ease.w
EndStructure

Structure mainpath
  ;#Public  
  timeToNextPoint.i ; Temps pour aller d'un point du chemin a un autre
  timeSpace.i       ; Temps pour passer d'un element a un autre
  beforeElement.w   ; Nombre d'Element a afficher avant le point de reference
  afterElement.w    ; Nombre d'Element a afficher apres le point de reference
  fromPoint.w       ; Le point de reference pour les elements
  selected.i        ; Element selectionné
  *DrawCallBack     ; Pointer vers la fonction qui dessinera l'element
  ;#Private
  direction.b       ;-1 en arrière / 0 Ne bouge pas / +1 en avant
  speed.f           ; Vitesse de defilement
  startTime.i       ; Moment du démarrage du mouvement
  lastMovementTime.i; Moment ou a eu lieu le dernier mouvement (sert a l'acceleration du defilement)
  List wayPoint.wayPoint()
EndStructure

;Ajout d'un point a un chemin
Procedure PathAddPoint(*path.mainpath,x.l,y.l,ease.w)
  AddElement(*path\wayPoint()):*path\wayPoint()\x=x:*path\wayPoint()\y=y:*path\wayPoint()\ease=ease
EndProcedure  

;Passer a l'Element suivant
Procedure PathNext(*path.mainpath)
  If ElapsedMilliseconds()>*path\lastMovementTime+200
    *path\speed=1;
  ElseIf *path\speed>0.05
    *path\speed=*path\speed-0.005
  EndIf
  *path\lastMovementTime=ElapsedMilliseconds()
  If *path\direction=0
    *path\startTime=ElapsedMilliseconds()
    *path\direction=1
   
  EndIf
EndProcedure

;Passer a l'Element d'avant
Procedure PathPrevious(*path.mainpath)
    If ElapsedMilliseconds()>*path\lastMovementTime+200
    *path\speed=1;
  ElseIf *path\speed>0.05
    *path\speed=*path\speed-0.005
  EndIf
  *path\lastMovementTime=ElapsedMilliseconds()
  
  *path\lastMovementTime=ElapsedMilliseconds()
  If *path\direction=0
    *path\startTime=ElapsedMilliseconds()
    *path\direction=-1
  EndIf
EndProcedure


Procedure drawPathElement(*path.mainpath,i)
  Protected p0.point, p1.point,p2.point,p3.point,p.point,t.f
  
  focusPoint=*path\fromPoint ; le point ou time=0
  If *path\speed<=0:*path\speed=1:EndIf
  
  timetoNextPoint=*path\timeToNextPoint**path\speed
  timeSpace=*path\timeSpace**path\speed
  
  If *path\direction>0
    movetime=(ElapsedMilliseconds()-*path\startTime)
  ElseIf *path\direction<0
    movetime=timetoNextPoint-(ElapsedMilliseconds()-*path\startTime) 
    focusPoint-1
  Else
    movetime=0
  EndIf
  movetime=movetime+i*timeSpace
  
  If movetime<0
    n=Abs(movetime)/timetoNextPoint
    movetime=movetime+timetoNextPoint*(n+1):focusPoint-n-1:
  EndIf
  
  n=Int(movetime/timetoNextPoint)  
  movetime=movetime-timetoNextPoint*n:focusPoint+n:
  
  index=focusPoint-1:If index<0:index=0:EndIf:If index>ListSize(*path\wayPoint())-1:index=ListSize(*path\wayPoint())-1:EndIf
  SelectElement(*path\wayPoint(),index):p0\x=*path\wayPoint()\x:p0\y=*path\wayPoint()\y
  index=focusPoint:If index<0:index=0:EndIf:If index>ListSize(*path\wayPoint())-1:index=ListSize(*path\wayPoint())-1:EndIf
  SelectElement(*path\wayPoint(),index):p1\x=*path\wayPoint()\x:p1\y=*path\wayPoint()\y
  index=focusPoint+1:If index<0:index=0:EndIf:If index>ListSize(*path\wayPoint())-1:index=ListSize(*path\wayPoint())-1:EndIf
  SelectElement(*path\wayPoint(),index):p2\x=*path\wayPoint()\x:p2\y=*path\wayPoint()\y:
  index=focusPoint+2:If index<0:index=0:EndIf:If index>ListSize(*path\wayPoint())-1:index=ListSize(*path\wayPoint())-1:EndIf
  SelectElement(*path\wayPoint(),index):p3\x=*path\wayPoint()\x:p3\y=*path\wayPoint()\y
  
  t=movetime/timetoNextPoint
  
  CatmullRomSpline(t, p, p0, p1, p2, p3)
  ;beziersSpline(t, p, p0, p1, p2, p3)
  
  If *path\DrawCallBack=0
    Circle (p\x,p\y,10,#Red)
  Else
    CallFunctionFast(*path\DrawCallBack,p\x,p\y,i+*path\selected)
  EndIf
  
  If *path\direction<>0 And (ElapsedMilliseconds()-*path\startTime)>timeSpace
    
    If *path\direction>0
      *path\selected-1
    ElseIf *path\direction<0
      *path\selected+1
    EndIf
    
    *path\direction=0
    
  EndIf
  
  
EndProcedure


 Procedure DrawPath(*path.mainpath)   
    For z=*path\AfterElement To 1 Step-1
      drawPathElement(*path,z)
    Next
    
    For z=-*path\BeforeElement To -1 Step 1
      drawPathElement(*path,z)
    Next
    drawPathElement(*path,0)
  EndProcedure
 

;-Initialisation du chemin
path.mainpath             ; Creation d'un nouveau Chemin
;Les points definissant le chemin
PathAddPoint(@path,50,-50,0)
PathAddPoint(@path,50,350,0)
PathAddPoint(@path,400,300,0)
PathAddPoint(@path,750,350,0)
PathAddPoint(@path,800,-50,0)
path\timeToNextPoint=5000 ; Temps pour aller d'un point a un autre
Path\timeSpace=1000       ; temps entre les différents elements 
path\fromPoint=2          ; Le point de reference
path\afterElement=10      ; Nombre d'Element Avant
path\beforeElement=10     ; Nombre d'Element Apres

Procedure DrawTest(x,y,n)
  Box(x-25,y-50,50,100,#Red)
  Box(x-24,y-49,48,98,#Gray)
  DrawText(x,y,Str(n),#Black,#Gray)
EndProcedure

path\DrawCallBack=@DrawTest() ;Configuration de la fonction a utiliser pour dessiner un element


Repeat
      
  ;Si nous somme dans une fenêtre il faut traiter tout les elements    
  If Prefs\FullScreen=#False
      Repeat
        Event = WindowEvent()
          Select Event 
            Case #PB_Event_CloseWindow
              End 
          EndSelect
      Until Event = 0  
  EndIf
  
  ExamineKeyboard()
  If KeyboardPushed(#PB_Key_Right)
    PathNext(@path)
  EndIf
  
  If KeyboardPushed(#PB_Key_Left)
    PathPrevious(@path)
  EndIf
  
  If KeyboardPushed(#PB_Key_Escape)
    End
  EndIf
  
  FlipBuffers() 
  ClearScreen(RGB(0, 0, 0))

  StartDrawing(ScreenOutput())

  DrawPath(@path) 

  DrawText(400,50,Str(path\selected))
  StopDrawing()
  Delay(1)
ForEver
Avatar de l’utilisateur
Ar-S
Messages : 9540
Inscription : dim. 09/oct./2005 16:51
Contact :

Re: Presentation pour un menu style FrontEnd ou mediacenter

Message par Ar-S »

J'ai pas regardé le code j'ai juste lancé un aperçu, c'est excellent !
~~~~Règles du forum ~~~~
⋅.˳˳.⋅ॱ˙˙ॱ⋅.˳Ar-S ˳.⋅ॱ˙˙ॱ⋅.˳˳.⋅
W11x64 PB 6.x
Section HORS SUJET : ICI
LDV MULTIMEDIA : Dépannage informatique & mes Logiciels PB
UPLOAD D'IMAGES : Uploader des images de vos logiciels
Avatar de l’utilisateur
Thyphoon
Messages : 2706
Inscription : mer. 25/août/2004 6:31
Localisation : Eragny
Contact :

Re: Presentation pour un menu style FrontEnd ou mediacenter

Message par Thyphoon »

Ar-S a écrit :J'ai pas regardé le code j'ai juste lancé un aperçu, c'est excellent !
Merci :D
Je suis assez content du résultat. le code est pas trop mal, mais je suis pas satisfait des noms des procédures et des variables et faudrait que je commente un peu plus le code:oP
Et j'ai d'autre amélioration qui son prévu !
Backup
Messages : 14526
Inscription : lun. 26/avr./2004 0:40

Re: Presentation pour un menu style FrontEnd ou mediacenter

Message par Backup »

super cool :)

pourrai faire un viewer d'image ça :)
Avatar de l’utilisateur
Kwai chang caine
Messages : 6989
Inscription : sam. 23/sept./2006 18:32
Localisation : Isere

Re: Presentation pour un menu style FrontEnd ou mediacenter

Message par Kwai chang caine »

Super bien l'effet et super fluide 8O
Merci beaucoup 8)
ImageLe bonheur est une route...
Pas une destination

PureBasic Forum Officiel - Site PureBasic
Avatar de l’utilisateur
Ar-S
Messages : 9540
Inscription : dim. 09/oct./2005 16:51
Contact :

Re: Presentation pour un menu style FrontEnd ou mediacenter

Message par Ar-S »

Dobro a écrit :super cool :)

pourrai faire un viewer d'image ça :)
Ouaip ou un JukeBox audio ou vidéo ^^
En ce moment je bosse pas mal, j'ai pas le temps de m'y mettre, j'essayerai de regarder ça dans la nuit si j'ai encore un bout de cerveau qui fonctionne :)
~~~~Règles du forum ~~~~
⋅.˳˳.⋅ॱ˙˙ॱ⋅.˳Ar-S ˳.⋅ॱ˙˙ॱ⋅.˳˳.⋅
W11x64 PB 6.x
Section HORS SUJET : ICI
LDV MULTIMEDIA : Dépannage informatique & mes Logiciels PB
UPLOAD D'IMAGES : Uploader des images de vos logiciels
Avatar de l’utilisateur
Thyphoon
Messages : 2706
Inscription : mer. 25/août/2004 6:31
Localisation : Eragny
Contact :

Re: Presentation pour un menu style FrontEnd ou mediacenter

Message par Thyphoon »

Dobro a écrit :super cool :)
pourrai faire un viewer d'image ça :)
Content que ça te plaise ! :oP
Kwai chang caine a écrit :Super bien l'effet et super fluide 8O
Merci beaucoup 8)
De rien ! Mais il faut que je rajoute la possibilité de changer la taille des éléments et aussi leurs transparences pour avoir plus de liberté sur la présentation.
Ar-S a écrit : Ouaip ou un JukeBox audio ou vidéo ^^
En ce moment je bosse pas mal, j'ai pas le temps de m'y mettre, j'essayerai de regarder ça dans la nuit si j'ai encore un bout de cerveau qui fonctionne :)
Mon but est de faire un MediaCenter/FrontEnd aussi bien pour lancer des jeux d'arcade dans mame, mais aussi pour gérer toute les séries et film qu'on sur disque dur ! Je sais qu'il existe déjà des applications qui font ça, mais pas comme je voudrais :P
Et puis le défit m'amuse.
J'ai réussi a piloter complétement VLC via purebasic ! Je partagerais le code, mais je dois le mettre un peu au propre avant !
Backup
Messages : 14526
Inscription : lun. 26/avr./2004 0:40

Re: Presentation pour un menu style FrontEnd ou mediacenter

Message par Backup »

tu devrai t'inspirer de ce code , qui utilise un fenetre en lieu et place d'un sprite

ça permetrai d'avoir ton menu directement sur le bureau ;)

Code : Tout sélectionner

Enumeration
   #window
   #gadget_image
   #image
EndEnumeration

ExamineDesktops()
xMax =DesktopWidth(0)
yMax=DesktopHeight(0)
DepX = 6 : DepY = 8

x.l : y.l

hWnd1 = OpenWindow(#window,0,0,100,100,"Carré", #PB_Window_BorderLess )

himg = CreateImage(#image,  100  ,100) ; Crée et colorise le rectangle
StartDrawing(ImageOutput(#image))
   Box(0,0,100,100,RGB(Random(255),Random(255),Random(255)))
StopDrawing()

ImageGadget(#gadget_image,0,0,100,100,ImageID(#image))


StickyWindow(#window,1)
;AddKeyboardShortcut(#window  ,#PB_Shortcut_Escape  ,0)

Repeat
  Repeat
    event = WindowEvent()
    Select event
      Case #PB_Event_CloseWindow
      End
      Case #PB_Event_Menu
      End
  EndSelect
  Until event = 0
   
   x + DepX : y + DepY
   If x >= xMax-100 Or x <=0 : DepX = -DepX : EndIf
   If y >= yMax-100 Or y <=0 : DepY = -DepY : EndIf
   
   ResizeWindow(#window,x,y,#PB_Ignore,#PB_Ignore)
   Delay(20)
   
 ForEver
;EPB
dans ton cas , chaque "rectangle" serai donc une fenetre ... ça ouvre des porte a plein de chose du coup

et ça te sort du mode graphique ...

insertion d'images, d'interface , de videos .. l'imagination power :)
Avatar de l’utilisateur
Ar-S
Messages : 9540
Inscription : dim. 09/oct./2005 16:51
Contact :

Re: Presentation pour un menu style FrontEnd ou mediacenter

Message par Ar-S »

Je te dis pas le nombre de fenêtre que ce prog génèrerait sur mon PC...
déjà 2900 photos de voyages... :mrgreen: sans compter le reste bien plus conséquent.
~~~~Règles du forum ~~~~
⋅.˳˳.⋅ॱ˙˙ॱ⋅.˳Ar-S ˳.⋅ॱ˙˙ॱ⋅.˳˳.⋅
W11x64 PB 6.x
Section HORS SUJET : ICI
LDV MULTIMEDIA : Dépannage informatique & mes Logiciels PB
UPLOAD D'IMAGES : Uploader des images de vos logiciels
Backup
Messages : 14526
Inscription : lun. 26/avr./2004 0:40

Re: Presentation pour un menu style FrontEnd ou mediacenter

Message par Backup »

Ar-S a écrit :Je te dis pas le nombre de fenêtre que ce prog génèrerait sur mon PC...
déjà 2900 photos de voyages... :mrgreen: sans compter le reste bien plus conséquent.
ben tu utilise que le nombre de fenetre que son petit prg affiche :roll:

le prg de typhon affiche quoi ...10 ,20 "cases"
il suffit de remplir ta fenetre qui apparait au fur a mesure ... et vider celles qui disparait ...
une bonne liste chainée... et hop ... hop hop hop :)
la fenetre qui disparait a droite va reaparaitre a gauche rempli de la suite de la list chainée , et inversement dans l'autre sens :)


a l'ecran il n'y a toujours qu'un nombre limité de fenetre affichées ...

t'es Fatigué Ar-s ? :lol:
Dernière modification par Backup le jeu. 12/avr./2012 17:50, modifié 1 fois.
Avatar de l’utilisateur
Ar-S
Messages : 9540
Inscription : dim. 09/oct./2005 16:51
Contact :

Re: Presentation pour un menu style FrontEnd ou mediacenter

Message par Ar-S »

Ah mais oui évidement.

Et oui je suis vraiment fatigué, j'en vois les symptômes tous les jours... :?
Vivement début mai, je me casse loinnnnn au soleil. vivement j'en ai grandement besoin.
Dernière modification par Ar-S le jeu. 12/avr./2012 17:52, modifié 2 fois.
~~~~Règles du forum ~~~~
⋅.˳˳.⋅ॱ˙˙ॱ⋅.˳Ar-S ˳.⋅ॱ˙˙ॱ⋅.˳˳.⋅
W11x64 PB 6.x
Section HORS SUJET : ICI
LDV MULTIMEDIA : Dépannage informatique & mes Logiciels PB
UPLOAD D'IMAGES : Uploader des images de vos logiciels
Backup
Messages : 14526
Inscription : lun. 26/avr./2004 0:40

Re: Presentation pour un menu style FrontEnd ou mediacenter

Message par Backup »

ouaip :D .. laisse moi une place dans ta valise :lol:
Dernière modification par Backup le jeu. 12/avr./2012 17:58, modifié 2 fois.
Avatar de l’utilisateur
Ar-S
Messages : 9540
Inscription : dim. 09/oct./2005 16:51
Contact :

Re: Presentation pour un menu style FrontEnd ou mediacenter

Message par Ar-S »

Histoire d'ajouter une idée pas con celle ci :)
au lieu d'utiliser les flèches, gérer le positionement de la souris. au centre (+-30px) les cercle d'images se créé.
En déplaçant la souris vers la gauche, les scroll gauche se met en route. Plus le curseur est à gauche, plus le scroll est rapide.
ça permettra un surf fluide et hyper "cool" :D
ouaip :D .. laisse moi une place dans ta valise :lol:
héhé chacun son tour ;D

à la rigueur j'ai une petite place pour ton MSI :mrgreen:
~~~~Règles du forum ~~~~
⋅.˳˳.⋅ॱ˙˙ॱ⋅.˳Ar-S ˳.⋅ॱ˙˙ॱ⋅.˳˳.⋅
W11x64 PB 6.x
Section HORS SUJET : ICI
LDV MULTIMEDIA : Dépannage informatique & mes Logiciels PB
UPLOAD D'IMAGES : Uploader des images de vos logiciels
Backup
Messages : 14526
Inscription : lun. 26/avr./2004 0:40

Re: Presentation pour un menu style FrontEnd ou mediacenter

Message par Backup »

heu ... non :)
Répondre