April 30, 2024, 09:02:27 PM

News:

IonicWind Snippit Manager 2.xx Released!  Install it on a memory stick and take it with you!  With or without IWBasic!


New control in development

Started by LarryMc, September 12, 2014, 06:07:33 PM

Previous topic - Next topic

0 Members and 1 Guest are viewing this topic.

LarryMc

After reading some conversations on another forum I got to looking at the following IWBasic image commands:

LoadImage, ShowImage, and DeleteImage.

When using LoadImage the user has to specify the type of image with a flag:
@IMGBITMAP - bitmap (*.bmp)
@IMGICON - Icon (*.ico)
@IMGCURSOR - Cursor (*.cur)
@IMGEMF - Enhanced meta file (*.emf)
@IMGSCALABLE - scalable bitmap, JPEG (*.jpg) or GIF (*.gif) files.

and is required to use the same flag with DeleteImage.

Also, if you want to display an image in a dialog the User is required to create a child window of the dialog and show the image in that child window.

So, basically IWBasic handles BMP, ICO, CUR, EMF, JPG, GIF.

The discussion that prompted me to look into this revolved around PNG images AND how to get the dimensions of said image.

After about 12 hours of trial and error I discover how to load PNG images and get their dimensions.
What I finally stumbled on was not only how to load PNG images but, with the same code load BMP, ICON, GIF, JPEG, Exif, PNG, TIFF, WMF, and EMF images and get the dimensions of each one with the same code.

I was able to accomplish the above without having to declare what type of image I was loading other than by the file name extension.
My 1st thoughts were to not use a new control but, after thinking about what I did in my custom control tutorial I decided that by making it into a custom control I could eliminate the requirement of a DeleteImage type command for cleanup (but one to remove an image from the screen) and the ShowImage command.
Also, by creating a control I simply the displaying an image in a dialog.

With this custom image control the current image commands will still be needed in some cases; but for most cases this new control will do what Users need.

I am currently in Step 14 of my tutorial on custom control shown here
Right now I'm thinking of using flags for borders and such
Also thinking of commands to:
set background color,
missing image text,
border width and color
delete control,
click image to show enlarged image in popup window

So, I welcome any suggestions users may have.  Post them as comments to this thread.


I really don't think it will take me too long to get this built.
LarryMc
Larry McCaughn :)
Author of IWB+, Custom Button Designer library, Custom Chart Designer library, Snippet Manager, IWGrid control library, LM_Image control library

Brian

Larry,

In my previous gainful employment, we used a lot of EPS/EPSF (Encapsulated PostScript) files. These, I believe, contained either a
TIF/TIFF or JPG/JPEG image preview in the file, which was used for viewing

Any chance of a look at this format? This control sounds rather exciting!

Brian

LarryMc

I'll look but I can't promise anything.
LarryMc
Larry McCaughn :)
Author of IWB+, Custom Button Designer library, Custom Chart Designer library, Snippet Manager, IWGrid control library, LM_Image control library

Bruce Peaslee

Sounds good. I have one concern, however. I took a class recently in web design (just to keep off the street) and ran into a problem with PNG images and colors. IE did something to the images so that the colors did not carry over properly to the web page. Because of the time pressures of a class, and the fact the instructor insisted that the pages appear properly in all browsers, I never got it straight and finally used a different image type. I do not know if this is even an issue here.
Bruce Peaslee
"Born too loose."
iTired (There's a nap for that.)
Well, I headed for Las Vegas
Only made it out to Needles

LarryMc

I don't think it is going to be a problem; at least it hasn't been one with the multicolored images I'm displayed so far.

My problem right now is getting the code right for using the control in a dialog.
In a window it has been pretty easy but dialogs handle stuff differently and I just haven't hit on the right combination yet.
LarryMc
Larry McCaughn :)
Author of IWB+, Custom Button Designer library, Custom Chart Designer library, Snippet Manager, IWGrid control library, LM_Image control library

LarryMc

Making good progress.
I have built the code that actually displays the image and, if the image can't be found displays a message in place of the image.
The above code works for both windows and dialogs.

My current major breakthrough was how to create the control.
The problem was that when controls are added to a window with the CONTROL command they immediately exist and you can immediately modify the control; change font, color, size, etc

With a dialog, when a control is added with the CONTROL command the control doesn't exist at that time so you can't modify the control.
The control does not exist until the dialog is displayed with either SHOWIMAGE or DOMODAL
That means any modifications to the control (; change font, color, size, etc) can't occur until @IDINITDIALOG is called in the dialogs message handler.

To solve this problem there will be two commands that have to be called to implement my image control.

One will be something like ImgCreate that will follow the OPENWINDOW or CREATEDIALOG commands
The other will be something like ImgInit that will be in the @IDCREATE or @IDINITDIALOG sections of the corresponding message handlers

I think the requirement for the 2 commands is a small  price to pay to be able to use one coding format to display all the listed images on both windows and dialogs.

So now, my next step is to tidy up the code for create and init and then work on the aux commands:

control background color(normally not seen when image is displayed;image is stretched to fit control
option/flag to maintain size ratio of image; one dimension fills control and the other doesn't thus showing part of background color

frame or no frame around image
color of frame
width of frame
user defined "missing img" text
font of text
color of text  of above text
frame or no frame around missing image text
color of frame
width of frame

and I may think of some more (I'm open to suggestions)
LarryMc
Larry McCaughn :)
Author of IWB+, Custom Button Designer library, Custom Chart Designer library, Snippet Manager, IWGrid control library, LM_Image control library

Brian

Larry,

Have you thought of a command to automatically resize the displayed image
(proportionately, of course) to the size of the created display frame?

Brian

LarryMc

normally the image will be made to fill the rectangle the user specifies when the control is created.
to answer your question
yes

Quoteoption/flag to maintain size ratio of image; one dimension fills control and the other doesn't thus showing part of background color
from previous post.

but thanks  ;)
LarryMc
Larry McCaughn :)
Author of IWB+, Custom Button Designer library, Custom Chart Designer library, Snippet Manager, IWGrid control library, LM_Image control library

Brian

Sorry, must remember to RTFM!

Brian

(Good work on the remove listbox border, Larry)

LarryMc

I have basically implemented all the functionality inside the custom control's message handler.
I do have to go back through and make sure I've deleted all handles so I don't have any memory leaks.

As advertised I can load/display the following image types - BMP, ICON, GIF, JPEG, Exif, PNG, TIFF, WMF, and EMF
These are the functions the user can perform once I get them all coded
Create and initialize the image(2 commands that are used identically with WINDOWs and DIALOGs DONE)
Image fills entire control or, optionally maintains image ratio and only fills control in one direction.
Change the background color of the control

Draw a border around the image , if desired, when the image is present(set color and width)
Draw text on the image, if desired, when the image is present
   (set text, text color, font and location; center, top left, top center, top right, bottom left, bottom center, and bottom right)
   text can also be multiline

Draw a border around the control , if desired, when the image is missing(set color and width)
Draw text on the control, if desired, when the image is missing
   (set text, text color, font) located in the center
   text can also be multiline
Clicking or double-clicking on the image will send message to parent window

All the subroutines will be real simple to code the way I have things structured.

There is also a command that allows the user to get the dimensions of one of the images listed above without loading an image - DONE

When released it will be in the form of a static lib so if you use it you don't have to worry about a dll accompanying your app.

And coding this control gave me an idea for another little control that I won't mention right now.


LarryMc
Larry McCaughn :)
Author of IWB+, Custom Button Designer library, Custom Chart Designer library, Snippet Manager, IWGrid control library, LM_Image control library

Brian

Larry,

After using the draw text and draw border functions, will the user be able to save the altered image?

Brian

LarryMc

hadn't intended to but I'll look into it.
LarryMc
Larry McCaughn :)
Author of IWB+, Custom Button Designer library, Custom Chart Designer library, Snippet Manager, IWGrid control library, LM_Image control library

Brian

Well, I just thought it wouldn't be much use having the extra drawing functions,
and then losing them

Brian

LarryMc

Did a little looking and I'm pretty sure I can give you a command to do it.
LarryMc
Larry McCaughn :)
Author of IWB+, Custom Button Designer library, Custom Chart Designer library, Snippet Manager, IWGrid control library, LM_Image control library

LarryMc

decided to put my beta out for people to try while I'm getting rid of any memory leaks
As a reminder this library is to enable users to display the following image type in a window or dialog:
   PNG, BMP, ICON, GIF, JPEG, Exif, PNG, TIFF, WMF, and EMF
without using any of the following commands:
   LOADIMAGE
   SHOWIMAGE
   DELETEIMAGE

The zip includes
   .lib file which goes in your IWBDev\libs folder
   .inc file which goes in your IWBDev\inc folder
   readme.txt file that describes all the commands
and a "special" testing file
This file uses a compiler directive on line 7
spread through the program  are $IFDEF/$ELSE/$ENDIF compiler directives

When line 7 IS NOT commented the program operates like a dialog based app.
If line 7 IS commented the program operates like a window based app.

I rigged this test program because windows and dialogs handle controls differently and I needed to continually test both formats

Revised: Removed beta version - See official release here
LarryMc
Larry McCaughn :)
Author of IWB+, Custom Button Designer library, Custom Chart Designer library, Snippet Manager, IWGrid control library, LM_Image control library

aurelCB

Is this based on GDI+ ?
Because as far as i know with few GDI+ functions you can load PNG or other image formats.

Brian

Larry,

Well, it's certainly quick! Don't understand the image resizing, though...

I have a window 1024 x 768. If I set LMImage_MaintainImageRatio to 0, my test jpg image displays fine
within the window, and shows all the picture

If I set LMImage_MaintainImageRatio to 1, all the image is there in the window, but squashed horizontally
by about half the width

Don't bark at me, I'm still testing!

Brian

LarryMc

LarryMc
Larry McCaughn :)
Author of IWB+, Custom Button Designer library, Custom Chart Designer library, Snippet Manager, IWGrid control library, LM_Image control library

Brian


LarryMc

can you send me a screen shot of each case?

BTW, I just lost 80 % of the code for the lib file.

I was in too big of a hurry to start on another control idea.
I thought I had move a copy of the lib source to another folder when in fact I had actually MOVED the only copy of the source to the new folder
I think deleted 80% of the code in the file because I didn't need it for the new control.  POOF!!

LarryMc
Larry McCaughn :)
Author of IWB+, Custom Button Designer library, Custom Chart Designer library, Snippet Manager, IWGrid control library, LM_Image control library

Brian

Oh no! Can you not use a file recovery program to try and get it back? I have used this before:
https://www.piriform.com/recuva/download

Anyway, two screenshots here. My youngest daughter is behind the lady with the camera. My
grandson is the one with the silly hat on next to the camerawoman

It was taken at an Embrace concert at Knebworth about two weeks ago

Brian

LarryMc

Okay, now, what size is the control in each case LMImage_Create?
It looks like you are using two different size controls with 2 different images.

You're comparing apples to oranges I believe.

To see what is really going on use the same image; just one.

Use the same control dimension and make the control a different shape/size from the image

LMImage_MaintainImageRatio to 0
the image should completely fill the control and the image should be distorted

LMImage_MaintainImageRatio to 1
the image should fill the control in one direction only; the other direction will have a band and the image should not be distorted at all.

LarryMc
Larry McCaughn :)
Author of IWB+, Custom Button Designer library, Custom Chart Designer library, Snippet Manager, IWGrid control library, LM_Image control library

Brian

No, it was the same picture both times. This time I made the image window
half the dimensions of the picture, and then tried the 0 and 1 again - same picture

Result attached

Brian

LarryMc

I'll have a look at my calculations once I reconstruct my lib source file.  Will be a few days.
LarryMc
Larry McCaughn :)
Author of IWB+, Custom Button Designer library, Custom Chart Designer library, Snippet Manager, IWGrid control library, LM_Image control library

LarryMc

Making good headway on reconstructing the library.

As it turned out all the testing I had to do in order to figure out how to do what I wanted do had a plus side.

I had all kinds of test files and each contained a little of the final code I used.

I've got the basic structure coded again.
All the user subroutines are built.
What I left with is recreating code in WM_PAINT that does, among other things, the ratioing of the image and the displaying of text on the image
LarryMc
Larry McCaughn :)
Author of IWB+, Custom Button Designer library, Custom Chart Designer library, Snippet Manager, IWGrid control library, LM_Image control library