[Answers] Image

[josipradnik]

image gadget on the employees page.

• Create a new app
• Goto the pages workspace
• Open the Southwind database
• Drag the employees table onto the page, this will create a form section displaying the employees table data.
• Now click the gadgets buttons in the form bar at the bottom and add an image gadget.
• Double click on the image gadget header to bring up it's attributes.
• Set the Caption and the Datasource as shown in the attached screen shot.
• The Image gadget is now data bound to the photo field in the employees table.
• Double clicking the image brings up a file browser for uploading images.

---

Q:
if I want to add images to my newly created app can I not simply add (new file) under images directory showing under the app within the GUI ?
A:
Drag and drop the image file from an Explorer Window into App Workspace 'Files' and it will show it within its correct category.

---

Are you aware that the Lianja Web/Mobile Client supports image uploading. This does not require any code to be written on the client or server-side as it's all built into the Lianja Web Framework. All you need to do is add an "Image gadget" to a form section. Why write code when you don't need to!

---

Q:
how to add / edit / delete photo into table, eg. employee table.
A:
If you open the Lianja Demo app, there is an example of using an image gadget on the employees page.
Building your own example is easily accomplished.

• Create a new app
• Goto the pages workspace
• Open the Southwind database
• Drag the employees table onto the page, this will create a form section displaying the employees table data.
• Now click the gadgets buttons in the form bar at the bottom and add an image gadget.

• Double click on the image gadget header to bring up it's attributes.
• Set the Caption and the Datasource as shown in the attached screen shot.

• The Image gadget is now data bound to the photo field in the employees table.
• Double clicking the image brings up a file browser for uploading images.

You write images into an "object" or "graphics" column using REPLACE, not from a character column.

Replace field with "filename"

so if you are trying to use a fieldname contents as the filename put it into a temporary variable then use "&varname" in your replace statement.

---

No, (web apps) images need to be in a table.
In web apps (which he is building) you cannot just access files all over the disk for security reasons.

---

Q:
In VFP we used Thisform.LockScreen = .T. / .F.
A:
Lianja.lockscreen = 1
then
Lianja.lockscreen = 0
Give it a whirl. If I understand you correctly you want to disable screen updates, do something, then re-enable them.
A word of warning: Do not do this from the command window as it prevents all further input and output until it is re-enabled.
Also make sure your code that runs has no errors as you will not be able to interact with the UI while lockscreen is active.

---

---

All topics in [Answers] alphabetically: http://www.lianja.com/community/show...ll=1#post12352

[josipradnik]

Q:
A pict listed under "Image Files" of an App, I reference in a WebView section by img src="pict.jpg". The pict appears in DevView und DeskView but not in WebPreView! In this case, it will be searched in a temp directory. How should be the img src - reference?
A:
Is your WebView Section based on an rsp script? If so, open the Web App View, click Deploy, then click Preview (or open your browser and go to http://localhost:8001 and open the App from there). You should see your image correctly. (If not, check the inspector in the browser and see if there are any errors.) The Web App View is looking for the image in the temporary directory where the code it generated instead of the App's directory.

---

Q:
inserting picture into the grid
A:
Look at the grid column attributes. And yes of course a webview (section or gadget) can display an image, that's exactly what the catalog view does and the source code is in the library for you to study.
An image object field can be data bound using the "Controlsource" property. Picture is for external file paths.

---

Q:
Is it possible to place relating pictures from a database table on the screen?
What I ment is: in the tabel textfield only te folder and name of the picture, and the pictures in a separate folder.
Can I place also thumpnails from this fields in a listing ?
A:
The catalogview section provides the ability to display thumbnails of images together with a description and a hyperlink which when clicked calls some code that you can use to slide in a DialogPanel with a much larger image and additional information. You can also specify a filter which contains {...} macros so it only displays images related to a parent section.
Take a look at the web examples how this is done with an imagestrip section.
In web apps the web server typically restricts what folders can be accessed based on file permissions.
In desktop apps this is less of an issue and you should be able to provide thumbnails in a Webview section that you can layout in a .rsp page. Have a look at the catalogview.rsp file in the library directory as it renders images in the HTML that it generates.

---

Q:
I've try to put a image ina grid..
I've cretaed a container:

proc myPictureContainer
mycontainer = createobject("container")
mycontainer.layout = "horizontal"
mycontainer.height = 50
mycontainer.addobject("image1","image")
image.picture = keylookup("Giocatori", "GIOCATORE", azioni.giocatore, pathfoto)
// image.picture = "app:/cat_contacts_sm.png"
return mycontainer

then, added to a gridcell.. but not work..
this code work fine!

proc myPictureContainer
        mycontainer = createobject("container")
        mycontainer.layout = "horizontal"
        mycontainer.height = 50
        mycontainer.addobject("image1","image")
        image1.picture = keylookup("Giocatori", "GIOCATORE", azioni.giocatore, mline(fotopath, 1))
        image1.Stretch = 1     
return mycontainer

A:
If you use the OBJECTWRITE() function, you can write the image contained in the field to a file. There is an option to write to a temporary (filename generated) file.
So in your myPictureContainer:

image1.picture = keylookup("Giocatori", "GIOCATORE", azioni.giocatore, objectwrite("",foto,.t.))

---

---

All topics in [Answers] alphabetically: http://www.lianja.com/community/show...ll=1#post12352

[josipradnik]

Q:
In the mobile app that I'm building the user should be able to upload pictures (either from the camera or file storage) to be stored in a table similar to how in the Southwind database the Employees have their pictures stored. I think I understand how to get that picture in my mobile app, but once I do how do I go about uploading it to my cloud server?
A:
It is data bound. Just touch the picture and you can choose to take a photo or select an existing one. It is uploaded automatically for you and either inserted or updated in the table it is bound too.

Q2:
The user clicks a button and gets the file or camera choice then takes a photo/chooses a file which then gets uploaded to the table on my server. I can do the first part currently using Lianja.getPicture() in my click delegate. I just don't know how to go from there to having the file uploaded and stored in my table. I'm guessing I can do something in the onSuccess callback, just not sure how to do it.
A2:
If you want to do it that way there is more involved as you need to manually upload and call a server side rsp page to handle the decoding of the image and then store it in a table.

Data binding does that for you. If you have an "upload page" with an image preview above the button would that work for your use case?

---

Q:
custom section, I have an image class that uses mousewheel.
I can see Lianja is picking up the mousewheel move, but I am not sure how to capture which way the mouse wheel was moved.
A:
If you have a procedure in the class to handle the mousemove it is passed 4 parameters

// nButtonNumber left=1, right=2, middle=4
// nModifiers shift=1, control=2, alt=4 none=0 (can be added together)
proc mouseMove(nButtonNumber, nModifiers, nXpos, nYpos)
endproc

The mousePress and mouseRelease event handlers are called with the same 4 parameters.

So you need to handle the press and release to keep track of where the mouse was at the start and end of the move operation.
You can keep the last known mouse x and y position starting in the mousePress event handler and updating it in the mouseMove event handler. By comparing the current position to the last position you can determine direction of movement and delta.
A2:
The mouseWheel() event handler takes the same last 3 parameters as mousePress(), mouseRelease() and mouseMove(). The first parameter is the delta movement which can be positive or negative.

---

Q:
I have several items that I need to have the user move around on the screen.
To make this quick, I allow different keystrokes for the different items.
Is it possible to use something like "on key label ctrl+leftArrow mytext.left = mytext.left -2"
These are images that I need to move side-by-side (and sometimes overlay).
In the application that I am replacing, I use different keystrokes to change the focus between images and then the arrow keys to move them.
This would be in either a custom VFP section or a Canvas VFP section.
A:
An image In a custom section the KEYPRESS event handler is called with 2 args:

proc mykeypress(keycode as numeric, keymodifiers as numeric)
// your code here
endproc

---

Q:
I am trying to explore different possibilities of using the webview with images.
I have millions of images across my servers, so keeping them in a single application directory is not going to work.
I would like to be able to display specific images in the webview.
Looking at thebase64_encode_image(object_fieldname [,width,height [,cssattr ]]) documentation,
I would like to specify the full network path of the file, have it written as temp file (as if it came from a database) and display it the webview.
It looks possible, (with include file - I think) but I can't get it working properly.
A:
I would suggest you look at using the getfile() method in the networkrequest class to fetch the image into a temporary file which you can then process and if needed send back with putfile() in the same class.
http://www.lianja.com/doc/index.php/NetworkRequest
base64_encode_image is meant to work off binary memo (blob) fields.
base64_encode_file has the same parameters and output except that it takes a file reference as the first parameter.

Interesting decision to make: store all those images in a (very large) table or put them in a maze of directories. Because of the ability to store metadata about the image with (or attached to via relations) the image, and the ability to move the database easily to a different infrastructure, I would favor a table. Having been burned by backup routines and tables, I would have the files also stored in a different physical location as files on a network. <s> A Lianja database installed on its own instance would be very useful here because of the ability to SEEK a single record (nothing is faster than a SEEK -- use a stored procedure to find the record and return the base64-encoded result) and the ability to tune (using smartquery) that instance of the LSS for handling images.

I just pointed a web url at the root folder of the images and that is doing just what I need.

---

Q:
Is possible to show a picture in a grid section?
If not, is possible to have more than one link in the catalog view?
If not, is possible to insert picture in a webview section?
A:
Look at the grid column attributes. And yes of course a webview (section or gadget) can display an image, that's exactly what the catalog view does and the source code is in the library for you to study.
A2:
Here is an easy way to display your image in a grid.

use the employees table in southwind.
Add a new grid.
Add Firstname, Lastname and photograph (which is an image in the table).
Then in the section attributes, select "show memo/object panel"
Then click "split edit"

If you want to hide the column Photograph, set "visible when" 1=2.



Q2:
I need all the picture in the grid.. like this


A:
this code work fine!

proc myPictureContainer
mycontainer = createobject("container")
mycontainer.layout = "horizontal"
mycontainer.height = 50
mycontainer.addobject("image1","image")
image1.picture = keylookup("Giocatori", "GIOCATORE", azioni.giocatore, mline(fotopath, 1))
image1.Stretch = 1
return mycontainer

---

OpenCv is the Gold standard of image processing.

C++ and python are the languages mostly used for this.

Lianja makes it exceedingly simple to build robust image applications that are database aware.

I would argue that there is not a better platform than Lianja to quickly build image recognition, image processing, image tracking etc.

With it's support for python, you can build image apps faster than in any platform.

And for those of you not familiar with Version 3.0, you can see some of incredible IDE improvements.
https://www.youtube.com/watch?v=bF1096tC8pk

---

---

​All topics in [Answers] alphabetically: http://www.lianja.com/community/show...p?2717-Answers

[josipradnik]

Q:
What sections/gadgets can i use for adding and displaying multiple images for one record, similar to the fancybox gallery for web pages?
The number of images to upload and display is not fix, could be 2,3,4....up to say max 10.

A:
For a variable number of images, I would separate them out into individual records in another table with a key/ID to relate them. That way you could display the main record and have a related section for the images. For example, you could use a CatalogView section and specify a filter (CatalogView options): childkey = {parent.parentkey}. You can then use the delegates to open an expanded view of the image if required.
https://www.lianja.com/doc/index.php...ogView_Options

---

Here's a quick example of using OCR in lianja to pull text/data from an image.
I am using pytesseract, an open source version of googles tesseract OCR engine.
I am also using the Lianja Draw method and opencv.
https://youtu.be/fvLQgdbcpeo

---

Q:
I created a blank page, added a form section, dropped a table into it containing 3 fields (name, tel, photo). In Preview mode, i can add a new record with name and tel. However, I edit records and try to double click the image field without response. So how can i upload a new photo?




A:
when you create a new Section by dragging field from the data source, I think is better to drag separately this kind of field..

A2:
I deleted the photo field, and re-drag and drop the field from the table. And it works now.

---

---

All topics in [Answers] alphabetically: http://www.lianja.com/community/show...ll=1#post12352

These answers are also systematized on the site "Lianja developer": https://lianjadeveloper.wordpress.com/category/image/

[gontran]

Hello I have two table one have a blob field name 'foto_frente' I try to copy this field to other table with blob field name 'imagen' I use this

update on imagen from CALLLLLLLMLM replace imagen with CALLLLLLLMLM.foto_frente
and I have this error.

Illegal use of GRAPHIC field

How can I copy blob field to other table with blob field?

Thanks for the help

[barrymavin]

Hi Gontran,

Use objectWrite() to write the blob and REPLACE the blob field with the temporary file returned from it.

If you REPLACE a blob with a character expression it is assumed to be a filename.

Remember to delete the temporary file afterwards.

[gontran]

Thanks for the help it works perfect

Regards

[gontran]

Hello I have a desktop app, and I use a webview to make a report I use a svg for background and works fine in my rsp file, but if I use :

? ('<img src="..\objeto1.png"><br>')

dont show my image. Why?

Thanks for the help

[barrymavin]

See
https://www.lianja.com/doc/index.php...ENCODE_IMAGE()

you cannot reference an image like that in a desktop WebView section. Also you should use / not \ for folder separators.