Image qui ne s'affiche pas en application Android

Rubriques generale concernant SpiderBasic
PCPixMusic
Messages : 106
Inscription : ven. 06/janv./2017 9:50

Image qui ne s'affiche pas en application Android

Message par PCPixMusic »

Bonjour.

J'écris une application de test d'accordeurs de guitare et guitare basse.

Tout fonctionne en version application Web.

Mais en version Android, l'image ,"Images/tetes.png" (test de "Images/tetes.png", mais non plus) ne s'affiche pas.

Pour les sons, je ne sais pas non plus du coup si ça fonctionne.

Voici l'archive se l'application ici : https://drop.chapril.org/download/961dc ... RnaYWo4rcg

Pouvez-vous me dire où est mon erreur s'il vous plaît ?
Merci d'avance pour vos réponses.

Code : Tout sélectionner

;App Name : Mon test
;HTML File Name : index.html
;JavaScript filename : montest.js
;SpiderBasic library path : core
;Coche la Case Copy SpiderBasic libraries

CloseDebugOutput()

Enumeration
  #Fenetre_AC  
  #ID_Canvas
  
  #Image_Ban
  #Info_X
  #Info_Y   
  
  #Font_AC
  
  #MI_BASSE
  #LA_BASSE
  #RE_BASSE
  #SOL_BASSE  
  #MI_GUITARE
  #LA_GUITARE
  #RE_GUITARE
  #SOL_GUITARE
  #SI_GUITARE
  #MI_AIGU_GUITARE
  
  #SOL_VIOLON
  #RE_VIOLON
  #LA_VIOLON
  #MI_VIOLON
  
  #QUITTER
EndEnumeration

;Global.i FX =  (DesktopHeight(#Fenetre_AC) / 2) - 10
;Global.i FY =  (DesktopWidth(#Fenetre_AC) / 2) - 54

;Global.i FX =  448
Global.i FX =  380
Global.i FY =  720
Global.i Taille_Caractere = 20
Global.i MouseX,MouseY

InitSound()

ExamineDesktops()

Procedure PosClic(MouseX.i,MouseY.i, x0.i,y0.i,x1.i,y1.i)   
  If MouseX >= x0 And MouseX <= x0+x1 And MouseY >= y0 And MouseY <= y0+y1
    ProcedureReturn #True
  Else
    ProcedureReturn #False
  EndIf  
EndProcedure

Procedure Charges_Images()  
  LoadImage(#Image_Ban,"Images/tetes.png")    
EndProcedure

Procedure Charges_Sons()
  LoadSound(#MI_BASSE,"Notes/BASSE_4_Cordes/1-MI.wav")
  LoadSound(#LA_BASSE,"Notes/BASSE_4_Cordes/2-LA.wav")
  LoadSound(#RE_BASSE,"Notes/BASSE_4_Cordes/3-RE.wav")
  LoadSound(#SOL_BASSE,"Notes/BASSE_4_Cordes/4-SOL.wav")
  
  LoadSound(#MI_GUITARE,"Notes/GUITARE_6_CORDES/1-MI.wav")
  LoadSound(#LA_GUITARE,"Notes/GUITARE_6_CORDES/2-LA.wav")
  LoadSound(#RE_GUITARE,"Notes/GUITARE_6_CORDES/3-RE.wav")
  LoadSound(#SOL_GUITARE,"Notes/GUITARE_6_CORDES/4-SOL.wav")
  LoadSound(#SI_GUITARE,"Notes/GUITARE_6_CORDES/5-SI.wav")
  LoadSound(#MI_AIGU_GUITARE,"Notes/GUITARE_6_CORDES/6-MI.wav")
  
  ;LoadSound(#SOL_VIOLON,"")
  ;LoadSound(#RE_VIOLON,"")
  ;LoadSound(#LA_VIOLON,"")
  ;LoadSound(#MI_VIOLON,"")
EndProcedure

Procedure CadreCel(X1.i,Y1.i,FacX.i,FacY.i,Color.i)
  LineXY(X1,Y1,X1+FacX,Y1,Color) ;Ligne Horizontale Haut 1
  LineXY(X1,Y1,X1,Y1+FacY,Color) ;Ligne Verticale Gauche 1
  
  LineXY(X1,Y1+1,X1+FacX,Y1+1,Color) ;Ligne Horizontale Haut 2
  LineXY(X1+1,Y1,X1+1,Y1+FacY,Color) ;Ligne Verticale Gauche 2 
  
  LineXY(X1+FacX-1,Y1,X1+FacX-1,Y1+FacY,Color) ;Ligne Verticale Droite 1
  LineXY(X1,Y1+FacY-1,X1+FacX,Y1+FacY-1,Color) ;Ligne Horizontale Bas 1
  
  LineXY(X1+FacX,Y1,X1+FacX,Y1+FacY,Color) ;Ligne Verticale Droite 2
  LineXY(X1,Y1+FacY,X1+FacX,Y1+FacY,Color) ;Ligne Horizontale Bas 1   
EndProcedure

Procedure Cadre_Basse(X1.i,Y1.i,FacX.i,FacY.i,Color.i)
  LineXY(X1,Y1,X1+FacX,Y1,Color) ;Ligne Horizontale Haut 1
  LineXY(X1,Y1,X1,Y1+FacY,Color) ;Ligne Verticale Gauche 1
  
  LineXY(X1,Y1+1,X1+FacX,Y1+1,Color) ;Ligne Horizontale Haut 2
  LineXY(X1+1,Y1,X1+1,Y1+FacY,Color) ;Ligne Verticale Gauche 2 
  
  LineXY(X1+FacX-1,Y1,X1+FacX-1,Y1+FacY,Color) ;Ligne Verticale Droite 1
                                               ;LineXY(X1,Y1+FacY-1,X1+FacX,Y1+FacY-1,Color) ;Ligne Horizontale Bas 1
  
  LineXY(X1+FacX,Y1,X1+FacX,Y1+FacY,Color) ;Ligne Verticale Droite 2
                                           ;LineXY(X1,Y1+FacY,X1+FacX,Y1+FacY,Color) ;Ligne Horizontale Bas 1   
EndProcedure

Procedure Cadre_Guitare_Gauche(X1.i,Y1.i,FacX.i,FacY.i,Color.i)
  LineXY(X1,Y1,X1+FacX,Y1,Color) ;Ligne Horizontale Haut 1
  LineXY(X1,Y1,X1,Y1+FacY,Color) ;Ligne Verticale Gauche 1
  
  LineXY(X1,Y1+1,X1+FacX,Y1+1,Color) ;Ligne Horizontale Haut 2
  LineXY(X1+1,Y1,X1+1,Y1+FacY,Color) ;Ligne Verticale Gauche 2 
  
  ;LineXY(X1+FacX-1,Y1,X1+FacX-1,Y1+FacY,Color) ;Ligne Verticale Droite 1
  LineXY(X1,Y1+FacY-1,X1+FacX,Y1+FacY-1,Color) ;Ligne Horizontale Bas 1
  
  ;LineXY(X1+FacX,Y1,X1+FacX,Y1+FacY,Color) ;Ligne Verticale Droite 2
  LineXY(X1,Y1+FacY,X1+FacX,Y1+FacY,Color) ;Ligne Horizontale Bas 1   
EndProcedure

Procedure Cadre_Guitare_Droit(X1.i,Y1.i,FacX.i,FacY.i,Color.i)
  LineXY(X1,Y1,X1+FacX,Y1,Color) ;Ligne Horizontale Haut 1
                                 ;LineXY(X1,Y1,X1,Y1+FacY,Color) ;Ligne Verticale Gauche 1
  
  LineXY(X1,Y1+1,X1+FacX,Y1+1,Color) ;Ligne Horizontale Haut 2
                                     ;LineXY(X1+1,Y1,X1+1,Y1+FacY,Color) ;Ligne Verticale Gauche 2 
  
  LineXY(X1+FacX-1,Y1,X1+FacX-1,Y1+FacY,Color) ;Ligne Verticale Droite 1
  LineXY(X1,Y1+FacY-1,X1+FacX,Y1+FacY-1,Color) ;Ligne Horizontale Bas 1
  
  LineXY(X1+FacX,Y1,X1+FacX,Y1+FacY,Color) ;Ligne Verticale Droite 2
  LineXY(X1,Y1+FacY,X1+FacX,Y1+FacY,Color) ;Ligne Horizontale Bas 1   
EndProcedure

Procedure BarreIcones()  
  Cadre_Basse(138,60,40,34,#White)    
  Cadre_Basse(181,60,40,34,#White)    
  Cadre_Basse(223,60,40,34,#White)    
  Cadre_Basse(265,60,40,34,#White)  
  
  Cadre_Guitare_Gauche(130,320,40,34,#White)  
  Cadre_Guitare_Gauche(130,370,40,34,#White)  
  Cadre_Guitare_Gauche(127,421,40,34,#White)  
  
  Cadre_Guitare_Droit(270,320,40,34,#White)  
  Cadre_Guitare_Droit(265,370,40,34,#White)  
  Cadre_Guitare_Droit(265,421,40,34,#White)  
EndProcedure

Procedure GadgetEvent()
  
  Select EventGadget()
    Case #ID_Canvas
      MouseX = GetGadgetAttribute(#ID_Canvas, #PB_Canvas_MouseX)
      MouseY = GetGadgetAttribute(#ID_Canvas, #PB_Canvas_MouseY)
      
      ;TextGadget(#Info_X,20 ,700,130,40,Str(MouseX),#PB_Text_Border)
      ;TextGadget(#Info_Y,150,700,Largeur_String,40,Str(MouseY),#PB_Text_Border)
      ;Case #ID_OK :  End
  EndSelect      
  
  If PosClic(MouseX,MouseY,138,60,40,34) : BarreIcones() : Cadre_Basse(138,60,40,34,#Blue) : EndIf   
  If PosClic(MouseX,MouseY,181,60,40,34) : BarreIcones() : Cadre_Basse(181,60,40,34,#Blue) : EndIf
  If PosClic(MouseX,MouseY,223,60,40,34) : BarreIcones() : Cadre_Basse(223,60,40,34,#Blue) : EndIf
  If PosClic(MouseX,MouseY,265,60,40,34) : BarreIcones() : Cadre_Basse(265,60,40,34,#Blue) : EndIf
  
  If PosClic(MouseX,MouseY,130,320,40,34) : BarreIcones() : Cadre_Guitare_Gauche(130,320,40,34,#Blue) : EndIf   
  If PosClic(MouseX,MouseY,130,370,40,34) : BarreIcones() : Cadre_Guitare_Gauche(130,370,40,34,#Blue) : EndIf   
  If PosClic(MouseX,MouseY,127,421,40,34)  : BarreIcones() : Cadre_Guitare_Gauche(127,421,40,34,#Blue) : EndIf   
  
  If PosClic(MouseX,MouseY,270,320,40,34) : BarreIcones() : Cadre_Guitare_Droit(270,320,40,34,#Blue) : EndIf   
  If PosClic(MouseX,MouseY,265,370,40,34) : BarreIcones() : Cadre_Guitare_Droit(265,370,40,34,#Blue) : EndIf   
  If PosClic(MouseX,MouseY,265,421,40,34) : BarreIcones() : Cadre_Guitare_Droit(265,421,40,34,#Blue) : EndIf   
  
  Select EventType()     
    Case #PB_EventType_LeftButtonDown
      BarreIcones()
      
      If PosClic(MouseX,MouseY,0,0,64,64) ; Nouvelle base de données SQLite3
        MessageRequester("Nouvelle base de données SQLite3")
      EndIf
      
      If PosClic(MouseX,MouseY,64,0,64,64) ; Ouvrir une base de données SQlite3        
        
      EndIf
      
      If PosClic(MouseX,MouseY,128,0,64,64) ; Mettre à jour une base de donnée SQlite3         
        
      EndIf
      
      If PosClic(MouseX,MouseY,192,0,64,64) ; Recherche dans la base de données SQlite 3       
                                            ;MessageRequester("Nouvelle base de données SQLite3")
      EndIf
      
      If PosClic(MouseX,MouseY,256,0,64,64) ; Import Image BLOB   
                                            ;MessageRequester("Nouvelle base de données SQLite3")
      EndIf
      
      If PosClic(MouseX,MouseY,320,0,64,64) ; Parametres
        CadreCel(320,0,64,64,#Blue)
        ;MessageRequester("Nouvelle base de données SQLite3")
      EndIf      
      
      If PosClic(MouseX,MouseY,384,0,64,64) ; A Propos        
        MessageRequester("Notysoft AC SQlite3 - v1.00")
      EndIf  
      
      ;====================================================
      
      If PosClic(MouseX,MouseY,138,60,40,34) : PlaySound(#MI_BASSE)  : EndIf   
      If PosClic(MouseX,MouseY,181,60,40,34) : PlaySound(#LA_BASSE)  : EndIf   
      If PosClic(MouseX,MouseY,223,60,40,34) : PlaySound(#RE_BASSE)  : EndIf   
      If PosClic(MouseX,MouseY,265,60,40,34) : PlaySound(#SOL_BASSE) : EndIf   
      
      If PosClic(MouseX,MouseY,130,320,40,34) : PlaySound(#RE_GUITARE)  : EndIf   
      If PosClic(MouseX,MouseY,130,370,40,34) : PlaySound(#LA_GUITARE)  : EndIf   
      If PosClic(MouseX,MouseY,127,421,40,34)  : PlaySound(#MI_GUITARE)  : EndIf   
      
      If PosClic(MouseX,MouseY,270,320,40,34) : PlaySound(#SOL_GUITARE)  : EndIf   
      If PosClic(MouseX,MouseY,265,370,40,34) : PlaySound(#SI_GUITARE)  : EndIf   
      If PosClic(MouseX,MouseY,265,421,40,34) : PlaySound(#MI_AIGU_GUITARE) : EndIf 
      
  EndSelect
  
  Select EventGadget()      
    Case #QUITTER : End
  EndSelect
  
EndProcedure

Procedure Load_AC()       
  If StartDrawing(CanvasOutput(#ID_Canvas))
    DrawImage(ImageID(#Image_Ban),70,40,300,1000)        
    BarreIcones()
    StopDrawing()
  EndIf                      
EndProcedure         

Procedure Fenetre_AC()
  OpenWindow(#Fenetre_AC,0, 0, FX,FY, "Notysoft Accordeur - 1.00",#PB_Window_BorderLess | #PB_Window_Background)               
  CanvasGadget(#ID_Canvas,0,0,FX,FY)      
  LoadFont(#Font_AC, "Arial",Taille_Caractere)               
  SetGadgetFont(#PB_Default, FontID(#Font_AC))  
  
  ButtonGadget(#QUITTER  ,0,FY-80,FX,40,"QUITTER") 
  BindEvent(#PB_Event_Gadget, @GadgetEvent())
  
  TextGadget(#Info_X,20 ,FY-200,100,40,Str(FX),#PB_Text_Border)
  TextGadget(#Info_Y,260,FY-200,100,40,Str(FY),#PB_Text_Border)  
  
  CompilerIf #PB_Compiler_OS <> #PB_OS_Web
    Repeat 
      LoadFont(#Font_AC, "Arial",Taille_Caractere)      
    Event = WaitWindowEvent()     Until Event = #PB_Event_CloseWindow
  CompilerEndIf
EndProcedure

Charges_Sons()  
Charges_Images()   
Fenetre_AC()
BindEvent(#PB_Event_Loading,@Load_AC())
killer128
Messages : 28
Inscription : mer. 30/mai/2012 15:15

Re: Image qui ne s'affiche pas en application Android

Message par killer128 »

Bonjour,
J'ai jetter un oeil à ton code.
premièrement, n'oublie pas de cocher la case ressource directory pour copier le fichier image dans le .APK final.
D'ailleur, tu peu vérrifier si le fichier est bien présent dans l'app le fichier apk est un fichier zip. Recherche ton image dedans.
après comme tu peux le voir dans le code de base:

Code : Tout sélectionner

;
; ------------------------------------------------------------
;
;   SpiderBasic - Image example file
;
;    (c) Fantaisie Software
;
; ------------------------------------------------------------
;

Procedure Loaded(Type, Filename$, ObjectId)
  
  ; Display the image in a new window
  OpenWindow(#PB_Any, 10, 10, ImageWidth(ObjectId), ImageHeight(ObjectId), "Image")
  ImageGadget(#PB_Any, 0, 0, ImageWidth(ObjectId), ImageHeight(ObjectId), ImageID(ObjectId))
  
EndProcedure

Procedure LoadingError(Type, Filename$, ObjectId)
  Debug Filename$ + ": loading error"
EndProcedure

; Register the loading event before calling any resource load command
BindEvent(#PB_Event_Loading, @Loaded())
BindEvent(#PB_Event_LoadingError, @LoadingError())

LoadImage(0, "Data/SpiderBasicLogo.png")
l'image est charge de la manière suivante,
on bind la procédure pour optenir le callback que l'image est charger
on charge l'image
puis enfin une fois l'image charger on affect l'image à imagegadget

dans ton code source,
tu charge l'image
tu bind la procedure Load_AC() tu n'as pas le retour du callback que l'image est charger
que tu colle l'image dans le buffer canvas.

Deuxième solution, j'ai remarqué qu'il faut utiliser une fonction qui va rafraichir l'image contenu dans le canvas. Notamment j'avais ce genre de problème quand je redimensionnai une image il y avait un petit bugs.
Tu peux aussi encoder l'image directement en base64 et l'afficher.

Code : Tout sélectionner

;
; ------------------------------------------------------------
;
;   charger une image en streaming en local puis l'afficher by klr128
;   avec l'image redimentionné ;encodage et decodage base64 pour envoi blob mysql
; ------------------------------------------------------------
;
;EnableExplicit
  
Procedure CatchImageExCallback(Image)
  ImageGadget(#PB_Any, 0, 90, ImageWidth(Image), ImageHeight(Image), ImageID(Image))
EndProcedure

Procedure CatchImageEx(Image, Base64String.s, Callback) 
  Protected W, H, IID
  ! var i = new Image();
  ! i.onload = function(){
  !   v_w = i.width;
  !   v_h = i.height;
  If Image = #PB_Any
    Image = CreateImage(#PB_Any, W, H)
  Else
    CreateImage(Image, W, H)
  EndIf
  IID = ImageID(Image)
  !   v_iid.getContext("2d").drawImage(i, 0, 0);
  !   v_callback(v_image);
  ! };
  ! console.log("hahassss "+v_base64string);
  ! i.src = v_base64string; 
EndProcedure
  
Procedure Loaded(Type, Filename$, ObjectId)
  If ImageWidth(ObjectId)>=ImageHeight(ObjectId)
    vv.f= 300*100/ImageWidth(ObjectId)
    ResizeImage(bob, 300, ImageHeight(ObjectId)*vv/100);,#PB_Image_Raw)
  Else
    vv.f= (380 -90)*100/ImageHeight(ObjectId)    
    ResizeImage(bob, ImageWidth(ObjectId)*vv/100, (380-90))
  EndIf
  ;  bob=ImageGadget(#PB_Any, 0, 90, ImageWidth(ObjectId), ImageHeight(ObjectId), ImageID(ObjectId))
  IDD = ImageID(ObjectId)
  ;Debug "bob "+ImageID(bob)
  ;Debug "e "+IDD
  base64encodeimg.s = "";
  !  console.log( v_idd ); 
  ! console.log( v_idd.toDataURL() );
  ! v_base64encodeimg = v_idd.toDataURL();
  FreeImage(bob)  
  CatchImageEx(0, base64encodeimg, @CatchImageExCallback())
EndProcedure

Procedure LoadingError(Type, Filename$, ObjectId)
  Debug Filename$ + ": loading error"
EndProcedure

Enumeration
  #SelectFileGadget
  #ProgressGadget
EndEnumeration

#ChunkSize = 1024 * 1024 ; 1 MB chunk
Global *Buffer = AllocateMemory(#ChunkSize) ; Allocate a global memory buffer to avoid realloc

Procedure ReadCallback(Status, Filename$, File, Size)
  If Status = #PB_Status_Loaded
    ReadData(0, *Buffer, 0, Size)    ; Read all data into the memory buffer
    AddFingerprintBuffer(0, *Buffer, 0, Size)    ; Continue the fingerprint calculation    
    SetGadgetState(#ProgressGadget, (Loc(0) * 100) / Lof(0))    ; Update the progressbar  
    If Not Eof(0)
      FetchData(0, #ChunkSize) ; Continue the reading if the end of file hasn't be reach yet
    Else
      LoadImage(0, Filename$,#PB_LocalFile);"Data/SpiderBasicLogo.png")
    EndIf
  ElseIf Status = #PB_Status_Error
    Debug "Error when loading the file: " + Filename$
  EndIf
EndProcedure

Procedure OpenFileRequesterCallback()  ; Start the read the file, in stream mode
  If NextSelectedFile()
    If ReadFile(0, SelectedFileID(), @ReadCallback(), #PB_LocalFile | #PB_File_Streaming)
      StartFingerprint(0, #PB_Cipher_MD5)      ; Initialize fingerprint calc
      FetchData(0, #ChunkSize)       ; Read the first chunk from the file
    EndIf 
  EndIf
EndProcedure

Procedure ChooseFileEvent()
  OpenFileRequester("*.txt", @OpenFileRequesterCallback())
EndProcedure

If OpenWindow(0, 0, 0, 300, 380, "charger une image par morceaux", #PB_Window_ScreenCentered)
  ButtonGadget(#SelectFileGadget, 10, 10, 280, 25, "charger une image")
  TextGadget(#PB_Any, 10, 45, 60, 25, "Progression: ")
  ProgressBarGadget(#ProgressGadget, 70, 45, 220, 25, 0, 100)
  
  BindGadgetEvent(0, @ChooseFileEvent())
EndIf

; Register the loading event before calling any resource load command
BindEvent(#PB_Event_Loading, @Loaded())
BindEvent(#PB_Event_LoadingError, @LoadingError())


PCPixMusic
Messages : 106
Inscription : ven. 06/janv./2017 9:50

Re: Image qui ne s'affiche pas en application Android

Message par PCPixMusic »

Bonjour killer128 ,

Merci pour ta réponse.
premièrement, n'oublie pas de cocher la case ressource directory
Merci, ça fonctionne nikel.

Ton code de sélection d'image a afficher est assez complexe.
Je trouve d'ailleurs que tout est plus complexe en SpiderBasic qu'en PureBasic.

J'ai suivis l'exemple fourni dans l'aide de SpiderBasic

Code : Tout sélectionner

Procedure Loaded(Type, Filename$, ObjectId)

; Display the image in a new window
OpenWindow(#PB_Any, 10, 10, 300, 300, "Image", #PB_Window_SizeGadget)
ImageGadget(#PB_Any, 0, 0, ImageWidth(ObjectId), ImageHeight(ObjectId), ImageID(ObjectId))

EndProcedure

Procedure LoadingError(Type, Filename$, ObjectId)
Debug Filename$ + ": loading error"
EndProcedure

; Register the loading event before calling any resource load command
BindEvent(#PB_Event_Loading, @Loaded())
BindEvent(#PB_Event_LoadingError, @LoadingError())

LoadImage(0, "img/05-blob.png")
Répondre