Page 1 of 2

Help on what to do AFTER Visual Designer

Posted: Tue Oct 23, 2012 6:25 am
by RobKiwi
May I introduce myself and also ask for some help?
My background: C64 Basic, 6502 assembler (I made some electronic devices for teaching in the dim and distant past), Visual Basic 6.
I have a project which I want to make: not for commercial reasons but to distribute to those interested. Being pretty ancient (well, ancient if not pretty) I also want to keep my brain lively to avoid Alzheimer's! I tried Visual Basic Express but really want a small compiled stand alone file.
I then had a look at PowerBasic and found that it's certainly NOT a BASIC program if we know that the B still stands for “Beginner's...” (Incidentally I may be wrong but there seems to me to be a sort of oneupmanship, people who make great use of API calls looking down on us simpler folk (I hope that's not really so!)
So I am considering buying PureBasic and have downloaded the trial version. I find the Visual Designer fairly intuitive and got on quite well. I have also worked my way through the Survival Guide and looked for some sample programs which would help me, to no avail.
What is my problem? It's finding out what to do with the pretty buttons and listboxes and so on that I have made. With Visual Basic it was quite easy, but the only tutorials and examples I can find say nothing about what I should do next to code them.
I would love to see a little sample program with a picturebox and a button which would load a given picture when pushed. I think I could take it from there. I've searched around and can't find anything useful to me.
I've rambled on, thanks for your patience if you are still with me!
Kia ora
Rob in Rawene, New Zealand

Re: Help on what to do AFTER Visual Designer

Posted: Tue Oct 23, 2012 6:32 am
by J. Baker
There are plenty of examples in the help file. Have you read that?

Re: Help on what to do AFTER Visual Designer

Posted: Tue Oct 23, 2012 7:34 am
by VB6_to_PBx
here's a PB example using a Menu choice

Code: Select all

;        Image_Viewer__v2.pb
;
; ------------------------------------------------------------
;
;        PureBasic - ImagePlugin example file
;
;        (c) Fantaisie Software
;
; ------------------------------------------------------------
;

;        Enable all the decoders than PureBasic actually supports
;
UseJPEGImageDecoder()
UseTGAImageDecoder()
UsePNGImageDecoder()
UseTIFFImageDecoder()

; Enable all the encoders than PureBasic actually supports
;
UseJPEGImageEncoder()
UsePNGImageEncoder()


OpenWindow(0, 0, 0, 250, 130, "PureBasic - Image Converter", #PB_Window_SystemMenu | #PB_Window_ScreenCentered)

ImageGadget(0, 0, 28, WindowWidth(0), WindowHeight(0), 0, #PB_Image_Border)
   
CreateToolBar(0, WindowID(0))
ToolBarStandardButton(0, #PB_ToolBarIcon_Open)
ToolBarStandardButton(1, #PB_ToolBarIcon_Save)
DisableToolBarButton(0, 1, 1)    ; disable the save button
 
Repeat
    EventID = WaitWindowEvent()
    If EventID = #PB_Event_Menu  ; ToolBar are acting as menu
         Select EventMenu()
         Case 0  ; Open
              Filename$ = OpenFileRequester("Choose a picture", "", "All Images Formats|*.bmp;*.jpg;*.png;*.tif;*.tga", 0)
              If Filename$
                   If LoadImage(0, Filename$)
                        SetGadgetState(0, ImageID(0))  ; change the picture in the gadget
                        DisableToolBarButton(0, 1, 0)    ; enable the save button
                        ResizeWindow(0, #PB_Ignore, #PB_Ignore, ImageWidth(0)+4, ImageHeight(0)+34)
                   EndIf
              EndIf
         Case 1  ; Save
              Filename$ = SaveFileRequester("Save a picture", Left(Filename$, Len(Filename$)-Len(GetExtensionPart(Filename$))-1), "BMP Format|*.bmp|JPEG Format|*.jpg|PNG Format|*.png", 0)
              If Filename$
                   Select SelectedFilePattern()
                   Case 0  ; BMP
                        ImageFormat = #PB_ImagePlugin_BMP
                        Extension$  = "bmp"
                   Case 1  ; JPEG
                        ImageFormat = #PB_ImagePlugin_JPEG
                        Extension$  = "jpg"
                   Case 2  ; PNG
                        ImageFormat = #PB_ImagePlugin_PNG
                        Extension$  = "png"
                   EndSelect
           
                   If LCase(GetExtensionPart(Filename$)) <> Extension$
                        Filename$ + "." + Extension$
                   EndIf
           
                   If SaveImage(0, Filename$, ImageFormat)
                        MessageRequester("Information", "Image saved successfully", 0)
                   EndIf
              EndIf
         EndSelect
    EndIf
Until EventID = #PB_Event_CloseWindow  ; If the user has pressed on the close button

End   ; All is automatically freed by PureBasic

Re: Help on what to do AFTER Visual Designer

Posted: Tue Oct 23, 2012 9:53 am
by buddymatkona
If you are restarting in software from a background of C64, your problem finding things in the built-in help will involve learning some PB buzzwords.

Try starting this way:
1) Open PureBasic and click on Help in the menu.
2) Click on the Search Tab, type something general like "Image" in the search box and click on "List Topics"
3) Choose something useful sounding like "LoadImage" and doubleclick it to see the built-in help. At the end there may be a related index to click and then an example.
4) For more help and examples, click Search at the start of this forum and look for "LoadImage" here.

Good luck.

Re: Help on what to do AFTER Visual Designer

Posted: Tue Oct 23, 2012 9:37 pm
by RobKiwi
Thanks very much for the rapid replies. I assure you that I have read the help file and cannot find anything that addresses my problem: having used Visual Designer to make my gadgets, what then? I am faced with a blank editing space. The examples which I can find all assume that you haven't used VD and want to make the gadgets from scratch, by coding.
Thanks for the Image viewer/converter which works very well but has no gadgets except for the ImageGadget and that is made by coding.
Loading an image file isn't really the main problem for me. It appears to me that the various Help files were written before Visual Designer reached its present state.
Incidentally, as a Visual Designer imagebox can be loaded with a JPG file during design, is enabling the JPEGImageDecoder needed?

Re: Help on what to do AFTER Visual Designer

Posted: Wed Oct 24, 2012 12:32 am
by electrochrisso
Not sure if it works with the PB Demo, but you could try PureFORM
http://www.purebasic.fr/english/viewtop ... 25&t=23529

Re: Help on what to do AFTER Visual Designer

Posted: Wed Oct 24, 2012 10:55 am
by Azur
Hello !

The VisualD will generate a source file containing the UI decalration, the file name will be "myUI.pbf" for an exmaple
This file contain a procedure to create the UI
Your have to include this sourcefile in the begining of your program with includefile("myUI.pbf")
Then you can create the UI with something like initWindow(), the procedurename is in the pbf created by the VD.
Then you have to manage windowevents if you dont want the program to quit directly

include_vd_file "myui.pbf"
call_procedure initwindow
repeat
manage windowevents
if event_closewindow_detected then quit
if event_button_pressend then go_to_procedure_x
forever

Re: Help on what to do AFTER Visual Designer

Posted: Wed Oct 24, 2012 1:20 pm
by TI-994A
RobKiwi wrote:...I would love to see a little sample program with a picturebox and a button which would load a given picture when pushed. I think I could take it from there...
Hi Rob! Perhaps this simple example may shed some light on the Form Designer process. The example uses the standard default window, an ImageGadget(), and a ButtonGadget. I filled in the captions for the window and the button in the property panel, and also selected #PB_Window_ScreenCentered flag to centre the window. Form Designer then generated the following code:

Code: Select all

Global Window_0

Global Image_0, Button_0

Procedure InitWindow_0()
  Window_0 = OpenWindow(#PB_Any, 0, 0, 600, 400, "My Window Title", #PB_Window_SystemMenu | #PB_Window_ScreenCentered)
  Image_0 = ImageGadget(#PB_Any, 10, 10, 580, 340, ImageID())
  Button_0 = ButtonGadget(#PB_Any, 10, 360, 580, 30, "L O A D     I M A G E")
EndProcedure

Procedure Window_0_Events(event)
  Select event
    Case #PB_Event_CloseWindow
      ProcedureReturn #False

    Case #PB_Event_Gadget
      Select EventGadget()
      EndSelect
  EndSelect
  ProcedureReturn #True
EndProcedure
As you can see, there are just some variable definitions and two procedures. However, we'd still need to add some code to call these procedures, and also handle gadget events. The added lines in the following modification does just that:

Code: Select all

;############
; added code

UseJPEGImageDecoder()
UsePNGImageDecoder()

;############

Global Window_0

Global Image_0, Button_0

Procedure InitWindow_0()
  Window_0 = OpenWindow(#PB_Any, 0, 0, 600, 400, "My Window Title", #PB_Window_SystemMenu | #PB_Window_ScreenCentered)

;###############
; modified code
  ;Image_0 = ImageGadget(#PB_Any, 10, 10, 580, 340, ImageID())

;Form Designer expects an image to be loaded - change to zero for no image
  Image_0 = ImageGadget(#PB_Any, 10, 10, 580, 340, 0)

;###############

  Button_0 = ButtonGadget(#PB_Any, 10, 360, 580, 30, "L O A D     I M A G E")
EndProcedure

Procedure Window_0_Events(event)
  Select event
    Case #PB_Event_CloseWindow
      ProcedureReturn #False

    Case #PB_Event_Gadget
      Select EventGadget()
          
;############
; added code

        Case Button_0  
          defaultPathFile$ = "C:\"
          displayPattern$ = "Image Files (bmp, jpg, png) | *.bmp;*.jpg;*.png"
          File$ = OpenFileRequester("Please choose image file to display", defaultPathFile$, displayPattern$, 0)
          If File$ And LoadImage(LoadedImage, File$)
            SetGadgetState(Image_0, ImageID(LoadedImage))
          EndIf  

;############          
          
      EndSelect
  EndSelect
  ProcedureReturn #True
EndProcedure

;############
; added code

InitWindow_0()
While Window_0_Events(WaitWindowEvent()) : Wend
End 

;############
I hope that this may be helpful.

Re: Help on what to do AFTER Visual Designer

Posted: Wed Oct 24, 2012 3:18 pm
by Tenaja
Azur wrote:The VisualD will generate a source file containing the UI decalration, the file name will be "myUI.pbf" for an exmaple
This file contain a procedure to create the UI
Your have to include this sourcefile in the begining of your program with includefile("myUI.pbf")
Then you can create the UI with something like initWindow(), the procedurename is in the pbf created by the VD.
Then you have to manage windowevents if you dont want the program to quit directly

include_vd_file "myui.pbf"
call_procedure initwindow
repeat
manage windowevents
if event_closewindow_detected then quit
if event_button_pressend then go_to_procedure_x
forever
I think Azur is closest to answering your question, but to expand...

Once you have created your window, save it (as PureBasic Form, such as YourFileName.pfb.)

[disclaimer] this may vary some in the demo version--Fred has recently changed the Visual Designer to the new Form Designer. You may have to "generate code". I, had the old Visual Designer crash so many times that I quit using it. The new Form Designer seems to be much better. However, PureForm is pretty good, and is much advanced over Freds offerings, and I have been using it for recent projects: http://gnozal.ucoz.com/#PureFORM

From PB's IDE, open the YourFileName.pbf file (OR the file "generated" by visual designer)--you will see the code that was generated. Do NOT edit this file, unless it is a tiny gui that you will not change, because any edits you make from within the Visual designer will overwrite the old file. Instead, create a new file, and add XIncludeFile "YourFileName.pbf" at the top, and type your new code into the new file.

NOTE: You may want to make some changes to the Visual Designers Preferences, and watch the code changes. For instance, if you check "Generate event loop" you will get a repeat...until loop that works for a single-window program.

Re: Help on what to do AFTER Visual Designer

Posted: Wed Oct 24, 2012 7:50 pm
by TI-994A
Hello again Rob. After posting my earlier example, I realised, from Tenaja's post, that the Visual Designer you're using in the demo version is different from the ones in the current release versions. So, please allow me to walk through the same example for the demo version of Visual Designer.

1. Launch the Visual Designer, and you'll get a blank window named New window (0).

2. In the properties panel, rename and resize the window as required, then place an ImageGadget() and a ButtonGadget() on it. Again from the properties panel, select an image to place into the ImageGadget(). (please note that the Visual Designer expects an image to be associated with an ImageGadget(), and would generate incomplete code if an image file is not specified)

3. In PROJECT OPTIONS of the PROJECT menu, specify the desired folder and file names for the MAIN FILE and INCLUDE FILE. For the convenience and clarity of this example, please name them MainFile.pb and IncludeFile.pb respectively, and save them both into the same folder. Then select the INCLUDE EVENT LOOP option and press OK.

3. Finally, from the PROJECT menu, select GENERATE SOURCE.

4. Save the form project and exit from Visual Designer, then launch PureBasic and load MainFile.pb from the folder specified earlier. The program should run with only a harmless compiler warning.

MainFile.pb

Code: Select all

; PureBasic Visual Designer v3.95 build 1485 (PB4Code)

IncludeFile "IncludeFile.pb"

Open_Window_0()

Repeat ; Start of the event loop
  
  Event = WaitWindowEvent() ; This line waits until an event is received from Windows
  
  WindowID = EventWindow() ; The Window where the event is generated, can be used in the gadget procedures
  
  GadgetID = EventGadget() ; Is it a gadget event?
  
  EventType = EventType() ; The event type
  
  ;You can place code here, and use the result as parameters for the procedures
  
  If Event = #PB_Event_Gadget
    
    If GadgetID = #Button_0
      
    ElseIf GadgetID = #Image_0
      
    EndIf
    
  EndIf
  
Until Event = #PB_Event_CloseWindow ; End of the event loop

End
;
IncludeFile.pb

Code: Select all

; PureBasic Visual Designer v3.95 build 1485 (PB4Code)


;- Window Constants
;
Enumeration
  #Window_0
EndEnumeration

;- Gadget Constants
;
Enumeration
  #Button_0
  #Image_0
EndEnumeration

;- Image Plugins
UseJPEGImageDecoder()

;- Image Globals
Global Image0

;- Catch Images
Image0 = CatchImage(0, ?Image0)

;- Images
DataSection
Image0:
  IncludeBinary "C:\SampleImage.JPG"
EndDataSection

Procedure Open_Window_0()
  If OpenWindow(#Window_0, 216, 0, 600, 300, "My Window Title",  #PB_Window_SystemMenu | #PB_Window_SizeGadget | #PB_Window_TitleBar | #PB_Window_ScreenCentered )
    If CreateGadgetList(WindowID(#Window_0))
      ButtonGadget(#Button_0, 10, 260, 580, 30, "L O A D    I M A G E")
      ImageGadget(#Image_0, 10, 10, 370, 317, Image0)
      
    EndIf
  EndIf
EndProcedure
To answer one of your earlier questions, you will notice that the Visual Designer has automatically included the relevant image decoder based upon the selected image.

To use the button to load and display another image, make the following modifications to MainFile.pb:

Code: Select all

; PureBasic Visual Designer v3.95 build 1485 (PB4Code)

UsePNGImageDecoder()   ;<<< ### add this code ###

IncludeFile "IncludeFile.pb"

Open_Window_0()
...
...
...
  If Event = #PB_Event_Gadget
    
    If GadgetID = #Button_0

;### add this code ###
      defaultPathFile$ = "C:\"
      displayPattern$ = "Image Files (bmp, jpg, png) | *.bmp;*.jpg;*.png"
      File$ = OpenFileRequester("Please choose image file to display", defaultPathFile$, displayPattern$, 0)
      If File$ And LoadImage(LoadedImage, File$)
        SetGadgetState(#Image_0, ImageID(LoadedImage))
      EndIf        
;#####################

    ElseIf GadgetID = #Image_0
      
    EndIf
    
  EndIf
...
...
Again, I hope that it helps.

Re: Help on what to do AFTER Visual Designer

Posted: Thu Oct 25, 2012 4:00 am
by RobKiwi
Dear Everyone
Even if I don't reply for a day or so, I'm still very grateful for the time and trouble you have all spent. I've got a lot of things to do at the moment and will be trying out the programs you have posted when I get time: I will also report on (any) progress.
I will just mention that I have tried out programs found in various places on the Web and some just don't work: I get error reports, such as "string in place of number" or vice versa. Is it possible that they were written for earlier versions of PB? There's a whole eight small programs like that in one place.
Cheers
Robin

Re: Help on what to do AFTER Visual Designer

Posted: Thu Oct 25, 2012 4:20 am
by TI-994A
RobKiwi wrote:...I get error reports, such as "string in place of number" or vice versa. Is it possible that they were written for earlier versions of PB? There's a whole eight small programs like that in one place...
Hello Rob. As far as I know, basic type errors should not be version related. If you could point out the code set you are talking about, I wouldn't mind taking a look.

BTW, I hope that the Visual Designer example was clear; best I could do in a single post.

Re: Help on what to do AFTER Visual Designer

Posted: Thu Oct 25, 2012 5:32 am
by RobKiwi
Many, many thanks TI-994A. I just can't keep away from it so:

1) The examples I found and was unable to run were at http://www.purearea.net/pb/english/index.htm then "Input & Output".

2) I got all the revised image displayer done then tried to compile and the result was "syntax error" in the line "File$=OpenFileRequester....."

I copied and pasted and there are no typos here! I found reference to "OpenFileRequester" in the Beginner's Guide where it has a small difference: instead
of defaultPathFile$ it has defaultFile$. But I have tried referring to a file instead of a directory or drive with the same result.

Incidentally, the code produced here on my Demo version has "GadgetID = #Image_0" where you have "GadgetID = #Button_0" and vice-versa: in other words, the IF and the ELSEIF swapped. Not that I think it should make a difference.

Kia ora

Rob

Re: Help on what to do AFTER Visual Designer

Posted: Thu Oct 25, 2012 6:31 am
by TI-994A
Hi Rob!
RobKiwi wrote:1) The examples I found and was unable to run were at http://www.purearea.net/pb/english/index.htm then "Input & Output".
I'll take a look at them and get back to you.
RobKiwi wrote:2) I got all the revised image displayer done then tried to compile and the result was "syntax error" in the line "File$=OpenFileRequester....."

I copied and pasted and there are no typos here! I found reference to "OpenFileRequester" in the Beginner's Guide where it has a small difference: instead of defaultPathFile$ it has defaultFile$. But I have tried referring to a file instead of a directory or drive with the same result.
defaultPathFile$ and defaultFile$ are simply string variables, and can be any valid name you wish. Could you kindly post a "cut & paste" of the code block from [If GadgetID = ] to [ElseIf GadgetID =]? If it's not a typo, it could be a parameter error.
RobKiwi wrote:Incidentally, the code produced here on my Demo version has "GadgetID = #Image_0" where you have "GadgetID = #Button_0" and vice-versa: in other words, the IF and the ELSEIF swapped. Not that I think it should make a difference.
I believe that the swap is caused by which gadget was drawn first; I'm assuming that you drew the ImageGadget() first, then the ButtonGadget(), while I did the opposite. In any case, the added code block should be below [GadgetID = #Button_0] and not [GadgetID = #Image_0].

Anyway, here's the complete listing for the two modules. If you'd like, you could cut & paste them into PureBasic (please make sure that you change the [IncludeBinary "C:\SampleImage.JPG"] to your own existing image file) and save them as MainFile.pb and IncludeFile.pb, both in the same folder, and try running MainFile.pb. It should work:

MainFile.pb

Code: Select all

; PureBasic Visual Designer v3.95 build 1485 (PB4Code)

UsePNGImageDecoder()

IncludeFile "IncludeFile.pb"

Open_Window_0()

Repeat ; Start of the event loop
  
  Event = WaitWindowEvent() ; This line waits until an event is received from Windows
  
  WindowID = EventWindow() ; The Window where the event is generated, can be used in the gadget procedures
  
  GadgetID = EventGadget() ; Is it a gadget event?
  
  EventType = EventType() ; The event type
  
  ;You can place code here, and use the result as parameters for the procedures
  
  If Event = #PB_Event_Gadget
    
    If GadgetID = #Button_0
      defaultPathFile$ = "C:\"
      displayPattern$ = "Image Files (bmp, jpg, png) | *.bmp;*.jpg;*.png"
      File$ = OpenFileRequester("Please choose image file to display", defaultPathFile$, displayPattern$, 0)
      If File$ And LoadImage(LoadedImage, File$)
        SetGadgetState(#Image_0, ImageID(LoadedImage))
      EndIf       
    ElseIf GadgetID = #Image_0
      
    EndIf
    
  EndIf
  
Until Event = #PB_Event_CloseWindow ; End of the event loop

End
;
IncludeFile.pb
(please note that I have commented out two lines from the following code which causes the compiler warnings; the CreateGadgetList() is a deprecated function, and I have placed semi-colons in front of the pair of [If CreateGadgetList() ... EndIf] to ignore their execution)

Code: Select all

; PureBasic Visual Designer v3.95 build 1485 (PB4Code)


;- Window Constants
;
Enumeration
  #Window_0
EndEnumeration

;- Gadget Constants
;
Enumeration
  #Button_0
  #Image_0
EndEnumeration

;- Image Plugins
UseJPEGImageDecoder()

;- Image Globals
Global Image0

;- Catch Images
Image0 = CatchImage(0, ?Image0)

;- Images
DataSection
Image0:
  IncludeBinary "C:\SampleImage.JPG"
EndDataSection

Procedure Open_Window_0()
  If OpenWindow(#Window_0, 216, 0, 600, 300, "My Window Title",  #PB_Window_SystemMenu | #PB_Window_SizeGadget | #PB_Window_TitleBar | #PB_Window_ScreenCentered )
    ;If CreateGadgetList(WindowID(#Window_0))
      ButtonGadget(#Button_0, 10, 260, 580, 30, "L O A D    I M A G E")
      ImageGadget(#Image_0, 10, 10, 370, 317, Image0)
      
    ;EndIf
  EndIf
EndProcedure
Please do post that code fragment at your convenience, and I'll get back to you regarding the other samples Thank you.

Re: Help on what to do AFTER Visual Designer

Posted: Thu Oct 25, 2012 7:25 am
by TI-994A
Hello again Rob. I took a look at those examples in purearea.net, and you're right, they are version related. Those are great examples although somewhat dated; nearly ten years old. PureBasic has evolved quite a bit since then, and there have been many changes to its syntax. I've made the necessary changes to Example1.pb here, and if you make the similar changes for examples 2 through 8, you should be good to go:

Code: Select all

;EXAMPLE 1

;Making a window application in PureBasic is easy, just need to understand
;a few easy concepts

;CONSTANTS:

;Constants are used to make readable a code
;Constants are preceded with # and are used to store numeric values so the code will
;be easier to read.
;In this example we create 2 constants to store the ID number that we will
;use for identify the gadgets or controls that we are going to use with our 
;application.

#MyStringGadget = 1
#MyButton = 2

;The first step for creating a window in PureBasic is callig the
;OpenWindow() command and sending all the parameters required.
;In this case we give the number 0 as the identifier for our window
;we give the coordinates 100,150 for the left and top position
;of the window
;then give 450 as the Innerwitdh and 200 as innerheight

;The #PB_Window_SystemMenu flag is one of many available (check the help file
;to see the other flags available)
;and then we put the text that will have the window.


;### the [number expected instead of string] error is caused by the new OpenWindow()
;### format which expects the title string as the 6th parameter instead of the last
If OpenWindow(0,100,150,450,200,"Test", #PB_Window_SystemMenu)

;Now we will put the gadgets in the window
  
;### the [WindowID(): Incorrect number of parameters] error is also caused by a new
;### format in the function - WindowID() now requires that the window number be included.
;### however, since CreateGadgetList() is a deprecated function, the line can be safely removed
  ;CreateGadgetList(WindowID(0))

  StringGadget(#MyStringGadget,50,50,350,20,"")
  ButtonGadget(#MyButton,200,100,50,25,"Test")
  
;and now we will go to a loop to receive any user input
;in this case we will receive when a user pushes a button

  Repeat
    EventID=WaitWindowEvent();we get the windowevent
    
    Select EventID;we check which window event are we receiving
        
;### the constant #PB_EventGadget has been changed to #PB_Event_Gadget        
      Case #PB_Event_Gadget;in case its the event from our gadgets
        
;### the function EventGadgetID() has been replaced with EventGadget()
        Select EventGadget()
    
          Case #MyButton ; the user click the button
            MessageRequester("button clicked","hello world",0)
            SetGadgetText(#MyStringGadget,"clicked!!");Then we put a text into the string gadget
        EndSelect
    
    EndSelect
    
;### the constant #PB_EventCloseWindow has been changed to #PB_Event_CloseWindow
  Until EventID=#PB_Event_CloseWindow;loop until the user decide to close the window

EndIf
End